Fix Stats/Admin/Account showing in the bottom bar too
.nav-link-secondary's display:none sat before .nav-link's own display:flex in the file. Both are single-class selectors, so they tie on specificity, and a tie is broken by which one comes later in the file -- not by which class the element happens to carry. .nav-link's declaration, being later, won for every element wearing both classes, so Stats/Admin/Account rendered as three extra tabs on the phone bar instead of folding into "More" as intended. Moved the rule below .nav-link instead of changing either declaration, since nothing about the values was wrong -- only their order was. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -255,7 +255,6 @@ input:focus, textarea:focus { outline: none; border-color: var(--accent); box-sh
|
||||
/* Hidden here (shown from 900px below): on the phone bar the team switcher
|
||||
lives in the topbar instead, as #team-selector-mobile. */
|
||||
.nav-team-selector { display: none; }
|
||||
.nav-link-secondary { display: none; }
|
||||
.nav-link {
|
||||
position: relative;
|
||||
/* flex: 1 spreads the tabs evenly across the bar's width; the desktop
|
||||
@@ -267,6 +266,10 @@ input:focus, textarea:focus { outline: none; border-color: var(--accent); box-sh
|
||||
what stops six tabs widening the bar past the screen. */
|
||||
min-width: 0; padding: 0 2px;
|
||||
}
|
||||
/* Must come after .nav-link above: same specificity (one class each), so
|
||||
whichever is later in the file wins for an element wearing both classes,
|
||||
and this needs to beat .nav-link's display:flex here on the phone bar. */
|
||||
.nav-link-secondary { display: none; }
|
||||
.nav-label {
|
||||
max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user