many new

src/components/Navbar/Navbar.sass

@@ -1,93 +0,0 @@
-$hoverColor: #f22
-
-.Minimized
-  height: 3rem
-
-.Expanded
-  min-height: 3rem
-
-  &__Links
-    position: relative
-    width: 100%
-
-.Header
-  color: var(--main-color)
-  background-color: var(--nav-bg-color)
-  display: flex
-  justify-content: space-between
-  align-items: flex-start
-  flex-wrap: wrap
-
-  &__Links, &__User
-    min-height: 3rem
-    display: flex
-    flex-wrap: wrap
-
-  &_Button
-    font-size: 1rem
-    padding: .5rem
-    color: var(--main-color)
-    background-color: var(--nav-bg-color)
-    border: none
-    display: flex
-    justify-content: center
-    align-items: center
-    cursor: pointer
-    position: relative
-
-    &::before
-      content: ""
-      width: 100%
-      position: absolute
-      bottom: 0
-      left: 0
-      height: 0
-      background: $hoverColor
-      transition: heigth .1s ease-in
-      -webkit-transition: height .1s ease-in
-
-    &:hover
-      background-color: var(--main-bg-color)
-
-      &::before
-        height: 5px
-
-  &__User
-    justify-content: flex-end
-
-    &_Profile
-      display: flex
-      align-items: center
-      font-size: 1rem
-      height: 3rem
-      color: var(--main-color)
-      background-color: var(--nav-bg-color)
-      border: none
-      border-radius: 0
-      padding: 0 .5rem
-      position: relative
-
-      &::before
-        content: ""
-        width: 100%
-        position: absolute
-        bottom: 0
-        left: 0
-        height: 0
-        background: $hoverColor
-        transition: heigth .1s ease-in
-        -webkit-transition: height .1s ease-in
-
-      &:hover
-        background-color: var(--main-bg-color)
-
-        &::before
-          height: 5px
-
-    &_Avatar
-      background-size: cover
-      background-position: center
-      width: 40px
-      height: 40px
-      border-radius: 50%
-      margin-right: .2rem