diff --git a/src/main/resources/static/assets/platform/img/home/home.png b/src/main/resources/static/assets/platform/img/home/home.png index de5aa3d..703379f 100644 Binary files a/src/main/resources/static/assets/platform/img/home/home.png and b/src/main/resources/static/assets/platform/img/home/home.png differ diff --git a/src/main/resources/views/layouts/v4/home/entry.js b/src/main/resources/views/layouts/v4/home/entry.js index 70bde38..b1c82f4 100644 --- a/src/main/resources/views/layouts/v4/home/entry.js +++ b/src/main/resources/views/layouts/v4/home/entry.js @@ -6,7 +6,6 @@ const entry = {
{{ section.title }} - /Applications
@@ -135,7 +134,7 @@ const entry = { .entry-section-title { display: inline-flex; - align-items: baseline; + align-items: center; gap: 6px; color: #19324d; font-size: 18px; @@ -147,13 +146,6 @@ const entry = { font-size: 16px; } - .entry-section-title em { - color: #b5c0d6; - font-size: 14px; - font-style: normal; - font-weight: 500; - } - .apps-container { display: flex; flex-direction: column; @@ -162,11 +154,11 @@ const entry = { .app-grid { display: grid; - grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); + grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)); justify-items: center; justify-content: start; - gap: 12px 18px; - min-height: 116px; + gap: 16px 20px; + min-height: 152px; padding: 18px 20px; background: #fff; border: 1px solid #edf1f7; @@ -180,13 +172,16 @@ const entry = { display: flex; flex-direction: column; align-items: center; + justify-content: center; border-radius: 8px; background: #fff; width: 100%; max-width: 100%; - padding: 6px; + min-height: 136px; + padding: 14px 8px; cursor: pointer; transition: transform 0.2s ease, box-shadow 0.2s ease; + box-sizing: border-box; } .app-item:hover { @@ -195,9 +190,9 @@ const entry = { } .app-icon { - width: 46px; - height: 46px; - margin-bottom: 8px; + width: 68px; + height: 68px; + margin-bottom: 14px; } .app-icon img { @@ -207,10 +202,13 @@ const entry = { } .app-name { - min-height: 34px; - font-size: 12px; + display: flex; + align-items: center; + justify-content: center; + min-height: 48px; + font-size: 16px; color: #333; - line-height: 1.4; + line-height: 1.5; word-break: break-word; text-align: center; } @@ -222,19 +220,30 @@ const entry = { @media (max-width: 768px) { .app-grid { - grid-template-columns: repeat(3, minmax(72px, 1fr)); + grid-template-columns: repeat(3, minmax(96px, 1fr)); gap: 12px; padding: 14px 10px; } .app-item { - padding: 8px 4px; + min-height: 120px; + padding: 12px 6px; + } + + .app-icon { + width: 60px; + height: 60px; + } + + .app-name { + min-height: 42px; + font-size: 14px; } } @media (max-width: 480px) { .app-grid { - grid-template-columns: repeat(2, minmax(72px, 1fr)); + grid-template-columns: repeat(2, minmax(96px, 1fr)); gap: 12px; } }