1
0
mirror of https://git.sr.ht/~cadence/cloudtube synced 2024-11-24 16:37:30 +00:00
cloudtube/sass/includes/_nav.sass

59 lines
1.1 KiB
Sass
Raw Normal View History

$_theme: () !default
@use "sass:map"
@use "buttons" as *
@use "_dimensions" as dimensions
2020-10-02 12:32:56 +00:00
.main-nav
background-color: map.get($_theme, "bg-nav")
2020-10-02 12:32:56 +00:00
display: flex
padding: 8px
border-bottom: 1px solid map.get($_theme, "edge-grey")
2020-10-02 12:32:56 +00:00
+dimensions.thin
2020-10-02 12:32:56 +00:00
display: block
.links
display: flex
+dimensions.thin
2020-10-02 12:32:56 +00:00
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: map.get($_theme, "fg-bright")
2020-10-02 12:32:56 +00:00
&:focus, &:hover
background-color: map.get($_theme, "bg-4")
&.icon-link
color: map.get($_theme, "fg-dim")
&:hover, &:focus
color: map.get($_theme, "fg-bright")
2020-10-02 12:32:56 +00:00
.search-form
display: flex
flex: 1
align-items: center
.search
@include button-bg
padding: 10px
flex: 1
border: 1px solid map.get($_theme, "bg-nav")
2020-10-02 12:32:56 +00:00
&:hover, &:focus
border-color: map.get($_theme, "edge-grey")