diff --git a/frontend/src/features/tabs/FloatingShowHideButton.scss b/frontend/src/features/tabs/FloatingShowHideButton.scss index ec97c434db..f7cab1966b 100644 --- a/frontend/src/features/tabs/FloatingShowHideButton.scss +++ b/frontend/src/features/tabs/FloatingShowHideButton.scss @@ -7,6 +7,12 @@ z-index: 20; padding: 0; + filter: var(--floating-button-drop-shadow); + + svg { + fill: var(--tab-list-text); + } + &.left { left: 0; border-radius: 0 0.5rem 0.5rem 0 !important; diff --git a/frontend/src/features/tabs/InvokeOptionsPanel.scss b/frontend/src/features/tabs/InvokeOptionsPanel.scss index f23820e05e..3c568a6ecc 100644 --- a/frontend/src/features/tabs/InvokeOptionsPanel.scss +++ b/frontend/src/features/tabs/InvokeOptionsPanel.scss @@ -19,13 +19,14 @@ } .options-panel-wrapper { - grid-auto-rows: max-content; + background-color: var(--background-color); height: $app-content-height; width: $options-bar-max-width; max-width: $options-bar-max-width; flex-shrink: 0; position: relative; - z-index: 20; + overflow-y: scroll; + @include HideScrollbar; .options-panel { display: flex; diff --git a/frontend/src/features/tabs/InvokeOptionsPanel.tsx b/frontend/src/features/tabs/InvokeOptionsPanel.tsx index 8098dde5e6..3ed1c13749 100644 --- a/frontend/src/features/tabs/InvokeOptionsPanel.tsx +++ b/frontend/src/features/tabs/InvokeOptionsPanel.tsx @@ -5,7 +5,6 @@ import { useHotkeys } from 'react-hotkeys-hook'; import { BsPinAngle, BsPinAngleFill } from 'react-icons/bs'; import { CSSTransition } from 'react-transition-group'; import { RootState, useAppDispatch, useAppSelector } from '../../app/store'; - import useClickOutsideWatcher from '../../common/hooks/useClickOutsideWatcher'; import { OptionsState, diff --git a/frontend/src/styles/Mixins/_Variables.scss b/frontend/src/styles/Mixins/_Variables.scss index dde87fbe24..1bac52affa 100644 --- a/frontend/src/styles/Mixins/_Variables.scss +++ b/frontend/src/styles/Mixins/_Variables.scss @@ -1,6 +1,6 @@ // Calc Values $app-cutoff: 0px; -$app-content-height-cutoff: 5rem; // default: 7rem +$app-content-height-cutoff: calc(70px + 1rem); // default: 7rem // Usage Variables // app