@inntechcorp/it-design 2.0.86 → 2.0.87

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,241 +0,0 @@
1
- .defaultInput {
2
- height: 100%;
3
- }
4
-
5
- .floatingInput {
6
- font-size: 13px;
7
- color: rgba(0, 0, 0, 0.8509803922);
8
- caret-color: rgba(0, 0, 0, 0.8509803922);
9
- }
10
-
11
- /* --------------------------------- */
12
- .floatingInput::placeholder {
13
- color: rgba(0, 0, 0, 0);
14
- }
15
-
16
- .floatingInput:disabled:not(.floatingInput[data-locked=true]) {
17
- opacity: 0.5;
18
- }
19
-
20
- .floatingInput:disabled :not(.floatingInput[data-locked=true]) {
21
- opacity: 0.5;
22
- }
23
-
24
- .floatingLabel {
25
- display: block;
26
- position: relative;
27
- max-height: 0;
28
- font-weight: 500;
29
- pointer-events: none;
30
- font-size: 16px;
31
- }
32
-
33
- .floatingLabel::before {
34
- color: rgba(0, 0, 0, 0.6);
35
- content: attr(data-content);
36
- display: inline-block;
37
- filter: blur(0);
38
- backface-visibility: hidden;
39
- transform-origin: left top;
40
- transition: transform 0.2s ease-out;
41
- position: relative;
42
- }
43
-
44
- .floatingInput:placeholder-shown + .floatingLabel::before {
45
- transform: translate3d(0, -32px, 0) scale3d(0.8, 0.8, 1);
46
- font-smooth: always;
47
- -webkit-font-smoothing: antialiased;
48
- }
49
-
50
- .floatingLabel::before,
51
- .floatingInput:focus + .floatingLabel::before {
52
- transform: translate3d(0, -40px, 0) scale3d(0.8, 0.8, 1);
53
- }
54
-
55
- .floatingInput:focus + .floatingLabel::before {
56
- color: rgba(0, 0, 0, 0.6);
57
- }
58
-
59
- .floatingInputinput:-webkit-autofill, .floatingInputinput:-webkit-autofill:focus, .floatingInputinput:-webkit-autofill:hover {
60
- -webkit-text-fill-color: #3496fa !important;
61
- -webkit-box-shadow: 0 0 0 30px #151d3d inset !important;
62
- }
63
-
64
- .arrow {
65
- transition: all 0.25s ease-out;
66
- margin-left: auto;
67
- transform: rotate(0deg);
68
- width: 20px;
69
- height: 20px;
70
- fill: rgba(255, 255, 255, 0.6);
71
- }
72
-
73
- .arrowNormal {
74
- margin-left: auto;
75
- transform: rotate(-90deg);
76
- }
77
-
78
- .arrowOpen {
79
- transform: rotate(-180deg);
80
- fill: #ffffff;
81
- }
82
-
83
- .icon {
84
- margin-right: 8px;
85
- height: 22px;
86
- width: 22px;
87
- color: rgba(255, 255, 255, 0.6);
88
- font-size: 22px;
89
- display: flex;
90
- align-items: center;
91
- }
92
-
93
- .menu {
94
- background-color: #050A20;
95
- border-radius: 0 5px 5px 5px;
96
- overflow: hidden;
97
- position: absolute;
98
- z-index: 2;
99
- box-shadow: 0px 20px 20px rgba(0, 0, 0, 0.25);
100
- transform-origin: 50% 1%;
101
- transform-box: fill-box;
102
- transition-timing-function: cubic-bezier(0.75, -0.5, 0, 1.25);
103
- }
104
- .menu ul {
105
- min-width: max-content;
106
- }
107
-
108
- .bodyWrapper {
109
- height: 300px;
110
- }
111
-
112
- .bodyWrapperLong {
113
- height: 300px;
114
- }
115
-
116
- .bottom {
117
- top: 100%;
118
- }
119
-
120
- .left {
121
- left: 0;
122
- }
123
-
124
- /* -------------------------------- */
125
- .menuEnter {
126
- opacity: 0;
127
- height: 50px;
128
- }
129
-
130
- .menuEnterActive {
131
- opacity: 1;
132
- height: 300px;
133
- transition: height 150ms ease-out;
134
- }
135
-
136
- .menuExit {
137
- opacity: 1;
138
- }
139
-
140
- .menuExitActive {
141
- opacity: 0;
142
- height: 300px;
143
- transition: height 150ms ease-out;
144
- }
145
-
146
- /* -------------------------------- */
147
- .menuEnterActiveLong {
148
- opacity: 1;
149
- height: 300px;
150
- transition: height 150ms ease-out;
151
- }
152
-
153
- .menuExitActiveLong {
154
- opacity: 0;
155
- height: 300px;
156
- transition: height 150ms ease-out;
157
- }
158
-
159
- .option {
160
- display: flex;
161
- align-items: center;
162
- cursor: pointer;
163
- min-width: max-content;
164
- padding: 10px 30px 10px 15px;
165
- }
166
- .option:not(:last-child) {
167
- margin-bottom: 1px;
168
- }
169
- .option:hover {
170
- background-color: rgba(29, 38, 73, 0.5019607843);
171
- }
172
-
173
- .selected .single, .selected .option span {
174
- color: #ffffff;
175
- }
176
-
177
- .single, .option span {
178
- color: rgba(255, 255, 255, 0.6666666667);
179
- font-weight: 400;
180
- font-size: 12px;
181
- line-height: 12px;
182
- white-space: nowrap;
183
- }
184
-
185
- .container {
186
- display: flex;
187
- align-items: center;
188
- cursor: pointer;
189
- user-select: none;
190
- }
191
-
192
- .label {
193
- display: flex;
194
- align-items: center;
195
- position: relative;
196
- }
197
- .label span {
198
- font-size: 12px;
199
- font-weight: 400;
200
- color: rgba(255, 255, 255, 0.6);
201
- line-height: 1.2;
202
- margin-left: 10px;
203
- }
204
-
205
- .checkmark {
206
- height: 20px;
207
- width: 20px;
208
- border-radius: 6px;
209
- background-color: #1D2649;
210
- transition: background-color 0.25sn ease-out;
211
- display: flex;
212
- justify-content: center;
213
- align-items: center;
214
- }
215
- .checkmark svg {
216
- fill: #ffffff;
217
- visibility: hidden;
218
- }
219
-
220
- .check {
221
- background-color: #3396FB;
222
- }
223
- .check svg {
224
- visibility: visible;
225
- animation: bounce 0.5s;
226
- }
227
-
228
- @keyframes bounce {
229
- 0% {
230
- transform: scale(0.2) rotate(4deg);
231
- }
232
- 50% {
233
- transform: scale(1.2) rotate(-2deg);
234
- }
235
- 75% {
236
- transform: scale(0.9) rotate(1deg);
237
- }
238
- 100% {
239
- transform: scale(1) rotate(0deg);
240
- }
241
- }