diff options
Diffstat (limited to 'assets/sass/_nav.sass')
-rw-r--r-- | assets/sass/_nav.sass | 68 |
1 files changed, 31 insertions, 37 deletions
diff --git a/assets/sass/_nav.sass b/assets/sass/_nav.sass index 12c9a17..77d2801 100644 --- a/assets/sass/_nav.sass +++ b/assets/sass/_nav.sass @@ -4,10 +4,10 @@ width: 100% transition: height 0.4s cubic-bezier(0.52, 0.16, 0.24, 1) z-index: 999 - &_bar + &_bar width: 100% position: relative - &-wrap + &-wrap width: 1.8rem height: 1.8rem display: grid @@ -15,28 +15,27 @@ cursor: pointer z-index: 99 min-height: 1.5rem - + &, &::after, - &::before + &::before padding: 1px border-radius: 2px background-color: var(--text) - + &::after, - &::before + &::before content: "" position: absolute width: 1.2rem - - &::before + + &::before top: -0.5rem - - &::after + + &::after top: 0.5rem right: 0 - - + &-body box-shadow: 0 1.5rem 6rem rgba(0,0,0,0.17) position: fixed @@ -52,9 +51,9 @@ padding: 100px 0 min-height: 100vh z-index: 1 - &:hover + &:hover box-shadow: 0 1.5rem 6rem rgba(0,0,0,0.27) - + a display: block padding: 12.5px 25px @@ -63,16 +62,14 @@ transition:color 0.25s ease-in-out &:hover color: var(--theme) - - - + &-brand font-family: 'Cookie' font-size: 2em !important padding-top: 0 !important padding-bottom: 0 !important - - &-close + + &-close display: flex justify-content: flex-start align-items: center @@ -82,7 +79,7 @@ width: 100% cursor:pointer padding: 25px - &:after, + &:after, &:before content: '' width: 18px @@ -91,24 +88,22 @@ background: var(--text) opacity: 0.7 position: relative - - &:before + + &::before transform: rotate(20deg) translateX(1.5px) - - &:after + &::after transform: rotate(-20deg) translateX(-1.5px) - - - &-drop + + &-drop cursor: pointer top: 0 bottom: 0 z-index: 1000 - + &-exit animation: hideMenu 0.5s cubic-bezier(0.52, 0.16, 0.24, 1) forwards - - &-menu + + &-menu position: relative padding: 10px 25px 10px 0 height: 100% @@ -117,21 +112,20 @@ display: flex align-items: center justify-content: space-between - a + a color: inherit width: 100% display: block padding: 10px 25px font-size: 105% - + &-pop position: fixed width: 100vw background: rgba(0,0,0,0.05) - - &-open + + &-open animation: showMenu 0.5s cubic-bezier(0.52, 0.16, 0.24, 1) forwards - - &_item + + &_item text-transform: capitalize -
\ No newline at end of file |