@elastic/eui-theme-common 3.1.0 → 4.0.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.
package/package.json
CHANGED
|
@@ -23,7 +23,6 @@
|
|
|
23
23
|
// Each prefix must be its own content block
|
|
24
24
|
&::-webkit-input-placeholder { @content; opacity: 1; }
|
|
25
25
|
&::-moz-placeholder { @content; opacity: 1; }
|
|
26
|
-
&:-ms-input-placeholder { @content; opacity: 1; }
|
|
27
26
|
&:-moz-placeholder { @content; opacity: 1; }
|
|
28
27
|
&::placeholder { @content; opacity: 1; }
|
|
29
28
|
}
|
|
@@ -19,8 +19,6 @@ The following files still use the Sass version:
|
|
|
19
19
|
@mixin euiRangeTrackPerBrowser {
|
|
20
20
|
&::-webkit-slider-runnable-track { @content; }
|
|
21
21
|
&::-moz-range-track { @content; }
|
|
22
|
-
&::-ms-fill-lower { @content; }
|
|
23
|
-
&::-ms-fill-upper { @content; }
|
|
24
22
|
}
|
|
25
23
|
|
|
26
24
|
@mixin euiRangeThumbBorder {
|
|
@@ -52,7 +50,6 @@ The following files still use the Sass version:
|
|
|
52
50
|
@mixin euiRangeThumbPerBrowser {
|
|
53
51
|
&::-webkit-slider-thumb { @content; }
|
|
54
52
|
&::-moz-range-thumb { @content; }
|
|
55
|
-
&::-ms-thumb { @content; }
|
|
56
53
|
}
|
|
57
54
|
|
|
58
55
|
@mixin euiRangeThumbFocus {
|
|
@@ -1,75 +1,8 @@
|
|
|
1
1
|
// Families
|
|
2
|
-
$euiFontFamily: 'Inter', BlinkMacSystemFont, Helvetica, Arial, sans-serif !default;
|
|
3
2
|
$euiCodeFontFamily: 'Roboto Mono', Menlo, Courier, monospace !default;
|
|
4
3
|
|
|
5
4
|
// Careful using ligatures. Code editors like ACE will often error because of width calculations
|
|
6
5
|
$euiFontFeatureSettings: 'calt' 1, 'kern' 1, 'liga' 1 !default;
|
|
7
6
|
|
|
8
|
-
// Font sizes -- scale is loosely based on Major Third (1.250)
|
|
9
|
-
$euiTextScale: 2.25, 1.75, 1.25, 1.125, 1, .875, .75 !default;
|
|
10
|
-
|
|
11
|
-
$euiFontSize: $euiSize !default; // 5th position in scale
|
|
12
|
-
$euiFontSizeXS: $euiFontSize * nth($euiTextScale, 7) !default; // 12px
|
|
13
|
-
$euiFontSizeS: $euiFontSize * nth($euiTextScale, 6) !default; // 14px
|
|
14
|
-
$euiFontSizeM: $euiFontSize * nth($euiTextScale, 4) !default; // 18px
|
|
15
|
-
$euiFontSizeL: $euiFontSize * nth($euiTextScale, 3) !default; // 20px
|
|
16
|
-
$euiFontSizeXL: $euiFontSize * nth($euiTextScale, 2) !default; // 28px
|
|
17
|
-
$euiFontSizeXXL: $euiFontSize * nth($euiTextScale, 1) !default; // 36px
|
|
18
|
-
|
|
19
7
|
// Line height
|
|
20
|
-
$euiLineHeight: 1.5 !default;
|
|
21
|
-
$euiBodyLineHeight: 1 !default;
|
|
22
|
-
|
|
23
|
-
// Normally functions are imported before variables in `_index.scss` files
|
|
24
|
-
// But because they need to consume some typography variables they need to live here
|
|
25
|
-
@function convertToRem($size) {
|
|
26
|
-
@return #{$size / $euiFontSize}rem;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
// Our base gridline is at 1/2 the font-size, ensure line-heights stay on that gridline.
|
|
30
|
-
// EX: A proper line-height for text is 1.5 times the font-size.
|
|
31
|
-
// If our base font size (euiFontSize) is 16, our baseline is 8 (16*1.5 / 3). To ensure the
|
|
32
|
-
// text stays on the baseline, we pass a multiplier to calculate a line-height in rems.
|
|
33
|
-
@function lineHeightFromBaseline($multiplier: 3) {
|
|
34
|
-
@return convertToRem(($euiFontSize / 2) * $multiplier);
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
// Titles map
|
|
38
|
-
// Lists all the properties per EuiTitle size that then gets looped through to create the selectors.
|
|
39
|
-
// The map allows for tokenization and easier customization per theme, otherwise you'd have to override the selectors themselves
|
|
40
|
-
$euiTitles: (
|
|
41
|
-
'xxxs': (
|
|
42
|
-
'font-size': $euiFontSizeXS,
|
|
43
|
-
'line-height': lineHeightFromBaseline(3),
|
|
44
|
-
'font-weight': $euiFontWeightBold,
|
|
45
|
-
),
|
|
46
|
-
'xxs': (
|
|
47
|
-
'font-size': $euiFontSizeS,
|
|
48
|
-
'line-height': lineHeightFromBaseline(3),
|
|
49
|
-
'font-weight': $euiFontWeightBold,
|
|
50
|
-
),
|
|
51
|
-
'xs': (
|
|
52
|
-
'font-size': $euiFontSize,
|
|
53
|
-
'line-height': lineHeightFromBaseline(3),
|
|
54
|
-
'font-weight': $euiFontWeightSemiBold,
|
|
55
|
-
'letter-spacing': -.02em,
|
|
56
|
-
),
|
|
57
|
-
's': (
|
|
58
|
-
'font-size': $euiFontSizeL,
|
|
59
|
-
'line-height': lineHeightFromBaseline(4),
|
|
60
|
-
'font-weight': $euiFontWeightMedium,
|
|
61
|
-
'letter-spacing': -.025em,
|
|
62
|
-
),
|
|
63
|
-
'm': (
|
|
64
|
-
'font-size': $euiFontSizeXL,
|
|
65
|
-
'line-height': lineHeightFromBaseline(5),
|
|
66
|
-
'font-weight': $euiFontWeightLight,
|
|
67
|
-
'letter-spacing': -.04em,
|
|
68
|
-
),
|
|
69
|
-
'l': (
|
|
70
|
-
'font-size': $euiFontSizeXXL,
|
|
71
|
-
'line-height': lineHeightFromBaseline(6),
|
|
72
|
-
'font-weight': $euiFontWeightLight,
|
|
73
|
-
'letter-spacing': -.03em,
|
|
74
|
-
),
|
|
75
|
-
) !default;
|
|
8
|
+
$euiLineHeight: 1.5 !default;
|