Ver Fonte

fix(themes): apply intended nav row spacing in Pafat at narrow widths (#8738)

The narrow-viewport @media block in Pafat repeats the parent `.nav_menu`
class on its inner selectors (`.nav_menu .btn` etc. inside a `.nav_menu`
nesting block), which native CSS nesting expands to `.nav_menu .nav_menu
.btn` and never matches. Buttons and stick/group wrappers in the top nav
row at <=840px have therefore been falling back to default layout instead
of the intended margins.

Drop the redundant `.nav_menu` prefix on the inner selectors so the rules
apply as intended.

Activating the dormant rules also exposes an asymmetry in the base
`.nav_menu` padding (`5px 0 0 2.5rem`: 5px top, 0 bottom). Combined with
the now-active 5px button margin, buttons sit a few pixels below the
visual centre of the row. Add `padding-bottom: 5px` inside the @media
block to rebalance.

Co-authored-by: Bjørn A. Andersen <polybjorn@users.noreply.github.com>
polybjorn há 2 semanas atrás
pai
commit
5feb4ebfb3
2 ficheiros alterados com 12 adições e 10 exclusões
  1. 6 5
      p/themes/Pafat/pafat.css
  2. 6 5
      p/themes/Pafat/pafat.rtl.css

+ 6 - 5
p/themes/Pafat/pafat.css

@@ -1093,19 +1093,20 @@ a.signin {
 
 	.nav_menu {
 		padding-left: 0;
+		padding-bottom: 5px;
 
-		.nav_menu .btn {
+		.btn {
 			margin: 5px 10px;
 		}
 
-		.nav_menu .stick,
-		.nav_menu .group {
+		.stick,
+		.group {
 			margin: 0 10px;
 			min-width: 0;
 		}
 
-		.nav_menu .stick .btn,
-		.nav_menu .group .btn {
+		.stick .btn,
+		.group .btn {
 			margin: 5px 0;
 		}
 	}

+ 6 - 5
p/themes/Pafat/pafat.rtl.css

@@ -1093,19 +1093,20 @@ a.signin {
 
 	.nav_menu {
 		padding-right: 0;
+		padding-bottom: 5px;
 
-		.nav_menu .btn {
+		.btn {
 			margin: 5px 10px;
 		}
 
-		.nav_menu .stick,
-		.nav_menu .group {
+		.stick,
+		.group {
 			margin: 0 10px;
 			min-width: 0;
 		}
 
-		.nav_menu .stick .btn,
-		.nav_menu .group .btn {
+		.stick .btn,
+		.group .btn {
 			margin: 5px 0;
 		}
 	}