header nav: switch to dropdown menus
This commit is contained in:
parent
996a0760b6
commit
7a5bb77545
@ -1,13 +1,11 @@
|
|||||||
header
|
header
|
||||||
width: 100vw
|
width: 100vw
|
||||||
min-height: 3em
|
|
||||||
|
|
||||||
background-color: green
|
background-color: green
|
||||||
color: white
|
color: white
|
||||||
font-weight: 600
|
font-weight: 600
|
||||||
font-size: 1.2em
|
font-size: 1.2em
|
||||||
line-height: 1.5em
|
line-height: 1.5em
|
||||||
white-space: nowrap
|
|
||||||
|
|
||||||
a
|
a
|
||||||
color: white
|
color: white
|
||||||
@ -17,25 +15,30 @@ header
|
|||||||
text-decoration: none
|
text-decoration: none
|
||||||
|
|
||||||
// parent menu
|
// parent menu
|
||||||
& > nav ul
|
& > nav > ul
|
||||||
display: inline
|
display: inline
|
||||||
list-style-type: none
|
list-style-type: none
|
||||||
margin: 0
|
margin: 0
|
||||||
padding: 0
|
padding: 0
|
||||||
overflow: hidden
|
|
||||||
|
|
||||||
// menu items
|
// menu items
|
||||||
& > li
|
& > li
|
||||||
display: inline
|
display: inline-block
|
||||||
padding: 4px 20px
|
padding: 4px 20px
|
||||||
|
white-space: nowrap
|
||||||
|
|
||||||
// submenus
|
|
||||||
& > ul
|
|
||||||
display: none
|
|
||||||
position: absolute
|
|
||||||
width: 100vw
|
|
||||||
z-index: 1
|
|
||||||
&:hover
|
&:hover
|
||||||
background-color: red
|
background-color: red
|
||||||
& > ul
|
& > ul
|
||||||
display: block
|
display: block
|
||||||
|
|
||||||
|
// submenus
|
||||||
|
& > ul
|
||||||
|
background-color: black
|
||||||
|
display: none
|
||||||
|
position: absolute
|
||||||
|
z-index: 1
|
||||||
|
list-style-type: none
|
||||||
|
|
||||||
|
& > li:hover
|
||||||
|
background-color: red
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user