lexton-it/NextWks
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(ui): iOS-style icon grid, no cards, clean labels, 3-4-6 columns

Browse source
This commit is contained in:
Claus Lohmar 2026-06-14 17:52:36 +00:00
parent a4163b6595
commit c42525bc05
2 changed files with 25 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

45
src/core/ui/launcher.templ
View file

@ -110,40 +110,43 @@ templ workspaceCSS() {
font-weight:600;font-size:15px;color:#fff;flex-shrink:0 font-weight:600;font-size:15px;color:#fff;flex-shrink:0
} }
.avatar.sm{width:32px;height:32px;font-size:13px} .avatar.sm{width:32px;height:32px;font-size:13px}
.content{flex:1;padding:20px 16px;max-width:1200px;margin:0 auto;width:100%} .content{flex:1;padding:24px 16px;max-width:900px;margin:0 auto;width:100%}
.greeting{display:flex;align-items:center;gap:14px;margin-bottom:28px} .greeting{display:flex;align-items:center;gap:12px;margin-bottom:24px}
.greeting-text h1{font-size:1.4rem;font-weight:600;color:var(--text);line-height:1.3} @media(min-width:600px){.greeting{margin-bottom:32px}}
.greeting-text p{color:var(--text2);font-size:0.9rem;margin-top:2px} .greeting-text h1{font-size:1.25rem;font-weight:600;color:var(--text);line-height:1.3}
.greeting-text p{color:var(--text2);font-size:0.85rem;margin-top:2px}
/* App Grid */ /* App Grid */
.app-grid{ .app-grid{
display:grid; display:grid;
grid-template-columns:repeat(2,1fr); grid-template-columns:repeat(3,1fr);
gap:10px gap:20px 10px; padding:8px 0
} }
@media(min-width:600px){.app-grid{grid-template-columns:repeat(3,1fr);gap:12px}} @media(min-width:600px){.app-grid{grid-template-columns:repeat(4,1fr);gap:24px 14px}}
@media(min-width:900px){.app-grid{grid-template-columns:repeat(4,1fr);gap:14px}} @media(min-width:900px){.app-grid{grid-template-columns:repeat(6,1fr);gap:28px 16px}}
/* App Card */ /* App Card */
.app-card{ .app-card{
background:var(--surface); border:1px solid var(--border); display:flex; flex-direction:column; align-items:center; gap:6px;
border-radius:var(--radius-sm); padding:16px 12px; cursor:pointer; text-decoration:none; color:inherit; padding:8px 4px;
cursor:pointer; transition:all 0.2s; text-decoration:none; color:inherit; border-radius:12px; transition:all 0.15s; -webkit-tap-highlight-color:transparent
display:flex; flex-direction:column; align-items:center; gap:8px;
aspect-ratio:1; justify-content:center; position:relative
} }
.app-card:active{transform:scale(0.97)} .app-card:active{transform:scale(0.92)}
.app-card:hover{border-color:var(--surface3); box-shadow:0 2px 12px rgba(0,0,0,0.2)} .app-card:hover{background:rgba(255,255,255,0.03)}
.app-card .app-icon{ .app-card .app-icon{
width:44px;height:44px;border-radius:var(--radius-sm); width:56px;height:56px;border-radius:14px;
display:flex;align-items:center;justify-content:center;flex-shrink:0 display:flex;align-items:center;justify-content:center;flex-shrink:0
} }
.app-card .app-icon svg{width:22px;height:22px} @media(min-width:600px){.app-card .app-icon{width:64px;height:64px;border-radius:16px}}
.app-card .app-name{font-size:0.85rem;font-weight:500;color:var(--text);text-align:center;line-height:1.2} .app-card .app-icon svg{width:28px;height:28px}
.app-card .app-badge{ @media(min-width:600px){.app-card .app-icon svg{width:32px;height:32px}}
font-size:0.7rem;color:var(--text3);position:absolute;bottom:6px .app-card .app-name{
font-size:0.72rem;font-weight:400;color:var(--text);text-align:center;
line-height:1.2;max-width:72px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap
} }
.app-card.disabled{opacity:0.4;cursor:default} @media(min-width:600px){.app-card .app-name{font-size:0.78rem}}
.app-card .app-badge{display:none}
.app-card.disabled{opacity:0.35;cursor:default}
.app-card.disabled:active{transform:none} .app-card.disabled:active{transform:none}
/* Overlay & Modal */ /* Overlay & Modal */

2
src/core/ui/launcher_templ.go
View file

File diff suppressed because one or more lines are too long