From b7e39b59fd0fc7b5610ebff29035bf622079e0d8 Mon Sep 17 00:00:00 2001
From: ivarlovlie <git@ivarlovlie.no>
Date: Wed, 5 Oct 2022 20:45:21 +0800
Subject: refactor: Change file structure

---
 .../src/styles/components/custom-select.scss       | 158 ---------------------
 1 file changed, 158 deletions(-)
 delete mode 100644 old-apps/web-shared/src/styles/components/custom-select.scss

(limited to 'old-apps/web-shared/src/styles/components/custom-select.scss')

diff --git a/old-apps/web-shared/src/styles/components/custom-select.scss b/old-apps/web-shared/src/styles/components/custom-select.scss
deleted file mode 100644
index 9cd3b5e..0000000
--- a/old-apps/web-shared/src/styles/components/custom-select.scss
+++ /dev/null
@@ -1,158 +0,0 @@
-@use '../base' as *;
-
-/* --------------------------------
-
-File#: _1_custom-select
-Title: Custom Select
-Descr: Custom Select Control
-Usage: codyhouse.co/license
-
--------------------------------- */
-
-:root {
-  // --default variation only 👇
-  --select-icon-size: 16px;
-  --select-icon-right-margin: var(--space-sm); // icon margin right
-  --select-text-icon-gap: var(--space-xxxs); // gap between text and icon
-}
-
-.select {
-  position: relative;
-}
-
-.select__input {
-  width: 100%;
-  height: 100%;
-  padding-right: calc(var(--select-icon-size) + var(--select-icon-right-margin) + var(--select-text-icon-gap)) !important;
-}
-
-.select__icon {
-  width: var(--select-icon-size);
-  height: var(--select-icon-size);
-  pointer-events: none;
-  position: absolute;
-  right: var(--select-icon-right-margin);
-  top: 50%;
-  transform: translateY(-50%);
-}
-
-// --custom-dropdown
-:root {
-  --select-dropdown-gap: 4px; // distance between select control and custom dropdown
-}
-
-.select__button { // created in JS - custom select control
-  width: 100%;
-}
-
-.select__button[aria-expanded="true"] {
-  // custom select control if dropdown = visible
-}
-
-.select__dropdown { // created in JS - custom select dropdown
-  position: absolute;
-  left: 0;
-  top: 100%;
-  min-width: 200px;
-  max-height: 1px; // updated in JS
-  background-color: var(--color-bg-light);
-  box-shadow: var(--inner-glow), var(--shadow-md);
-  padding: var(--space-xxxs) 0;
-  border-radius: var(--radius-md);
-  z-index: var(--z-index-popover, 5);
-  margin-top: var(--select-dropdown-gap);
-  margin-bottom: var(--select-dropdown-gap);
-  overflow: auto;
-
-  // use rem units
-  @include spaceUnit(1rem);
-  @include textUnit(1rem);
-
-  visibility: hidden;
-  opacity: 0;
-}
-
-.select__dropdown--right { // change dropdown position based on the available space
-  right: 0;
-  left: auto;
-}
-
-.select__dropdown--up {
-  bottom: 100%;
-  top: auto;
-}
-
-.select__button[aria-expanded="true"] + .select__dropdown {
-  visibility: visible;
-  opacity: 1;
-}
-
-// custom <optgroup> list - include all <option>s if no <optgroup> available
-.select__list {
-  list-style: none !important;
-}
-
-.select__list:not(:first-of-type) {
-  padding-top: var(--space-xxs);
-}
-
-.select__list:not(:last-of-type) {
-  border-bottom: 1px solid alpha(var(--color-contrast-higher), 0.1);
-  padding-bottom: var(--space-xxs);
-}
-
-.select__item { // single item inside .select__list
-  display: flex;
-  align-items: center;
-  padding: var(--space-xxs) var(--space-sm);
-  color: var(--color-contrast-high);
-  width: 100%;
-  text-align: left;
-  // truncate text
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.select__item--optgroup { // custom <optgroup> label
-  font-size: var(--text-sm);
-  color: var(--color-contrast-medium);
-}
-
-.select__item--option { // custom <option> label
-  cursor: pointer;
-
-  &: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);
-    position: relative;
-    @include fontSmooth;
-
-    &::after { // check icon next to the selected language
-      content: '';
-      display: block;
-      height: 1em;
-      width: 1em;
-      margin-left: auto;
-      background-color: currentColor;
-      mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpolyline stroke-width='2' stroke='%23ffffff' fill='none' stroke-linecap='round' stroke-linejoin='round' points='1,9 5,13 15,3 '/%3E%3C/svg%3E");
-    }
-
-    &:focus {
-      box-shadow: inset 0 0 0 2px var(--color-primary-dark);
-    }
-  }
-}
-
-html:not(.js ) .select .icon { // hide icon if JS = disabled
-  display: none;
-}
-- 
cgit v1.3