eSales Media Git repositories
Browse code

Add tom select npm package

Benjamin Roth authored on02/02/2023 12:00:30
Showing1 changed files
public/lib/tomselect/scss/tom-select.scss
History View file @de23398
1 1 
new file mode 100644
... ... 
@@ -0,0 +1,184 @@
1 
+/**
2 
+ * tom-select.css (v2.2.2)
3 
+ * Copyright (c) contributors
4 
+ *
5 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
6 
+ * file except in compliance with the License. You may obtain a copy of the License at:
7 
+ * http://www.apache.org/licenses/LICENSE-2.0
8 
+ *
9 
+ * Unless required by applicable law or agreed to in writing, software distributed under
10 
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
11 
+ * ANY KIND, either express or implied. See the License for the specific language
12 
+ * governing permissions and limitations under the License.
13 
+ *
14 
+ */
15 
+
16 
+
17 
+// base styles
18 
+$select-ns:										'ts' !default;
19 
+$select-font-family:							inherit !default;
20 
+$select-font-smoothing:							inherit !default;
21 
+$select-font-size:								13px !default;
22 
+$select-line-height:							18px !default;
23 
+
24 
+$select-color-text:								#303030 !default;
25 
+$select-color-border:							#d0d0d0 !default;
26 
+$select-color-highlight:						rgba(125,168,208,0.2) !default;
27 
+$select-color-input:							#fff !default;
28 
+$select-color-input-full:						$select-color-input !default;
29 
+$select-color-disabled:							#fafafa !default;
30 
+$select-color-item:								#f2f2f2 !default;
31 
+$select-color-item-text:						$select-color-text !default;
32 
+$select-color-item-border:						#d0d0d0 !default;
33 
+$select-color-item-active:						#e8e8e8 !default;
34 
+$select-color-item-active-text:					$select-color-text !default;
35 
+$select-color-item-active-border:				#cacaca !default;
36 
+$select-color-dropdown:							#fff !default;
37 
+$select-color-dropdown-border:					$select-color-border !default;
38 
+$select-color-dropdown-border-top:				#f0f0f0 !default;
39 
+$select-color-dropdown-item-active:				#f5fafd !default;
40 
+$select-color-dropdown-item-active-text: 		#495c68 !default;
41 
+$select-color-dropdown-item-create-text:		rgba(red($select-color-text), green($select-color-text), blue($select-color-text), 0.5) !default;
42 
+$select-color-dropdown-item-create-active-text:	$select-color-dropdown-item-active-text !default;
43 
+$select-color-optgroup:							$select-color-dropdown !default;
44 
+$select-color-optgroup-text:					$select-color-text !default;
45 
+$select-lighten-disabled-item:					30% !default;
46 
+$select-lighten-disabled-item-text:				30% !default;
47 
+$select-lighten-disabled-item-border:			30% !default;
48 
+$select-opacity-disabled:						0.5 !default;
49 
+
50 
+$select-shadow-input:							none !default;
51 
+$select-shadow-input-focus:						none !default;
52 
+$select-border-width:							1px !default;
53 
+$select-border:									$select-border-width solid $select-color-border !default;
54 
+$select-dropdown-border:						1px solid $select-color-dropdown-border !default;
55 
+$select-border-radius:							3px !default;
56 
+
57 
+$select-width-item-border:						0px !default;
58 
+$select-max-height-dropdown:					200px !default;
59 
+
60 
+$select-padding-x:								8px !default;
61 
+$select-padding-y:								8px !default;
62 
+$select-padding-item-x:							6px !default;
63 
+$select-padding-item-y:							2px !default;
64 
+$select-padding-dropdown-item-x:					$select-padding-x !default;
65 
+$select-padding-dropdown-item-y:					5px !default;
66 
+$select-margin-item-x:							3px !default;
67 
+$select-margin-item-y:							3px !default;
68 
+
69 
+$select-arrow-size:								5px !default;
70 
+$select-arrow-color:								#808080 !default;
71 
+$select-arrow-offset:							15px !default;
72 
+
73 
+$select-caret-margin:							0px 4px !default;
74 
+$select-caret-margin-rtl:						0px 4px 0px -2px !default;
75 
+
76 
+$select-spinner-size:							30px !default;
77 
+$select-spinner-border-size:					5px !default;
78 
+$select-spinner-border-color:					$select-color-border !default;
79 
+
80 
+:root{
81 
+	--ts-pr-clear-button:						0;
82 
+	--ts-pr-caret:								0;
83 
+	--ts-pr-min:								.75rem;
84 
+}
85 
+
86 
+@mixin selectize-vertical-gradient($color-top, $color-bottom) {
87 
+    background-color: mix($color-top, $color-bottom, 60%);
88 
+    background-image: linear-gradient(to bottom, $color-top, $color-bottom);
89 
+    background-repeat: repeat-x;
90 
+}
91 
+
92 
+
93 
+.#{$select-ns}-wrapper.single{
94 
+	.#{$select-ns}-control {
95 
+		&, input {
96 
+			cursor: pointer;
97 
+		}
98 
+	}
99 
+}
100 
+
101 
+.#{$select-ns}-control {
102 
+	padding-right:	Max( var(--ts-pr-min), calc( var(--ts-pr-clear-button) + var(--ts-pr-caret)) ) !important;
103 
+}
104 
+
105 
+@mixin ts-caret(){
106 
+
107 
+	.#{$select-ns}-wrapper.single{
108 
+
109 
+		.#{$select-ns}-control {
110 
+			--ts-pr-caret: 2rem;
111 
+
112 
+			&:after {
113 
+				content: ' ';
114 
+				display: block;
115 
+				position: absolute;
116 
+				top: 50%;
117 
+				right: $select-arrow-offset;
118 
+				margin-top: round(-0.5 * $select-arrow-size);
119 
+				width: 0;
120 
+				height: 0;
121 
+				border-style: solid;
122 
+				border-width: $select-arrow-size $select-arrow-size 0 $select-arrow-size;
123 
+				border-color: $select-arrow-color transparent transparent transparent;
124 
+			}
125 
+		}
126 
+
127 
+		&.dropdown-active .#{$select-ns}-control::after {
128 
+			margin-top: $select-arrow-size * -0.8;
129 
+			border-width: 0 $select-arrow-size $select-arrow-size $select-arrow-size;
130 
+			border-color: transparent transparent $select-arrow-color transparent;
131 
+		}
132 
+
133 
+		&.input-active .#{$select-ns}-control,
134 
+		&.input-active .#{$select-ns}-control input {
135 
+			cursor: text;
136 
+		}
137 
+
138 
+	}
139 
+}
140 
+
141 
+@import "./plugins/drag_drop.scss";
142 
+@import "./plugins/checkbox_options.scss";
143 
+@import "./plugins/clear_button.scss";
144 
+@import "./plugins/dropdown_header.scss";
145 
+@import "./plugins/dropdown_input.scss";
146 
+@import "./plugins/input_autogrow.scss";
147 
+@import "./plugins/optgroup_columns.scss";
148 
+@import "./plugins/remove_button.scss";
149 
+
150 
+
151 
+.#{$select-ns}-wrapper {
152 
+	position: relative;
153 
+}
154 
+
155 
+.#{$select-ns}-dropdown,
156 
+.#{$select-ns}-control,
157 
+.#{$select-ns}-control input {
158 
+	color: $select-color-text;
159 
+	font-family: $select-font-family;
160 
+	font-size: $select-font-size;
161 
+	line-height: $select-line-height;
162 
+	font-smoothing: $select-font-smoothing;
163 
+}
164 
+
165 
+.#{$select-ns}-control,
166 
+.#{$select-ns}-wrapper.single.input-active .#{$select-ns}-control {
167 
+	background: $select-color-input;
168 
+	cursor: text;
169 
+}
170 
+
171 
+@import 'items';
172 
+@import 'dropdown';
173 
+
174 
+.ts-hidden-accessible{
175 
+	border: 0 !important;
176 
+    clip: rect(0 0 0 0) !important;
177 
+    clip-path: inset(50%) !important;
178 
+    //height: 1px !important;
179 
+    overflow: hidden !important;
180 
+    padding: 0 !important;
181 
+    position: absolute !important;
182 
+    width: 1px !important;
183 
+    white-space: nowrap !important;
184 
+}