@morozeckiy/dd-lib 0.8.4 → 0.9.0

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.
Files changed (8) hide show
  1. package/assets/scss/titles.scss +301 -299
  2. package/assets/scss/vars-dark.scss +140 -140
  3. package/fesm2022/morozeckiy-dd-lib.mjs +260 -260
  4. package/fesm2022/morozeckiy-dd-lib.mjs.map +1 -1
  5. package/morozeckiy-dd-lib-0.8.5.tgz +0 -0
  6. package/morozeckiy-dd-lib-0.9.0.tgz +0 -0
  7. package/package.json +3 -3
  8. package/types/morozeckiy-dd-lib.d.ts +2068 -0
package/assets/scss/titles.scss CHANGED
@@ -1,299 +1,301 @@
1
- @use 'mixins' as *;
2
- @use 'vars' as *;
3
-
4
- .g-h1-title {
5
- font-weight: 700;
6
- font-size: 40px;
7
- line-height: 60px;
8
- color: var(--light-black-color);
9
-
10
- @include below($mobile) {
11
- font-size: 24px;
12
- line-height: 32px;
13
- }
14
- }
15
-
16
- .g-h2-title {
17
- font-weight: 700;
18
- font-size: 32px;
19
- line-height: 48px;
20
- color: var(--light-black-color);
21
-
22
- @include below($mobile) {
23
- font-weight: 500;
24
- font-size: 20px;
25
- line-height: 28px;
26
- }
27
- }
28
-
29
- .g-h3-title {
30
- font-weight: 700;
31
- font-size: 24px;
32
- line-height: 32px;
33
- color: var(--light-black-color);
34
-
35
- @include below($mobile) {
36
- font-weight: 500;
37
- font-size: 18px;
38
- line-height: 28px;
39
- }
40
- }
41
-
42
- .g-h4-title {
43
- font-weight: 500;
44
- font-size: 20px;
45
- line-height: 28px;
46
- color: var(--light-black-color);
47
-
48
- @include below($mobile) {
49
- font-size: 18px;
50
- }
51
- }
52
-
53
- .g-h5-title {
54
- font-weight: 500;
55
- font-size: 18px;
56
- line-height: 28px;
57
- color: var(--light-black-color);
58
- }
59
-
60
- .g-text,
61
- .g-text-sm {
62
- font-weight: 400;
63
- font-size: 16px;
64
- line-height: 24px;
65
- color: var(--font-light-black-color);
66
- }
67
-
68
- .g-text-sm {
69
- font-size: 14px;
70
- }
71
-
72
- .h1-title {
73
- font-size: 40px;
74
- font-weight: 700;
75
- line-height: 60px;
76
- cursor: default;
77
- color: var(--light-black-color);
78
- }
79
-
80
- .h2-title {
81
- font-size: 32px;
82
- font-weight: 700;
83
- line-height: 48px;
84
- letter-spacing: 0;
85
- cursor: default;
86
- color: var(--light-black-color);
87
- }
88
-
89
- .h3-title {
90
- font-size: 24px;
91
- font-weight: 700;
92
- line-height: 32px;
93
- letter-spacing: 0;
94
- cursor: default;
95
- color: var(--light-black-color);
96
- }
97
-
98
- .h4-title {
99
- font-size: 20px;
100
- font-weight: 500;
101
- line-height: 28px;
102
- cursor: default;
103
- color: var(--light-black-color);
104
- }
105
-
106
- .h5-title {
107
- font-size: 18px;
108
- font-weight: 500;
109
- line-height: 28px;
110
- cursor: default;
111
- color: var(--light-black-color);
112
- }
113
-
114
- .h5-title-medium {
115
- font-size: 18px;
116
- font-weight: 500;
117
- line-height: 28px;
118
- cursor: default;
119
- color: var(--light-black-color);
120
- }
121
-
122
- .h4-title-light {
123
- font-size: 20px;
124
- font-weight: 500;
125
- line-height: 28px;
126
- letter-spacing: 0;
127
- cursor: default;
128
- color: var(--light-black-color);
129
- }
130
-
131
- .h6-title {
132
- font-size: 24px;
133
- font-weight: 400;
134
- line-height: 32px;
135
- letter-spacing: 0;
136
- text-align: left;
137
-
138
- cursor: default;
139
- color: var(--light-black-color);
140
- }
141
-
142
- .b1-title {
143
- font-weight: 400;
144
- font-size: 18px;
145
- line-height: 28px;
146
- cursor: default;
147
- color: var(--font-light-black-color);
148
- }
149
-
150
- .b2-title {
151
- font-size: 16px;
152
- font-weight: 500;
153
- line-height: 24px;
154
- letter-spacing: 0;
155
- cursor: default;
156
- color: var(--font-light-black-color);
157
- }
158
-
159
- .b3-title {
160
- font-size: 16px;
161
- font-weight: 400;
162
- line-height: 24px;
163
- letter-spacing: 0;
164
- cursor: default;
165
- color: var(--font-light-black-color);
166
- }
167
-
168
- .b4-title {
169
- font-size: 14px;
170
- font-weight: 700;
171
- line-height: 24px;
172
- text-align: left;
173
- cursor: default;
174
- color: var(--font-light-black-color);
175
- }
176
-
177
- .b5-title {
178
- font-weight: 500;
179
- font-size: 14px;
180
- line-height: 24px;
181
- letter-spacing: 0;
182
- color: var(--font-light-black-color);
183
- }
184
-
185
- .b6-title {
186
- font-size: 14px;
187
- font-weight: 400;
188
- line-height: 24px;
189
- letter-spacing: 0;
190
- cursor: default;
191
-
192
- color: var(--font-light-black-color);
193
- }
194
-
195
- .c2-title {
196
- font-size: 12px;
197
- font-weight: 400;
198
- cursor: default;
199
- line-height: 18px;
200
- color: var(--font-light-black-color);
201
- }
202
-
203
- .text-plain {
204
- font-size: 16px;
205
- font-weight: 400;
206
- cursor: default;
207
- line-height: 24px;
208
- color: var(--font-light-black-color);
209
- }
210
-
211
- .small {
212
- font-size: 14px;
213
- font-weight: 400;
214
- line-height: 24px;
215
- letter-spacing: 0;
216
- color: var(--font-light-black-color);
217
- }
218
-
219
- .font-regular {
220
- font-weight: 400;
221
- }
222
-
223
- .font-medium {
224
- font-weight: 500;
225
- }
226
-
227
- .font-bold {
228
- font-weight: 700;
229
- }
230
-
231
- .uppercase {
232
- text-transform: uppercase;
233
- }
234
-
235
- .no-wrap-text {
236
- white-space: nowrap;
237
- }
238
-
239
- .ellipsis-text {
240
- display: -webkit-box;
241
- -webkit-line-clamp: 1;
242
- -webkit-box-orient: vertical;
243
- overflow: hidden;
244
-
245
- &.line-2 {
246
- -webkit-line-clamp: 2;
247
- }
248
-
249
- &.line-3 {
250
- -webkit-line-clamp: 3;
251
- }
252
- }
253
-
254
- .text-center {
255
- display: block;
256
- text-align: center;
257
- }
258
-
259
- .gray {
260
- color: var(--second-gray-color);
261
- }
262
-
263
- .dark {
264
- color: var(--dark-color);
265
- }
266
-
267
- .black {
268
- color: var(--light-black-color);
269
- }
270
-
271
- .light-black {
272
- color: var(--font-light-black-color);
273
- }
274
-
275
- .green {
276
- color: var(--primary-green-color);
277
- }
278
-
279
- .red {
280
- color: var(--red-error-color);
281
- }
282
-
283
- .blue {
284
- color: var(--blue-color);
285
- }
286
-
287
- .green-hover {
288
- &:hover {
289
- color: var(--primary-green-color);
290
- }
291
- }
292
-
293
- .underline-link {
294
- text-decoration: underline;
295
-
296
- &:hover {
297
- text-decoration: none;
298
- }
299
- }
1
+ @use 'mixins' as *;
2
+ @use 'vars' as *;
3
+
4
+ .g-h1-title {
5
+ font-weight: 700;
6
+ font-size: 40px;
7
+ line-height: 60px;
8
+ color: var(--light-black-color);
9
+
10
+ @include below($mobile) {
11
+ font-size: 24px;
12
+ line-height: 32px;
13
+ }
14
+ }
15
+
16
+ .g-h2-title {
17
+ font-weight: 700;
18
+ font-size: 32px;
19
+ line-height: 48px;
20
+ color: var(--light-black-color);
21
+
22
+ @include below($mobile) {
23
+ font-weight: 500;
24
+ font-size: 20px;
25
+ line-height: 28px;
26
+ }
27
+ }
28
+
29
+ .g-h3-title {
30
+ font-weight: 700;
31
+ font-size: 24px;
32
+ line-height: 32px;
33
+ color: var(--light-black-color);
34
+
35
+ @include below($mobile) {
36
+ font-weight: 500;
37
+ font-size: 18px;
38
+ line-height: 28px;
39
+ }
40
+ }
41
+
42
+ .g-h4-title {
43
+ font-weight: 500;
44
+ font-size: 20px;
45
+ line-height: 28px;
46
+ color: var(--light-black-color);
47
+
48
+ @include below($mobile) {
49
+ font-size: 18px;
50
+ }
51
+ }
52
+
53
+ .g-h5-title {
54
+ font-weight: 500;
55
+ font-size: 18px;
56
+ line-height: 28px;
57
+ color: var(--light-black-color);
58
+ }
59
+
60
+ .g-text,
61
+ .g-text-sm {
62
+ font-weight: 400;
63
+ font-size: 16px;
64
+ line-height: 24px;
65
+ letter-spacing: 0;
66
+ cursor: default;
67
+ color: var(--font-light-black-color);
68
+ }
69
+
70
+ .g-text-sm {
71
+ font-size: 14px;
72
+ }
73
+
74
+ .h1-title {
75
+ font-size: 40px;
76
+ font-weight: 700;
77
+ line-height: 60px;
78
+ cursor: default;
79
+ color: var(--light-black-color);
80
+ }
81
+
82
+ .h2-title {
83
+ font-size: 32px;
84
+ font-weight: 700;
85
+ line-height: 48px;
86
+ letter-spacing: 0;
87
+ cursor: default;
88
+ color: var(--light-black-color);
89
+ }
90
+
91
+ .h3-title {
92
+ font-size: 24px;
93
+ font-weight: 700;
94
+ line-height: 32px;
95
+ letter-spacing: 0;
96
+ cursor: default;
97
+ color: var(--light-black-color);
98
+ }
99
+
100
+ .h4-title {
101
+ font-size: 20px;
102
+ font-weight: 500;
103
+ line-height: 28px;
104
+ cursor: default;
105
+ color: var(--light-black-color);
106
+ }
107
+
108
+ .h5-title {
109
+ font-size: 18px;
110
+ font-weight: 500;
111
+ line-height: 28px;
112
+ cursor: default;
113
+ color: var(--light-black-color);
114
+ }
115
+
116
+ .h5-title-medium {
117
+ font-size: 18px;
118
+ font-weight: 500;
119
+ line-height: 28px;
120
+ cursor: default;
121
+ color: var(--light-black-color);
122
+ }
123
+
124
+ .h4-title-light {
125
+ font-size: 20px;
126
+ font-weight: 500;
127
+ line-height: 28px;
128
+ letter-spacing: 0;
129
+ cursor: default;
130
+ color: var(--light-black-color);
131
+ }
132
+
133
+ .h6-title {
134
+ font-size: 24px;
135
+ font-weight: 400;
136
+ line-height: 32px;
137
+ letter-spacing: 0;
138
+ text-align: left;
139
+
140
+ cursor: default;
141
+ color: var(--light-black-color);
142
+ }
143
+
144
+ .b1-title {
145
+ font-weight: 400;
146
+ font-size: 18px;
147
+ line-height: 28px;
148
+ cursor: default;
149
+ color: var(--font-light-black-color);
150
+ }
151
+
152
+ .b2-title {
153
+ font-size: 16px;
154
+ font-weight: 500;
155
+ line-height: 24px;
156
+ letter-spacing: 0;
157
+ cursor: default;
158
+ color: var(--font-light-black-color);
159
+ }
160
+
161
+ .b3-title {
162
+ font-size: 16px;
163
+ font-weight: 400;
164
+ line-height: 24px;
165
+ letter-spacing: 0;
166
+ cursor: default;
167
+ color: var(--font-light-black-color);
168
+ }
169
+
170
+ .b4-title {
171
+ font-size: 14px;
172
+ font-weight: 700;
173
+ line-height: 24px;
174
+ text-align: left;
175
+ cursor: default;
176
+ color: var(--font-light-black-color);
177
+ }
178
+
179
+ .b5-title {
180
+ font-weight: 500;
181
+ font-size: 14px;
182
+ line-height: 24px;
183
+ letter-spacing: 0;
184
+ color: var(--font-light-black-color);
185
+ }
186
+
187
+ .b6-title {
188
+ font-size: 14px;
189
+ font-weight: 400;
190
+ line-height: 24px;
191
+ letter-spacing: 0;
192
+ cursor: default;
193
+
194
+ color: var(--font-light-black-color);
195
+ }
196
+
197
+ .c2-title {
198
+ font-size: 12px;
199
+ font-weight: 400;
200
+ cursor: default;
201
+ line-height: 18px;
202
+ color: var(--font-light-black-color);
203
+ }
204
+
205
+ .text-plain {
206
+ font-size: 16px;
207
+ font-weight: 400;
208
+ cursor: default;
209
+ line-height: 24px;
210
+ color: var(--font-light-black-color);
211
+ }
212
+
213
+ .small {
214
+ font-size: 14px;
215
+ font-weight: 400;
216
+ line-height: 24px;
217
+ letter-spacing: 0;
218
+ color: var(--font-light-black-color);
219
+ }
220
+
221
+ .font-regular {
222
+ font-weight: 400;
223
+ }
224
+
225
+ .font-medium {
226
+ font-weight: 500;
227
+ }
228
+
229
+ .font-bold {
230
+ font-weight: 700;
231
+ }
232
+
233
+ .uppercase {
234
+ text-transform: uppercase;
235
+ }
236
+
237
+ .no-wrap-text {
238
+ white-space: nowrap;
239
+ }
240
+
241
+ .ellipsis-text {
242
+ display: -webkit-box;
243
+ -webkit-line-clamp: 1;
244
+ -webkit-box-orient: vertical;
245
+ overflow: hidden;
246
+
247
+ &.line-2 {
248
+ -webkit-line-clamp: 2;
249
+ }
250
+
251
+ &.line-3 {
252
+ -webkit-line-clamp: 3;
253
+ }
254
+ }
255
+
256
+ .text-center {
257
+ display: block;
258
+ text-align: center;
259
+ }
260
+
261
+ .gray {
262
+ color: var(--second-gray-color);
263
+ }
264
+
265
+ .dark {
266
+ color: var(--dark-color);
267
+ }
268
+
269
+ .black {
270
+ color: var(--light-black-color);
271
+ }
272
+
273
+ .light-black {
274
+ color: var(--font-light-black-color);
275
+ }
276
+
277
+ .green {
278
+ color: var(--primary-green-color);
279
+ }
280
+
281
+ .red {
282
+ color: var(--red-error-color);
283
+ }
284
+
285
+ .blue {
286
+ color: var(--blue-color);
287
+ }
288
+
289
+ .green-hover {
290
+ &:hover {
291
+ color: var(--primary-green-color);
292
+ }
293
+ }
294
+
295
+ .underline-link {
296
+ text-decoration: underline;
297
+
298
+ &:hover {
299
+ text-decoration: none;
300
+ }
301
+ }