1
0
mirror of https://git.sr.ht/~cadence/cloudtube synced 2024-11-14 12:27:28 +00:00
cloudtube/sass/includes/nav.sass

55 lines
876 B
Sass
Raw Normal View History

2020-10-02 12:32:56 +00:00
@use "colors.sass" as c
@use "buttons.sass" as *
@mixin thin
@media screen and (max-width: 499px)
@content
.main-nav
background-color: c.$bg-accent
display: flex
padding: 8px
box-shadow: 0px 0px 20px 5px rgba(0, 0, 0, 0.1)
+thin
display: block
.links
display: flex
+thin
margin-bottom: 4px
padding: 1px
.link
@include button-base
text-decoration: none
margin: 1px 8px 1px 0px
font-size: 20px
display: flex
align-items: center
&.home
font-weight: bold
&, &:visited
color: #fff
&:focus, &:hover
background-color: c.$bg-accent-x
.search-form
display: flex
flex: 1
align-items: center
.search
@include button-bg
padding: 10px
flex: 1
margin: 1px
&:hover, &:focus
border: 1px solid c.$edge-grey
margin: 0px