mediacube-ui-v2 0.0.152 → 0.0.154

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.
@@ -0,0 +1,232 @@
1
+ @use 'tokens/font-families' as *;
2
+ @use 'tokens/spacings' as *;
3
+ @use 'tokens/media-queries' as *;
4
+ @use 'tokens/colors' as *;
5
+ @use 'sass:color' as sasscolor;
6
+
7
+ $system-color: #8756FF;
8
+
9
+ html {
10
+ box-sizing: border-box;
11
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
12
+ -ms-overflow-style: scrollbar;
13
+ -ms-text-size-adjust: 100%;
14
+ min-height: 100%;
15
+ font-size: 13px;
16
+ }
17
+
18
+ body {
19
+ overflow-y: hidden;
20
+ }
21
+
22
+ body,
23
+ #__nuxt,
24
+ #__layout,
25
+ .mc-tm-root {
26
+ display: flex;
27
+ flex-direction: column;
28
+ min-height: 100%;
29
+ }
30
+
31
+ *,
32
+ *:before,
33
+ *:after {
34
+ box-sizing: inherit;
35
+ // убирает превращение х в знак умножения между цифр
36
+ font-variant-ligatures: none !important;
37
+ }
38
+
39
+ body {
40
+ margin: 0;
41
+ overflow-y: auto;
42
+ word-break: break-word;
43
+
44
+ font-family: $font-family-main;
45
+ font-size: 13px;
46
+ line-height: 16px;
47
+ color: #202427;
48
+ font-variant: none !important;
49
+ font-feature-settings: normal !important;
50
+ }
51
+
52
+ [tabindex="-1"]:focus {
53
+ outline: none !important;
54
+ }
55
+
56
+ [role="button"] {
57
+ cursor: pointer;
58
+ }
59
+
60
+ input[type="search"] {
61
+ -webkit-appearance: textfield;
62
+ }
63
+
64
+ a,
65
+ button,
66
+ [role="button"],
67
+ input,
68
+ label,
69
+ select,
70
+ textarea {
71
+ touch-action: manipulation;
72
+ }
73
+
74
+ input {
75
+ overflow: visible;
76
+ text-transform: none;
77
+ }
78
+
79
+ button,
80
+ html [type="button"],
81
+ [type="reset"],
82
+ [type="submit"] {
83
+ -webkit-appearance: button;
84
+ }
85
+
86
+ button::-moz-focus-inner,
87
+ [type="button"]::-moz-focus-inner,
88
+ [type="reset"]::-moz-focus-inner,
89
+ [type="submit"]::-moz-focus-inner {
90
+ padding: 0;
91
+ border-style: none;
92
+ }
93
+
94
+ input[type="date"],
95
+ input[type="time"],
96
+ input[type="datetime-local"],
97
+ input[type="month"] {
98
+ -webkit-appearance: listbox;
99
+ }
100
+
101
+ textarea {
102
+ overflow: auto;
103
+ resize: vertical;
104
+ }
105
+
106
+ svg {
107
+ fill: currentColor;
108
+
109
+ a &,
110
+ button & {
111
+ pointer-events: none;
112
+ }
113
+
114
+ &:not(:root) {
115
+ overflow: hidden;
116
+ }
117
+ }
118
+
119
+ img {
120
+ max-width: 100%;
121
+ user-select: none;
122
+ }
123
+
124
+ a {
125
+ text-decoration-skip-ink: auto;
126
+ }
127
+
128
+ ::selection {
129
+ background: sasscolor.scale($system-color, $lightness: 0%);
130
+ color: #ffffff;
131
+ }
132
+
133
+ ::-moz-selection {
134
+ background: sasscolor.scale($system-color, $lightness: 0%);
135
+ color: #ffffff;
136
+ }
137
+
138
+ input,
139
+ textarea,
140
+ [contenteditable] {
141
+ caret-color: $system-color;
142
+ }
143
+
144
+ button {
145
+ -webkit-appearance: none;
146
+ }
147
+
148
+ a,
149
+ button {
150
+ outline: none;
151
+
152
+ &:focus {
153
+ outline: none;
154
+ }
155
+ }
156
+
157
+ hr {
158
+ box-sizing: content-box;
159
+ overflow: visible;
160
+ }
161
+
162
+ pre {
163
+ font-size: 0.7em;
164
+ }
165
+
166
+ // Spaces
167
+ @each $space, $value in $token-spaces {
168
+ .pb-#{$space} {
169
+ padding-bottom: $value !important;
170
+ }
171
+ .pt-#{$space} {
172
+ padding-top: $value !important;
173
+ }
174
+
175
+ .mb-#{$space} {
176
+ margin-bottom: $value !important;
177
+ }
178
+ .mt-#{$space} {
179
+ margin-top: $value !important;
180
+ }
181
+ }
182
+
183
+ // Visibility
184
+ .hidden-xs {
185
+ @media #{$media-query-xs} {
186
+ display: none !important;
187
+ }
188
+ }
189
+ .hidden-s {
190
+ @media #{$media-query-s} {
191
+ display: none !important;
192
+ }
193
+ }
194
+ .hidden-m {
195
+ @media #{$media-query-m} {
196
+ display: none !important;
197
+ }
198
+ }
199
+ .hidden-l {
200
+ @media #{$media-query-l} {
201
+ display: none !important;
202
+ }
203
+ }
204
+
205
+ .hidden-xs {
206
+ @media #{$media-query-xs-down} {
207
+ display: none !important;
208
+ }
209
+ }
210
+ .hidden-s-down {
211
+ @media #{$media-query-s-down} {
212
+ display: none !important;
213
+ }
214
+ }
215
+ .hidden-m-down {
216
+ @media #{$media-query-m-down} {
217
+ display: none !important;
218
+ }
219
+ }
220
+ .hidden-l-down {
221
+ @media #{$media-query-l-down} {
222
+ display: none !important;
223
+ }
224
+ }
225
+
226
+ .color {
227
+ @each $name, $color in $token-colors {
228
+ &--#{$name} {
229
+ color: $color;
230
+ }
231
+ }
232
+ }
@@ -3,3 +3,4 @@
3
3
  @use 'tooltip.scss' as *;
4
4
  @use 'table.scss' as *;
5
5
  @use 'toast.scss' as *;
6
+ @use '../base.scss' as *;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "mediacube-ui-v2",
3
- "version": "0.0.152",
3
+ "version": "0.0.154",
4
4
  "license": "MIT",
5
5
  "description": "Design system for Mediacube services",
6
6
  "keywords": [
@@ -16,6 +16,7 @@
16
16
  "variables": "./dist/assets/variables.scss",
17
17
  "style": "./dist/style.css",
18
18
  "font": "./dist/assets/fonts/inter/inter.css",
19
+ "base": "./dist/assets/base.scss",
19
20
  "sprite": "./dist/assets/iconsSprite.svg",
20
21
  "default": "./dist/mediacube-ui-v2.js",
21
22
  "exports": {
@@ -25,6 +26,7 @@
25
26
  },
26
27
  "./style": "./dist/style.css",
27
28
  "./font": "./dist/assets/fonts/inter/inter.css",
29
+ "./base": "./dist/assets/base.scss",
28
30
  "./sprite": "./dist/assets/iconsSprite.svg",
29
31
  "./variables": "./dist/assets/variables.scss",
30
32
  "./tokens/*": "./dist/assets/tokens/*",