@esportsplus/ui 0.0.1 → 0.0.2
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.
- package/.gitattributes +2 -2
- package/components/accordion/scss/accordion.scss +16 -16
- package/components/accordion/scss/variables.scss +4 -4
- package/components/anchor/scss/anchor.scss +41 -41
- package/components/anchor/scss/anchors.scss +9 -9
- package/components/anchor/scss/variables.scss +5 -5
- package/components/banner/scss/banner.scss +13 -13
- package/components/border/scss/border.scss +10 -10
- package/components/border/scss/variables.scss +6 -6
- package/components/bubble/scss/bubble.scss +30 -30
- package/components/bubble/scss/variables.scss +19 -19
- package/components/button/scss/button.scss +93 -93
- package/components/button/scss/variables.scss +70 -70
- package/components/card/scss/card.scss +36 -36
- package/components/card/scss/variables.scss +42 -42
- package/components/container/scss/container.scss +10 -10
- package/components/container/scss/variables.scss +5 -5
- package/components/field/scss/_check.scss +225 -225
- package/components/field/scss/_normalize.scss +36 -36
- package/components/field/scss/_text.scss +103 -103
- package/components/field/scss/field.scss +137 -132
- package/components/field/scss/variables.scss +138 -133
- package/components/group/scss/group.scss +41 -41
- package/components/group/scss/variables.scss +25 -25
- package/components/icon/scss/icon.scss +18 -18
- package/components/icon/scss/variables.scss +8 -8
- package/components/link/scss/link.scss +29 -29
- package/components/link/scss/variables.scss +48 -48
- package/components/loading/scss/loading.scss +24 -24
- package/components/loading/scss/variables.scss +31 -31
- package/components/page/scss/page.scss +22 -22
- package/components/page/scss/variables.scss +19 -19
- package/components/root/scss/root.scss +93 -93
- package/components/root/scss/variables.scss +54 -54
- package/components/row/scss/row.scss +8 -8
- package/components/scrollbar/scss/scrollbar.scss +51 -51
- package/components/scrollbar/scss/variables.scss +8 -8
- package/components/sidebar/scss/sidebar.scss +50 -50
- package/components/sidebar/scss/sidebars.scss +13 -13
- package/components/sidebar/scss/variables.scss +25 -25
- package/components/text/scss/text.scss +12 -12
- package/components/text/scss/variables.scss +9 -9
- package/components/thumbnail/scss/thumbnail.scss +7 -7
- package/components/thumbnail/scss/variables.scss +7 -7
- package/components/tooltip/scss/_center.scss +13 -13
- package/components/tooltip/scss/_east.scss +34 -34
- package/components/tooltip/scss/_north.scss +34 -34
- package/components/tooltip/scss/_south.scss +35 -35
- package/components/tooltip/scss/_west.scss +34 -34
- package/components/tooltip/scss/tooltip.scss +107 -107
- package/components/tooltip/scss/variables.scss +25 -25
- package/css-utilities/[margin,padding]/scss/styles.scss +41 -41
- package/css-utilities/[margin,padding]/scss/variables.scss +52 -52
- package/css-utilities/[max,min]/scss/variables.scss +23 -23
- package/css-utilities/absolute/scss/absolute.scss +59 -59
- package/css-utilities/background/scss/variables.scss +28 -28
- package/css-utilities/border/scss/border.scss +21 -21
- package/css-utilities/border/scss/variables.scss +66 -66
- package/css-utilities/color/scss/variables.scss +32 -32
- package/css-utilities/flex/scss/flex.scss +67 -67
- package/css-utilities/hidden/scss/hidden.scss +28 -28
- package/css-utilities/index.scss +14 -14
- package/css-utilities/pointer/scss/pointer.scss +5 -5
- package/css-utilities/size/scss/variables.scss +12 -12
- package/css-utilities/slide/scss/slide.scss +20 -20
- package/css-utilities/slide/scss/variables.scss +6 -6
- package/css-utilities/text/scss/text.scss +93 -93
- package/css-utilities/text/scss/variables.scss +31 -31
- package/css-utilities/width/scss/variables.scss +12 -12
- package/lib/index.scss +7 -7
- package/lib/scss/color.scss +8 -8
- package/lib/scss/list.scss +112 -112
- package/lib/scss/string.scss +54 -54
- package/package.json +22 -22
- package/storage/fonts/Montserrat/montserrat.css +79 -79
- package/tokens/index.scss +11 -11
- package/tokens/scss/border-radius.scss +12 -12
- package/tokens/scss/border-width.scss +6 -6
- package/tokens/scss/box-shadow.scss +13 -13
- package/tokens/scss/breakpoints.scss +13 -13
- package/tokens/scss/color.scss +71 -71
- package/tokens/scss/font-size.scss +12 -12
- package/tokens/scss/font-weight.scss +6 -6
- package/tokens/scss/line-height.scss +6 -6
- package/tokens/scss/size.scss +13 -13
- package/tokens/scss/state.scss +93 -93
- package/tokens/scss/transition-duration.scss +5 -5
- package/webpack.sass.config.js +59 -59
|
@@ -1,79 +1,79 @@
|
|
|
1
|
-
@font-face {
|
|
2
|
-
font-display: swap;
|
|
3
|
-
font-family: 'Montserrat';
|
|
4
|
-
font-style: normal;
|
|
5
|
-
font-weight: 400;
|
|
6
|
-
src: local('Montserrat Regular'), local('Montserrat-Regular'),
|
|
7
|
-
url('fonts/Montserrat-Regular.woff2') format('woff2'),
|
|
8
|
-
url('fonts/Montserrat-Regular.woff') format('woff');
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
@font-face {
|
|
12
|
-
font-display: swap;
|
|
13
|
-
font-family: 'Montserrat';
|
|
14
|
-
font-style: italic;
|
|
15
|
-
font-weight: 400;
|
|
16
|
-
src: local('Montserrat Italic'), local('Montserrat-Italic'),
|
|
17
|
-
url('fonts/Montserrat-Italic.woff2') format('woff2'),
|
|
18
|
-
url('fonts/Montserrat-Italic.woff') format('woff');
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
@font-face {
|
|
22
|
-
font-display: swap;
|
|
23
|
-
font-family: 'Montserrat';
|
|
24
|
-
font-style: normal;
|
|
25
|
-
font-weight: 500;
|
|
26
|
-
src: local('Montserrat Medium'), local('Montserrat-Medium'),
|
|
27
|
-
url('fonts/Montserrat-Medium.woff2') format('woff2'),
|
|
28
|
-
url('fonts/Montserrat-Medium.woff') format('woff');
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
@font-face {
|
|
32
|
-
font-display: swap;
|
|
33
|
-
font-family: 'Montserrat';
|
|
34
|
-
font-style: italic;
|
|
35
|
-
font-weight: 500;
|
|
36
|
-
src: local('Montserrat MediumItalic'), local('Montserrat-MediumItalic'),
|
|
37
|
-
url('fonts/Montserrat-MediumItalic.woff2') format('woff2'),
|
|
38
|
-
url('fonts/Montserrat-MediumItalic.woff') format('woff');
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
@font-face {
|
|
42
|
-
font-display: swap;
|
|
43
|
-
font-family: 'Montserrat';
|
|
44
|
-
font-style: normal;
|
|
45
|
-
font-weight: 600;
|
|
46
|
-
src: local('Montserrat SemiBold'), local('Montserrat-SemiBold'),
|
|
47
|
-
url('fonts/Montserrat-SemiBold.woff2') format('woff2'),
|
|
48
|
-
url('fonts/Montserrat-SemiBold.woff') format('woff');
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
@font-face {
|
|
52
|
-
font-display: swap;
|
|
53
|
-
font-family: 'Montserrat';
|
|
54
|
-
font-style: italic;
|
|
55
|
-
font-weight: 600;
|
|
56
|
-
src: local('Montserrat SemiBoldItalic'), local('Montserrat-SemiBoldItalic'),
|
|
57
|
-
url('fonts/Montserrat-SemiBoldItalic.woff2') format('woff2'),
|
|
58
|
-
url('fonts/Montserrat-SemiBoldItalic.woff') format('woff');
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
@font-face {
|
|
62
|
-
font-display: swap;
|
|
63
|
-
font-family: 'Montserrat';
|
|
64
|
-
font-style: normal;
|
|
65
|
-
font-weight: 700;
|
|
66
|
-
src: local('Montserrat Bold'), local('Montserrat Bold'),
|
|
67
|
-
url('fonts/Montserrat-Bold.woff2') format('woff2'),
|
|
68
|
-
url('fonts/Montserrat-Bold.woff') format('woff');
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
@font-face {
|
|
72
|
-
font-display: swap;
|
|
73
|
-
font-family: 'Montserrat';
|
|
74
|
-
font-style: italic;
|
|
75
|
-
font-weight: 700;
|
|
76
|
-
src: local('Montserrat BoldItalic'), local('Montserrat-BoldItalic'),
|
|
77
|
-
url('fonts/Montserrat-BoldItalic.woff2') format('woff2'),
|
|
78
|
-
url('fonts/Montserrat-BoldItalic.woff') format('woff');
|
|
79
|
-
}
|
|
1
|
+
@font-face {
|
|
2
|
+
font-display: swap;
|
|
3
|
+
font-family: 'Montserrat';
|
|
4
|
+
font-style: normal;
|
|
5
|
+
font-weight: 400;
|
|
6
|
+
src: local('Montserrat Regular'), local('Montserrat-Regular'),
|
|
7
|
+
url('fonts/Montserrat-Regular.woff2') format('woff2'),
|
|
8
|
+
url('fonts/Montserrat-Regular.woff') format('woff');
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
@font-face {
|
|
12
|
+
font-display: swap;
|
|
13
|
+
font-family: 'Montserrat';
|
|
14
|
+
font-style: italic;
|
|
15
|
+
font-weight: 400;
|
|
16
|
+
src: local('Montserrat Italic'), local('Montserrat-Italic'),
|
|
17
|
+
url('fonts/Montserrat-Italic.woff2') format('woff2'),
|
|
18
|
+
url('fonts/Montserrat-Italic.woff') format('woff');
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
@font-face {
|
|
22
|
+
font-display: swap;
|
|
23
|
+
font-family: 'Montserrat';
|
|
24
|
+
font-style: normal;
|
|
25
|
+
font-weight: 500;
|
|
26
|
+
src: local('Montserrat Medium'), local('Montserrat-Medium'),
|
|
27
|
+
url('fonts/Montserrat-Medium.woff2') format('woff2'),
|
|
28
|
+
url('fonts/Montserrat-Medium.woff') format('woff');
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
@font-face {
|
|
32
|
+
font-display: swap;
|
|
33
|
+
font-family: 'Montserrat';
|
|
34
|
+
font-style: italic;
|
|
35
|
+
font-weight: 500;
|
|
36
|
+
src: local('Montserrat MediumItalic'), local('Montserrat-MediumItalic'),
|
|
37
|
+
url('fonts/Montserrat-MediumItalic.woff2') format('woff2'),
|
|
38
|
+
url('fonts/Montserrat-MediumItalic.woff') format('woff');
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
@font-face {
|
|
42
|
+
font-display: swap;
|
|
43
|
+
font-family: 'Montserrat';
|
|
44
|
+
font-style: normal;
|
|
45
|
+
font-weight: 600;
|
|
46
|
+
src: local('Montserrat SemiBold'), local('Montserrat-SemiBold'),
|
|
47
|
+
url('fonts/Montserrat-SemiBold.woff2') format('woff2'),
|
|
48
|
+
url('fonts/Montserrat-SemiBold.woff') format('woff');
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
@font-face {
|
|
52
|
+
font-display: swap;
|
|
53
|
+
font-family: 'Montserrat';
|
|
54
|
+
font-style: italic;
|
|
55
|
+
font-weight: 600;
|
|
56
|
+
src: local('Montserrat SemiBoldItalic'), local('Montserrat-SemiBoldItalic'),
|
|
57
|
+
url('fonts/Montserrat-SemiBoldItalic.woff2') format('woff2'),
|
|
58
|
+
url('fonts/Montserrat-SemiBoldItalic.woff') format('woff');
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
@font-face {
|
|
62
|
+
font-display: swap;
|
|
63
|
+
font-family: 'Montserrat';
|
|
64
|
+
font-style: normal;
|
|
65
|
+
font-weight: 700;
|
|
66
|
+
src: local('Montserrat Bold'), local('Montserrat Bold'),
|
|
67
|
+
url('fonts/Montserrat-Bold.woff2') format('woff2'),
|
|
68
|
+
url('fonts/Montserrat-Bold.woff') format('woff');
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
@font-face {
|
|
72
|
+
font-display: swap;
|
|
73
|
+
font-family: 'Montserrat';
|
|
74
|
+
font-style: italic;
|
|
75
|
+
font-weight: 700;
|
|
76
|
+
src: local('Montserrat BoldItalic'), local('Montserrat-BoldItalic'),
|
|
77
|
+
url('fonts/Montserrat-BoldItalic.woff2') format('woff2'),
|
|
78
|
+
url('fonts/Montserrat-BoldItalic.woff') format('woff');
|
|
79
|
+
}
|
package/tokens/index.scss
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
@forward 'scss/border-radius';
|
|
2
|
-
@forward 'scss/border-width';
|
|
3
|
-
@forward 'scss/box-shadow';
|
|
4
|
-
@forward 'scss/breakpoints';
|
|
5
|
-
@forward 'scss/color';
|
|
6
|
-
@forward 'scss/font-size';
|
|
7
|
-
@forward 'scss/font-weight';
|
|
8
|
-
@forward 'scss/line-height';
|
|
9
|
-
@forward 'scss/size';
|
|
10
|
-
@forward 'scss/state';
|
|
11
|
-
@forward 'scss/transition-duration';
|
|
1
|
+
@forward 'scss/border-radius';
|
|
2
|
+
@forward 'scss/border-width';
|
|
3
|
+
@forward 'scss/box-shadow';
|
|
4
|
+
@forward 'scss/breakpoints';
|
|
5
|
+
@forward 'scss/color';
|
|
6
|
+
@forward 'scss/font-size';
|
|
7
|
+
@forward 'scss/font-weight';
|
|
8
|
+
@forward 'scss/line-height';
|
|
9
|
+
@forward 'scss/size';
|
|
10
|
+
@forward 'scss/state';
|
|
11
|
+
@forward 'scss/transition-duration';
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
$border-radius: (
|
|
2
|
-
0px: 0px,
|
|
3
|
-
circle: 100%,
|
|
4
|
-
curved: 240px,
|
|
5
|
-
|
|
6
|
-
100: 2px,
|
|
7
|
-
200: 4px,
|
|
8
|
-
300: 6px,
|
|
9
|
-
400: 8px,
|
|
10
|
-
500: 12px,
|
|
11
|
-
600: 16px
|
|
12
|
-
);
|
|
1
|
+
$border-radius: (
|
|
2
|
+
0px: 0px,
|
|
3
|
+
circle: 100%,
|
|
4
|
+
curved: 240px,
|
|
5
|
+
|
|
6
|
+
100: 2px,
|
|
7
|
+
200: 4px,
|
|
8
|
+
300: 6px,
|
|
9
|
+
400: 8px,
|
|
10
|
+
500: 12px,
|
|
11
|
+
600: 16px
|
|
12
|
+
);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
$border-width: (
|
|
2
|
-
400: 1px,
|
|
3
|
-
500: 2px,
|
|
4
|
-
600: 3px,
|
|
5
|
-
700: 4px
|
|
6
|
-
);
|
|
1
|
+
$border-width: (
|
|
2
|
+
400: 1px,
|
|
3
|
+
500: 2px,
|
|
4
|
+
600: 3px,
|
|
5
|
+
700: 4px
|
|
6
|
+
);
|
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
$box-shadow: (
|
|
2
|
-
300: #{
|
|
3
|
-
0px 8px 16px -4px rgba(0, 3, 19, 0.016),
|
|
4
|
-
0px 4px 8px -2px rgba(0, 3, 19, 0.008)
|
|
5
|
-
},
|
|
6
|
-
400: #{
|
|
7
|
-
0px 16px 24px -4px rgba(0, 3, 19, 0.048),
|
|
8
|
-
0px 8px 8px -4px rgba(0, 3, 19, 0.024)
|
|
9
|
-
},
|
|
10
|
-
500: #{
|
|
11
|
-
0px 16px 32px -8px rgba(0, 3, 19, 0.16)
|
|
12
|
-
}
|
|
13
|
-
);
|
|
1
|
+
$box-shadow: (
|
|
2
|
+
300: #{
|
|
3
|
+
0px 8px 16px -4px rgba(0, 3, 19, 0.016),
|
|
4
|
+
0px 4px 8px -2px rgba(0, 3, 19, 0.008)
|
|
5
|
+
},
|
|
6
|
+
400: #{
|
|
7
|
+
0px 16px 24px -4px rgba(0, 3, 19, 0.048),
|
|
8
|
+
0px 8px 8px -4px rgba(0, 3, 19, 0.024)
|
|
9
|
+
},
|
|
10
|
+
500: #{
|
|
11
|
+
0px 16px 32px -8px rgba(0, 3, 19, 0.16)
|
|
12
|
+
}
|
|
13
|
+
);
|
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
@use 'ui/lib';
|
|
2
|
-
|
|
3
|
-
$breakpoints: 1400px 1000px 600px;
|
|
4
|
-
|
|
5
|
-
// @mixin breakpoints() {
|
|
6
|
-
// @each $breakpoint in $breakpoints {
|
|
7
|
-
// @include lib.breakpoint(max-width, $breakpoint) {
|
|
8
|
-
// &\:#{$breakpoint} {
|
|
9
|
-
// @content;
|
|
10
|
-
// }
|
|
11
|
-
// }
|
|
12
|
-
// }
|
|
13
|
-
// }
|
|
1
|
+
@use 'ui/lib';
|
|
2
|
+
|
|
3
|
+
$breakpoints: 1400px 1000px 600px;
|
|
4
|
+
|
|
5
|
+
// @mixin breakpoints() {
|
|
6
|
+
// @each $breakpoint in $breakpoints {
|
|
7
|
+
// @include lib.breakpoint(max-width, $breakpoint) {
|
|
8
|
+
// &\:#{$breakpoint} {
|
|
9
|
+
// @content;
|
|
10
|
+
// }
|
|
11
|
+
// }
|
|
12
|
+
// }
|
|
13
|
+
// }
|
package/tokens/scss/color.scss
CHANGED
|
@@ -1,71 +1,71 @@
|
|
|
1
|
-
@use 'ui/lib';
|
|
2
|
-
|
|
3
|
-
$color: (
|
|
4
|
-
'black': (
|
|
5
|
-
300: #0f1325,
|
|
6
|
-
400: #04081a,
|
|
7
|
-
500: #000313
|
|
8
|
-
),
|
|
9
|
-
'blue': (
|
|
10
|
-
300: #3453ff,
|
|
11
|
-
400: #2a4bff,
|
|
12
|
-
500: #2343f8
|
|
13
|
-
),
|
|
14
|
-
'border': (
|
|
15
|
-
300: #c4c9df,
|
|
16
|
-
400: #b4b9d2,
|
|
17
|
-
500: #a5a9c3
|
|
18
|
-
),
|
|
19
|
-
'green': (
|
|
20
|
-
300: #5fff81,
|
|
21
|
-
400: #2aff57,
|
|
22
|
-
500: #23f850
|
|
23
|
-
),
|
|
24
|
-
'grey': (
|
|
25
|
-
300: #f2f9ff,
|
|
26
|
-
400: #e7f1fa,
|
|
27
|
-
500: #dde8f0
|
|
28
|
-
),
|
|
29
|
-
'purple': (
|
|
30
|
-
300: #6634ff,
|
|
31
|
-
400: #5e2aff,
|
|
32
|
-
500: #5723f8
|
|
33
|
-
),
|
|
34
|
-
'red': (
|
|
35
|
-
300: #ff3446,
|
|
36
|
-
400: #ff2a3d,
|
|
37
|
-
500: #f82336
|
|
38
|
-
),
|
|
39
|
-
'text': (
|
|
40
|
-
300: #676c84,
|
|
41
|
-
400: #393d57,
|
|
42
|
-
500: #1f2542
|
|
43
|
-
),
|
|
44
|
-
'white': (
|
|
45
|
-
300: #fff,
|
|
46
|
-
400: #fff,
|
|
47
|
-
500: #fff
|
|
48
|
-
),
|
|
49
|
-
'yellow': (
|
|
50
|
-
300: #fff95f,
|
|
51
|
-
400: #fff92a,
|
|
52
|
-
500: #f8f123
|
|
53
|
-
)
|
|
54
|
-
);
|
|
55
|
-
|
|
56
|
-
/**
|
|
57
|
-
*------------------------------------------------------------------------------
|
|
58
|
-
*
|
|
59
|
-
* Retrieve Color as RGBA Value
|
|
60
|
-
*
|
|
61
|
-
*/
|
|
62
|
-
|
|
63
|
-
@function color($keys, $opacity) {
|
|
64
|
-
$c: $color;
|
|
65
|
-
|
|
66
|
-
@each $key in $keys {
|
|
67
|
-
$c: lib.map-get($c, $key);
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
@return lib.color-change($c, $alpha: $opacity);
|
|
71
|
-
}
|
|
1
|
+
@use 'ui/lib';
|
|
2
|
+
|
|
3
|
+
$color: (
|
|
4
|
+
'black': (
|
|
5
|
+
300: #0f1325,
|
|
6
|
+
400: #04081a,
|
|
7
|
+
500: #000313
|
|
8
|
+
),
|
|
9
|
+
'blue': (
|
|
10
|
+
300: #3453ff,
|
|
11
|
+
400: #2a4bff,
|
|
12
|
+
500: #2343f8
|
|
13
|
+
),
|
|
14
|
+
'border': (
|
|
15
|
+
300: #c4c9df,
|
|
16
|
+
400: #b4b9d2,
|
|
17
|
+
500: #a5a9c3
|
|
18
|
+
),
|
|
19
|
+
'green': (
|
|
20
|
+
300: #5fff81,
|
|
21
|
+
400: #2aff57,
|
|
22
|
+
500: #23f850
|
|
23
|
+
),
|
|
24
|
+
'grey': (
|
|
25
|
+
300: #f2f9ff,
|
|
26
|
+
400: #e7f1fa,
|
|
27
|
+
500: #dde8f0
|
|
28
|
+
),
|
|
29
|
+
'purple': (
|
|
30
|
+
300: #6634ff,
|
|
31
|
+
400: #5e2aff,
|
|
32
|
+
500: #5723f8
|
|
33
|
+
),
|
|
34
|
+
'red': (
|
|
35
|
+
300: #ff3446,
|
|
36
|
+
400: #ff2a3d,
|
|
37
|
+
500: #f82336
|
|
38
|
+
),
|
|
39
|
+
'text': (
|
|
40
|
+
300: #676c84,
|
|
41
|
+
400: #393d57,
|
|
42
|
+
500: #1f2542
|
|
43
|
+
),
|
|
44
|
+
'white': (
|
|
45
|
+
300: #fff,
|
|
46
|
+
400: #fff,
|
|
47
|
+
500: #fff
|
|
48
|
+
),
|
|
49
|
+
'yellow': (
|
|
50
|
+
300: #fff95f,
|
|
51
|
+
400: #fff92a,
|
|
52
|
+
500: #f8f123
|
|
53
|
+
)
|
|
54
|
+
);
|
|
55
|
+
|
|
56
|
+
/**
|
|
57
|
+
*------------------------------------------------------------------------------
|
|
58
|
+
*
|
|
59
|
+
* Retrieve Color as RGBA Value
|
|
60
|
+
*
|
|
61
|
+
*/
|
|
62
|
+
|
|
63
|
+
@function color($keys, $opacity) {
|
|
64
|
+
$c: $color;
|
|
65
|
+
|
|
66
|
+
@each $key in $keys {
|
|
67
|
+
$c: lib.map-get($c, $key);
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
@return lib.color-change($c, $alpha: $opacity);
|
|
71
|
+
}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
$font-size: (
|
|
2
|
-
100: 8px,
|
|
3
|
-
200: 10px,
|
|
4
|
-
300: 12px,
|
|
5
|
-
400: 14px,
|
|
6
|
-
|
|
7
|
-
// Primarily Used For Headers h1 - h4
|
|
8
|
-
500: 16px,
|
|
9
|
-
600: 24px,
|
|
10
|
-
700: 32px,
|
|
11
|
-
800: 40px
|
|
12
|
-
);
|
|
1
|
+
$font-size: (
|
|
2
|
+
100: 8px,
|
|
3
|
+
200: 10px,
|
|
4
|
+
300: 12px,
|
|
5
|
+
400: 14px,
|
|
6
|
+
|
|
7
|
+
// Primarily Used For Headers h1 - h4
|
|
8
|
+
500: 16px,
|
|
9
|
+
600: 24px,
|
|
10
|
+
700: 32px,
|
|
11
|
+
800: 40px
|
|
12
|
+
);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
$font-weight: (
|
|
2
|
-
300: 400,
|
|
3
|
-
400: 500,
|
|
4
|
-
500: 600,
|
|
5
|
-
600: 700
|
|
6
|
-
);
|
|
1
|
+
$font-weight: (
|
|
2
|
+
300: 400,
|
|
3
|
+
400: 500,
|
|
4
|
+
500: 600,
|
|
5
|
+
600: 700
|
|
6
|
+
);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
$line-height: (
|
|
2
|
-
100: 1,
|
|
3
|
-
200: 1.2,
|
|
4
|
-
300: 1.4,
|
|
5
|
-
400: 1.6
|
|
6
|
-
);
|
|
1
|
+
$line-height: (
|
|
2
|
+
100: 1,
|
|
3
|
+
200: 1.2,
|
|
4
|
+
300: 1.4,
|
|
5
|
+
400: 1.6
|
|
6
|
+
);
|
package/tokens/scss/size.scss
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
$size: (
|
|
2
|
-
0px: 0px,
|
|
3
|
-
|
|
4
|
-
100: 4px,
|
|
5
|
-
200: 8px,
|
|
6
|
-
300: 12px,
|
|
7
|
-
400: 16px,
|
|
8
|
-
500: 20px,
|
|
9
|
-
600: 24px,
|
|
10
|
-
700: 32px,
|
|
11
|
-
800: 40px,
|
|
12
|
-
900: 48px
|
|
13
|
-
);
|
|
1
|
+
$size: (
|
|
2
|
+
0px: 0px,
|
|
3
|
+
|
|
4
|
+
100: 4px,
|
|
5
|
+
200: 8px,
|
|
6
|
+
300: 12px,
|
|
7
|
+
400: 16px,
|
|
8
|
+
500: 20px,
|
|
9
|
+
600: 24px,
|
|
10
|
+
700: 32px,
|
|
11
|
+
800: 40px,
|
|
12
|
+
900: 48px
|
|
13
|
+
);
|