대시보드 UI 개선, 한글깨짐 처리.

WebContent/dashboard-modern/css/components.css

@@ -1,6 +1,6 @@
-/* components.css - 공통 컴포넌트 스타일 정의 */
+/* components.css - 공통 컴포넌트 스타일 정의 */
 
-/* 카드 컴포넌트 */
+/* 카드 컴포넌트 */
 .card {
   background-color: white;
   border-radius: var(--rounded-md);
@@ -51,7 +51,7 @@
   height: 100%;
 }
 
-/* 버튼 컴포넌트 */
+/* 버튼 컴포넌트 */
 .btn {
   display: inline-flex;
   align-items: center;
@@ -129,7 +129,7 @@
   color: white;
 }
 
-/* 필터 및 탭 컴포넌트 */
+/* 필터 및 탭 컴포넌트 */
 .filter-group {
   display: flex;
   gap: 0.5rem;
@@ -223,7 +223,7 @@
   display: block;
 }
 
-/* 상태 표시 컴포넌트 */
+/* 상태 표시 컴포넌트 */
 .server-status-badge,
 .status-badge {
   display: inline-flex;
@@ -258,7 +258,7 @@
   margin-right: 0.25rem;
 }
 
-/* 상태 인디케이터 */
+/* 상태 인디케이터 */
 .instance-status {
   display: inline-block;
   width: 0.625rem;
@@ -283,7 +283,7 @@
   background-color: var(--color-gray-400);
 }
 
-/* 테이블 컴포넌트 */
+/* 테이블 컴포넌트 */
 .instance-table,
 .transaction-table,
 .adapter-table {
@@ -335,14 +335,14 @@
   color: var(--color-gray-800);
 }
 
-/* 검색 컴포넌트 */
+/* 검색 컴포넌트 */
 .search-container {
   position: relative;
   width: 100%;
   max-width: 300px;
 }
 
-/* 검색 컴포넌트 */
+/* 검색 컴포넌트 */
 .search-container {
   position: relative;
   width: 250px;
@@ -371,7 +371,7 @@
   box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.2);
 }
 
-/* 차트 컨테이너 */
+/* 차트 컨테이너 */
 .chart-container {
   height: 184px;
   width: 100%;
@@ -391,7 +391,7 @@
   font-weight: 500;
 }
 
-/* 로딩 애니메이션 */
+/* 로딩 애니메이션 */
 .loading {
   position: relative;
 }
@@ -427,7 +427,7 @@
   z-index: 11;
 }
 
-/* 메트릭 컴포넌트 */
+/* 메트릭 컴포넌트 */
 .metric-group {
   display: flex;
   align-items: center;
@@ -483,7 +483,7 @@
   text-decoration: underline;
 }
 
-/* 토글 버튼 */
+/* 토글 버튼 */
 .toggle-details {
   background: none;
   border: none;
@@ -507,7 +507,7 @@
   transform: rotate(180deg);
 }
 
-/* 테이블 컴포넌트 */
+/* 테이블 컴포넌트 */
 .table-container {
   overflow-x: auto;
   margin-bottom: 0.75rem;
@@ -540,7 +540,7 @@ table tr:hover td {
   background-color: var(--color-gray-50);
 }
 
-/* 알림 컴포넌트 */
+/* 알림 컴포넌트 */
 .alert {
   padding: 0.75rem;
   border-radius: var(--rounded);
@@ -589,7 +589,7 @@ table tr:hover td {
   color: var(--color-danger-dark);
 }
 
-/* 로딩 스피너 */
+/* 로딩 스피너 */
 .spinner {
   display: inline-block;
   width: 1.5rem;
@@ -606,7 +606,7 @@ table tr:hover td {
   }
 }
 
-/* 페이지네이션 */
+/* 페이지네이션 */
 .pagination {
   display: flex;
   justify-content: center;
@@ -644,7 +644,7 @@ table tr:hover td {
   pointer-events: none;
 }
 
-/* 툴팁 */
+/* 툴팁 */
 .tooltip {
   position: relative;
   display: inline-block;
@@ -685,7 +685,7 @@ table tr:hover td {
   opacity: 1;
 }
 
-/* 애니메이션 */
+/* 애니메이션 */
 @keyframes pulse {
   0% {
     opacity: 1;
@@ -698,12 +698,12 @@ table tr:hover td {
   }
 }
 
-/* 새로고침 버튼 애니메이션 */
+/* 새로고침 버튼 애니메이션 */
 .refresh-btn-spin {
   animation: spin 1s linear infinite;
 }
 
-/* 컴팩트 모드 추가 스타일 */
+/* 컴팩트 모드 추가 스타일 */
 .compact-mode .card {
   padding: 0.5rem;
 }
@@ -728,7 +728,7 @@ table tr:hover td {
   padding-bottom: 0.4rem;
 }
 
-/* peak 필터 스타일 */
+/* peak 필터 스타일 */
 .peak-filter-group {
   display: flex;
   gap: 0.5rem;