refactor(components): replace Toolbar with Navbar component

* remove SearchModal and SettingsModal components
* add a generic NavbarItem component (instead of the previous toolbar
items to avoid unreadable styles...)
* move FlippingLabel component logic into NavbarItem since it is only
used here

1 files changed, 0 insertions, 63 deletions

diff --git a/src/components/organisms/toolbar/toolbar.module.scss b/src/components/organisms/toolbar/toolbar.module.scss
deleted file mode 100644
index 6c138a3..0000000
--- a/src/components/organisms/toolbar/toolbar.module.scss
+++ /dev/null
@@ -1,63 +0,0 @@
-@use "../../../styles/abstracts/functions" as fun;
-@use "../../../styles/abstracts/variables" as var;
-@use "../../../styles/abstracts/placeholders";
-
-.wrapper {
-  --toolbar-size: #{fun.convert-px(75)};
-
-  display: flex;
-  flex-flow: row wrap;
-  align-items: center;
-  gap: var(--spacing-sm);
-  width: 100%;
-  height: var(--toolbar-size);
-  position: relative;
-  background: var(--color-bg);
-  border-top: fun.convert-px(4) solid;
-  border-image: radial-gradient(
-      ellipse at top,
-      var(--color-primary-lighter) 20%,
-      var(--color-primary) 100%
-    )
-    1;
-  box-shadow: 0 fun.convert-px(-2) fun.convert-px(3) fun.convert-px(-1)
-    var(--color-shadow-dark);
-
-  :global {
-    animation: slide-in-from-bottom 0.8s ease-in-out 0s 1;
-
-    @media screen and (min-width: #{var.get-breakpoint("sm")}) {
-      animation: slide-in-from-top 0.8s ease-in-out 0s 1;
-    }
-  }
-
-  @media screen and (max-width: #{var.get-breakpoint("sm")}) {
-    justify-content: space-around;
-    position: fixed;
-    bottom: 0;
-    left: 0;
-    z-index: 5;
-
-    .modal {
-      width: 100%;
-      position: fixed;
-      top: unset;
-      left: 0;
-      bottom: calc(var(--toolbar-size) - #{fun.convert-px(4)});
-      max-height: calc(100vh - var(--toolbar-size));
-    }
-  }
-
-  @media screen and (max-height: #{var.get-breakpoint("2xs")}) {
-    --toolbar-size: #{fun.convert-px(70)};
-  }
-
-  @media screen and (min-width: #{var.get-breakpoint("sm")}) {
-    .modal {
-      &--search,
-      &--settings {
-        min-width: fun.convert-px(420);
-      }
-    }
-  }
-}