diff --git a/other-module/canteen-device/canteen-nutrition-scale/index.html b/other-module/canteen-device/canteen-nutrition-scale/index.html index 705158d..e7d1379 100644 --- a/other-module/canteen-device/canteen-nutrition-scale/index.html +++ b/other-module/canteen-device/canteen-nutrition-scale/index.html @@ -37,37 +37,36 @@ color: rgba(255, 255, 255, 0.85); } .main-content { - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - height: calc(100% - 44px); + display: grid; + grid-template-columns: 1fr 1fr; gap: 16px; - padding: 24px; + padding: 24px 32px; + height: calc(100% - 44px); + align-content: start; + overflow-y: auto; } .card { display: flex; + flex-direction: column; align-items: center; - gap: 20px; - width: 480px; - padding: 24px 28px; + gap: 12px; + padding: 24px 20px; background: #1a2b4a; border-radius: 14px; text-decoration: none; cursor: pointer; transition: all 0.2s; border: 1px solid rgba(255, 255, 255, 0.06); + text-align: center; } .card:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3); border-color: rgba(74, 144, 217, 0.3); } - .card__icon { font-size: 28px; width: 40px; text-align: center; flex-shrink: 0; } - .card__info { flex: 1; } - .card__title { font-size: 16px; font-weight: 600; color: #fff; margin-bottom: 4px; } - .card__desc { font-size: 12px; color: rgba(255, 255, 255, 0.5); } - .card__arrow { font-size: 18px; color: rgba(255, 255, 255, 0.4); flex-shrink: 0; } + .card__icon { font-size: 32px; } + .card__title { font-size: 14px; font-weight: 600; color: #fff; } + .card__desc { font-size: 11px; color: rgba(255, 255, 255, 0.45); line-height: 1.4; }
@@ -80,67 +79,43 @@