r/p5.js-web-editor
1
0
Fork 0
Code Issues 1 Pull requests Releases 1 Wiki Activity

fix nav dropdown styling

Browse source
This commit is contained in:
Cassie Tarakajian 2016-09-21 19:00:24 -04:00
parent c55e1f5de4
commit a3490a37ef
1 changed files with 13 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
client/styles/components/_nav.scss
View file

@ -23,21 +23,24 @@
margin-left: #{20 / $base-font-size}rem; margin-left: #{20 / $base-font-size}rem;
} }
position: relative; position: relative;
&:hover .nav__dropdown {
display: flex;
}
} }
.nav__dropdown { .nav__dropdown {
display: none; @include themify() {
position: absolute; background-color: map-get($theme-map, 'background-color');
flex-direction: column; border: 1px solid map-get($theme-map, 'ide-border-color');
background-color: $light-background-color; }
padding: #{10 / $base-font-size}rem; @extend %hidden-element;
left: #{-10 / $base-font-size}rem;
border: 1px solid $ide-border-color;
& li + li { & li + li {
margin-top: #{10 / $base-font-size}rem; margin-top: #{10 / $base-font-size}rem;
} }
width: #{140 / $base-font-size}rem; width: #{140 / $base-font-size}rem;
.nav__item:hover & {
display: flex;
position: absolute;
flex-direction: column;
padding: #{10 / $base-font-size}rem;
left: #{-10 / $base-font-size}rem;
height: auto;
}
} }