Browse Source

Reduce device stat cards size by ~50%

Карточки устройств были слишком большие, уменьшил:
- padding: 24px → 12px 16px
- icon size: 40px → 24px
- value font: 32px → 20px
- label font: 14px → 12px
- min width: 240px → 160px
- gap: 24px → 16px
- border-left: 4px → 3px

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
root 4 weeks ago
parent
commit
60ab86af06
1 changed files with 12 additions and 12 deletions
  1. 12 12
      frontend/src/views/superadmin/DashboardView.vue

+ 12 - 12
frontend/src/views/superadmin/DashboardView.vue

@@ -582,19 +582,19 @@ onUnmounted(() => {
 /* Device Stats */
 /* Device Stats */
 .stats-grid {
 .stats-grid {
   display: grid;
   display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
-  gap: 24px;
+  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
+  gap: 16px;
   margin-bottom: 32px;
   margin-bottom: 32px;
 }
 }
 
 
 .stat-card {
 .stat-card {
   background: white;
   background: white;
-  border-radius: 12px;
-  padding: 24px;
+  border-radius: 8px;
+  padding: 12px 16px;
   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
-  gap: 16px;
+  gap: 12px;
   transition: transform 0.2s;
   transition: transform 0.2s;
 }
 }
 
 
@@ -604,19 +604,19 @@ onUnmounted(() => {
 }
 }
 
 
 .stat-online {
 .stat-online {
-  border-left: 4px solid #10b981;
+  border-left: 3px solid #10b981;
 }
 }
 
 
 .stat-offline {
 .stat-offline {
-  border-left: 4px solid #6b7280;
+  border-left: 3px solid #6b7280;
 }
 }
 
 
 .stat-error {
 .stat-error {
-  border-left: 4px solid #ef4444;
+  border-left: 3px solid #ef4444;
 }
 }
 
 
 .stat-icon {
 .stat-icon {
-  font-size: 40px;
+  font-size: 24px;
 }
 }
 
 
 .stat-content {
 .stat-content {
@@ -624,14 +624,14 @@ onUnmounted(() => {
 }
 }
 
 
 .stat-value {
 .stat-value {
-  font-size: 32px;
+  font-size: 20px;
   font-weight: 700;
   font-weight: 700;
   color: #1a202c;
   color: #1a202c;
-  margin-bottom: 4px;
+  margin-bottom: 2px;
 }
 }
 
 
 .stat-label {
 .stat-label {
-  font-size: 14px;
+  font-size: 12px;
   color: #718096;
   color: #718096;
   font-weight: 500;
   font-weight: 500;
 }
 }