From b7e39b59fd0fc7b5610ebff29035bf622079e0d8 Mon Sep 17 00:00:00 2001 From: ivarlovlie Date: Wed, 5 Oct 2022 20:45:21 +0800 Subject: refactor: Change file structure --- .../src/styles/components/adv-custom-select.scss | 79 ---------------------- 1 file changed, 79 deletions(-) delete mode 100644 old-apps/web-shared/src/styles/components/adv-custom-select.scss (limited to 'old-apps/web-shared/src/styles/components/adv-custom-select.scss') diff --git a/old-apps/web-shared/src/styles/components/adv-custom-select.scss b/old-apps/web-shared/src/styles/components/adv-custom-select.scss deleted file mode 100644 index bd28247..0000000 --- a/old-apps/web-shared/src/styles/components/adv-custom-select.scss +++ /dev/null @@ -1,79 +0,0 @@ -@use '../base' as *; -@use 'popover.scss' as *; - -/* -------------------------------- - -File#: _2_adv-custom-select -Title: Advanced Custom Select -Descr: Custom select with advanced structure options -Usage: codyhouse.co/license - --------------------------------- */ - -.adv-select { -} - -.adv-select__control { -} - -.adv-select-popover { - // use rem units - @include spaceUnit(1rem); - @include textUnit(1rem); - - &.popover { // popover component - dependency - --popover-width: 250px; - --popover-control-gap: 4px; // ⚠️ use px units - vertical gap between the popover and its control - --popover-viewport-gap: 20px; // ⚠️ use px units - vertical gap between the popover and the viewport - visible if popover height > viewport height - --popover-transition-duration: 0.2s; - - @include breakpoint(md) { - --popover-width: 320px; - } - } -} - -.adv-select-popover__optgroup:not(:first-of-type) { // custom - padding-top: var(--space-xxs); -} - -.adv-select-popover__optgroup:not(:last-of-type) { - border-bottom: 1px solid alpha(var(--color-contrast-higher), 0.1); - padding-bottom: var(--space-xxs); -} - -.adv-select-popover__check { - display: none; -} - -.adv-select-popover__label { -} - -.adv-select-popover__option { - position: relative; - cursor: pointer; - @include fontSmooth; - transition: .2s; - - &:hover { - background-color: alpha(var(--color-contrast-higher), 0.075); - } - - &:focus { - outline: none; - background-color: alpha(var(--color-primary), 0.15); - } - - &[aria-selected=true] { // selected option - background-color: var(--color-primary); - color: var(--color-white); - - .adv-select-popover__check { - display: block; - } - - &:focus { - box-shadow: inset 0 0 0 2px var(--color-primary-dark); - } - } -} -- cgit v1.3