feat(ui): added c-select in the ui lib (#550)

* feat(ui): added c-select in the ui lib

* refactor(ui): switched n-select to c-select

1 files changed, 60 insertions, 0 deletions

diff --git a/src/ui/c-select/c-select.theme.ts b/src/ui/c-select/c-select.theme.ts
new file mode 100644
index 0000000..d799671
--- /dev/null
+++ b/src/ui/c-select/c-select.theme.ts
@@ -0,0 +1,60 @@
+import { defineThemes } from '../theme/theme.models';
+import { appThemes } from '../theme/themes';
+
+const sizes = {
+  small: {
+    height: '28px',
+    fontSize: '12px',
+  },
+  medium: {
+    height: '34px',
+    fontSize: '14px',
+  },
+  large: {
+    height: '40px',
+    fontSize: '16px',
+  },
+};
+
+export const { useTheme } = defineThemes({
+  dark: {
+    sizes,
+
+    backgroundColor: '#333333',
+    borderColor: '#333333',
+    dropdownShadow: 'rgba(0, 0, 0, 0.2) 0px 8px 24px',
+
+    option: {
+      hover: {
+        backgroundColor: '#444444',
+      },
+      active: {
+        textColor: appThemes.dark.primary.color,
+      },
+    },
+
+    focus: {
+      backgroundColor: '#1ea54c1a',
+    },
+  },
+  light: {
+    sizes,
+
+    backgroundColor: '#ffffff',
+    borderColor: '#e0e0e69e',
+    dropdownShadow: 'rgba(149, 157, 165, 0.2) 0px 8px 24px',
+
+    option: {
+      hover: {
+        backgroundColor: '#eee',
+      },
+      active: {
+        textColor: appThemes.light.primary.color,
+      },
+    },
+
+    focus: {
+      backgroundColor: '#ffffff',
+    },
+  },
+});