diff options
Diffstat (limited to 'src/components/organisms/toolbar/toolbar.module.scss')
| -rw-r--r-- | src/components/organisms/toolbar/toolbar.module.scss | 63 |
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); - } - } - } -} |
