From 39b1aa736687fd7966412a1ab182016c72b91d41 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adina=20=C8=9Aeudan?= <adina@devplant.ro>
Date: Sat, 2 Oct 2021 16:27:51 +0300
Subject: [PATCH] Autocomplete, checkbox, controls

---
 src/assets/styles/_common-variables.scss   |  2 +
 src/assets/styles/common-autocomplete.scss |  9 +++++
 src/assets/styles/common-checkbox.scss     | 36 +++++++++++++++++
 src/assets/styles/common-controls.scss     | 47 ++++++++++++++++++++++
 src/assets/styles/common-styles.scss       |  3 ++
 5 files changed, 97 insertions(+)
 create mode 100644 src/assets/styles/common-autocomplete.scss
 create mode 100644 src/assets/styles/common-checkbox.scss
 create mode 100644 src/assets/styles/common-controls.scss

diff --git a/src/assets/styles/_common-variables.scss b/src/assets/styles/_common-variables.scss
index d62662f..50c1b33 100644
--- a/src/assets/styles/_common-variables.scss
+++ b/src/assets/styles/_common-variables.scss
@@ -12,6 +12,8 @@
     --iqser-btn-bg: #f0f1f4;
     --iqser-warn: #fdbd00;
     --iqser-white: white;
+    --iqser-black: black;
+    --iqser-light: white;
     --iqser-separator: rgba(226, 228, 233, 0.9);
     --iqser-quick-filter-border: #d3d5da;
     --iqser-grey-2: #f4f5f7;
diff --git a/src/assets/styles/common-autocomplete.scss b/src/assets/styles/common-autocomplete.scss
new file mode 100644
index 0000000..ac9e3a8
--- /dev/null
+++ b/src/assets/styles/common-autocomplete.scss
@@ -0,0 +1,9 @@
+@use 'common-mixins';
+
+.mat-autocomplete-panel {
+    @include common-mixins.scroll-bar;
+
+    .mat-option {
+        font-size: inherit;
+    }
+}
diff --git a/src/assets/styles/common-checkbox.scss b/src/assets/styles/common-checkbox.scss
new file mode 100644
index 0000000..aabccf7
--- /dev/null
+++ b/src/assets/styles/common-checkbox.scss
@@ -0,0 +1,36 @@
+
+.mat-checkbox .mat-checkbox-frame {
+    border: 1px solid var(--iqser-grey-5);
+}
+
+.mat-checkbox-indeterminate.mat-accent .mat-checkbox-background,
+.mat-checkbox-checked.mat-accent .mat-checkbox-background {
+    margin-top: 1px;
+    margin-left: 1px;
+    width: 18px;
+    height: 18px;
+}
+
+.mat-checkbox-layout {
+    align-items: center !important;
+
+    .mat-checkbox-inner-container {
+        margin-left: 0;
+    }
+
+    .mat-checkbox-label {
+        font-size: 13px;
+        color: var(--iqser-accent);
+
+        display: flex;
+        align-items: center;
+
+        > *:not(:last-child) {
+            margin-right: 8px;
+        }
+    }
+}
+
+.mat-checkbox.error .mat-checkbox-label {
+    color: var(--iqser-primary);
+}
diff --git a/src/assets/styles/common-controls.scss b/src/assets/styles/common-controls.scss
new file mode 100644
index 0000000..71ea0a7
--- /dev/null
+++ b/src/assets/styles/common-controls.scss
@@ -0,0 +1,47 @@
+.btn-group {
+    display: flex;
+    flex-direction: row;
+
+    .btn-group-btn {
+        cursor: pointer;
+        color: var(--iqser-accent);
+        background: var(--iqser-white);
+        font-family: Inter, sans-serif;
+        font-size: 13px;
+        line-height: 14px;
+        padding: 10px 14px;
+        transition: color 0.25s ease-in-out;
+        outline: none;
+        border: none;
+
+        &:hover {
+            color: var(--iqser-black);
+        }
+
+        &.active {
+            color: var(--iqser-light);
+            background: var(--iqser-primary);
+            border-radius: 17px;
+        }
+
+        &.active:hover {
+            color: var(--iqser-grey-3);
+        }
+    }
+}
+
+.icon-10 {
+    width: 10px;
+    height: 10px;
+}
+
+.noselect {
+    -webkit-touch-callout: none; /* iOS Safari */
+    -webkit-user-select: none; /* Safari */
+    -khtml-user-select: none; /* Konqueror HTML */
+    -moz-user-select: none; /* Old versions of Firefox */
+    -ms-user-select: none; /* Internet Explorer/Edge */
+    user-select: none;
+    /* Non-prefixed version, currently
+                                     supported by Chrome, Edge, Opera and Firefox */
+}
diff --git a/src/assets/styles/common-styles.scss b/src/assets/styles/common-styles.scss
index 3430b3c..66014f7 100644
--- a/src/assets/styles/common-styles.scss
+++ b/src/assets/styles/common-styles.scss
@@ -9,3 +9,6 @@
 @use 'common-menu';
 @use 'common-base-screen';
 @use 'common-breadcrumbs';
+@use 'common-autocomplete';
+@use 'common-checkbox';
+@use 'common-controls';