Fix bottom nav full-width layout + add backend URL autofill
- Remove max-width/gap/padding from bottom nav so buttons fill full screen width - Add NS_BACKEND_URL to config.js entrypoint and autofill backend-url field on setup screen Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
1 parent
b6edfcf14b
commit
a5461ff92c
6 files changed
+17
-17
No files matched your search
+8
-9
@@ -362,18 +362,17 @@ nav{flex:1;overflow-y:auto;padding:4px 10px}
|
||||
backdrop-filter:blur(28px);
|
||||
border-top:1px solid var(--border2);
|
||||
z-index:200;
|
||||
padding:0 4px;
|
||||
padding-bottom:env(safe-area-inset-bottom);
|
||||
}
|
||||
.bottom-nav-inner{
|
||||
display:flex;flex-direction:column;align-items:stretch;
|
||||
height:100%;max-width:500px;margin:0 auto;
|
||||
height:100%;width:100%;
|
||||
}
|
||||
.bnav-item{
|
||||
display:flex;flex-direction:column;align-items:center;gap:4px;
|
||||
padding:8px 12px;border-radius:12px;cursor:pointer;
|
||||
display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
|
||||
padding:6px 4px;border-radius:10px;cursor:pointer;
|
||||
font-size:10px;font-weight:600;color:var(--text3);
|
||||
letter-spacing:.3px;min-width:52px;text-align:center;
|
||||
letter-spacing:.3px;text-align:center;
|
||||
transition:color .15s,background .15s;
|
||||
border:none;background:none;font-family:var(--font);
|
||||
-webkit-tap-highlight-color:transparent;
|
||||
@@ -384,10 +383,10 @@ nav{flex:1;overflow-y:auto;padding:4px 10px}
|
||||
.bnav-item svg{flex-shrink:0;transition:transform .15s}
|
||||
.bnav-item:active svg{transform:scale(.88)}
|
||||
/* Tab strip */
|
||||
.bnav-tabs{display:flex;justify-content:center;gap:6px;padding:5px 16px 2px;flex-shrink:0}
|
||||
.bnav-tabs{display:flex;width:100%;padding:4px 8px 2px;flex-shrink:0;gap:4px}
|
||||
.bnav-tab{flex:1;padding:3px 0;border-radius:7px;border:none;font-family:var(--font);font-size:10px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--text3);cursor:pointer;background:none;transition:color .15s,background .15s;-webkit-tap-highlight-color:transparent}
|
||||
.bnav-tab.active{background:var(--surface2);color:var(--text)}
|
||||
.bnav-pages{display:grid;grid-template-columns:repeat(4,1fr);align-items:center;width:100%;gap:6px;flex:1}
|
||||
.bnav-pages{display:grid;grid-template-columns:repeat(4,1fr);align-items:stretch;width:100%;flex:1}
|
||||
|
||||
@media(max-width:768px){
|
||||
.bottom-nav{display:flex;flex-direction:column;justify-content:flex-start}
|
||||
@@ -400,8 +399,8 @@ nav{flex:1;overflow-y:auto;padding:4px 10px}
|
||||
.preview-bar{bottom:calc(var(--player-h) + 80px)}
|
||||
.toast-container{bottom:calc(var(--player-h) + 80px + 16px)}
|
||||
.jobs-panel{bottom:calc(var(--player-h) + 80px + 16px)}
|
||||
.bnav-pages{grid-template-columns:repeat(4,1fr);gap:6px}
|
||||
.bnav-item{min-width:0;width:100%;padding:8px 0 6px;box-sizing:border-box}
|
||||
.bnav-pages{grid-template-columns:repeat(4,1fr)}
|
||||
.bnav-item{min-width:0;width:100%;padding:6px 2px;box-sizing:border-box}
|
||||
#settings-modal{align-items:flex-start;padding-top:max(env(safe-area-inset-top),16px);padding-bottom:calc(var(--player-h) + 80px + env(safe-area-inset-bottom) + 8px)}
|
||||
#settings-modal .modal{max-height:100%!important;overflow:hidden}
|
||||
}
|
||||
|
||||
Reference in new issue
Block a user