@operato/data-grist 2.0.0-alpha.148 → 2.0.0-alpha.150

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 (24) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/dist/src/data-card/data-card-gutter-menu.js +2 -2
  3. package/dist/src/data-card/data-card-gutter-menu.js.map +1 -1
  4. package/dist/src/data-card/data-card-gutter.js +2 -4
  5. package/dist/src/data-card/data-card-gutter.js.map +1 -1
  6. package/dist/src/data-grid/data-grid-accum-field.js +3 -3
  7. package/dist/src/data-grid/data-grid-accum-field.js.map +1 -1
  8. package/dist/src/data-grid/data-grid-body.js +4 -0
  9. package/dist/src/data-grid/data-grid-body.js.map +1 -1
  10. package/dist/src/data-grid/data-grid-footer.js +2 -0
  11. package/dist/src/data-grid/data-grid-footer.js.map +1 -1
  12. package/dist/src/data-grid/data-grid-header.js +3 -1
  13. package/dist/src/data-grid/data-grid-header.js.map +1 -1
  14. package/dist/tsconfig.tsbuildinfo +1 -1
  15. package/package.json +6 -6
  16. package/src/data-card/data-card-gutter-menu.ts +2 -2
  17. package/src/data-card/data-card-gutter.ts +2 -4
  18. package/src/data-grid/data-grid-accum-field.ts +3 -3
  19. package/src/data-grid/data-grid-body.ts +4 -0
  20. package/src/data-grid/data-grid-footer.ts +2 -0
  21. package/src/data-grid/data-grid-header.ts +3 -1
  22. package/themes/grist-theme.css +25 -21
  23. package/themes/md-typescale-styles.css +15 -15
  24. package/themes/spacing.css +22 -22
package/src/data-card/data-card-gutter.ts CHANGED
@@ -24,14 +24,12 @@ export class DataCardGutter extends LitElement {
24
24
  border: var(--data-card-item-btn-border);
25
25
  border-radius: var(--data-card-item-btn-border-radius);
26
26
  padding: var(--data-card-item-btn-padding);
27
- font-size: var(--md-sys-typescale-label-large-size);
28
-
29
-
27
+ font-size: var(--md-sys-typescale-label-large-size, 0.875rem);
30
28
  }
31
29
 
32
30
  *:hover {
33
31
  cursor: pointer;
34
- background-color:var(--md-sys-color-primary);
32
+ background-color: var(--md-sys-color-primary);
35
33
  color: var(--md-sys-color-on-primary);
36
34
  }
37
35
 
package/src/data-grid/data-grid-accum-field.ts CHANGED
@@ -25,11 +25,11 @@ export class DataGridAccumField extends LitElement {
25
25
  background-color: var(--md-sys-color-inverse-primary);
26
26
  border: var(--grid-record-border-bottom);
27
27
  border-width: 1px 0;
28
- padding:var(--spacing-small);
28
+ padding: var(--spacing-small);
29
29
 
30
30
  font-size: var(--grid-record-wide-fontsize);
31
- color:var(--md-sys-color-primary);
32
- font-weight:var(--md-sys-typescale-label-large-weight);
31
+ color: var(--md-sys-color-primary);
32
+ font-weight: var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500));
33
33
  min-height: 19px;
34
34
  }
35
35
 
package/src/data-grid/data-grid-body.ts CHANGED
@@ -61,6 +61,10 @@ export class DataGridBody extends LitElement {
61
61
  TooltipStyles,
62
62
  dataGridBodyStyle,
63
63
  css`
64
+ :host {
65
+ font-variation-settings: 'FILL' 1;
66
+ }
67
+
64
68
  [select-block] {
65
69
  position: absolute;
66
70
  left: var(--select-box-left);
package/src/data-grid/data-grid-footer.ts CHANGED
@@ -21,6 +21,8 @@ export class DataGridFooter extends LitElement {
21
21
  background-color: var(--grid-footer-background-color);
22
22
  font-size: var(--grid-footer-font-size);
23
23
  align-items: center;
24
+
25
+ font-variation-settings: 'FILL' 1;
24
26
  }
25
27
 
26
28
  :host * {
package/src/data-grid/data-grid-header.ts CHANGED
@@ -28,6 +28,8 @@ export class DataGridHeader extends LitElement {
28
28
 
29
29
  border-top: var(--grid-header-top-border);
30
30
  overflow: hidden;
31
+
32
+ font-variation-settings: 'FILL' 1;
31
33
  }
32
34
 
33
35
  div[column] {
@@ -45,7 +47,7 @@ export class DataGridHeader extends LitElement {
45
47
  }
46
48
 
47
49
  div[gutter] {
48
- padding: var(--spacing-small) 0 ;
50
+ padding: var(--spacing-small) 0;
49
51
  text-align: center;
50
52
  }
51
53
 
package/themes/grist-theme.css CHANGED
@@ -7,14 +7,15 @@ body {
7
7
  --grist-background-color: transparent;
8
8
  --grist-title-margin: 0 0 0 10px;
9
9
  --grist-title-border: none;
10
- --grist-title-font: var(--md-sys-typescale-label-large-weight) 1.1em var(--theme-font,'Noto');
10
+ --grist-title-font: var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500)) 1.1em
11
+ var(--theme-font, 'Roboto');
11
12
  --grist-title-color: var(--md-sys-color-on-surface);
12
13
  --grist-title-icon-color: var(--md-sys-color-on-surface-variant);
13
14
  --grist-title-icon-margin: 0 3px 2px 0;
14
- --grist-title-icon-size: var(--md-sys-typescale-label-medium-size);
15
+ --grist-title-icon-size: var(--md-sys-typescale-label-medium-size, 0.75rem);
15
16
  --grist-title-with-grid-padding: 0;
16
17
 
17
- --grist-object-editor-font: normal 1em var(--theme-font,'Noto');
18
+ --grist-object-editor-font: normal 1em var(--theme-font, 'Roboto');
18
19
  --grist-object-editor-color: var(--md-sys-color-on-surface);
19
20
 
20
21
  --grist-input-progress-border: 1px solid rgba(255, 255, 255, 0.5);
@@ -31,9 +32,10 @@ body {
31
32
  --grid-header-splitter-border: var(--grid-container-border-color);
32
33
  --grid-header-splitter-border-hover: 1px solid var(--md-sys-color-inverse-primary);
33
34
  --grid-header-color: var(--md-sys-color-primary);
34
- --grid-header-font: var(--md-sys-typescale-label-large-weight) var(--fontsize-small) var(--theme-font,'Noto');
35
+ --grid-header-font: var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500))
36
+ var(--fontsize-small) var(--theme-font, 'Roboto');
35
37
  --grid-header-filter-title-color: var(--md-sys-color-on-surface);
36
- --grid-header-filter-title-font: normal 12px var(--theme-font,'Noto');
38
+ --grid-header-filter-title-font: normal 12px var(--theme-font, 'Roboto');
37
39
  --grid-header-filter-title-icon-color: var(--md-sys-color-on-surface-variant);
38
40
 
39
41
  --grid-body-bottom-border: var(--grid-header-bottom-border);
@@ -45,7 +47,7 @@ body {
45
47
  --grid-record-padding: var(--spacing-small) var(--spacing-medium);
46
48
  --grid-record-color: var(--md-sys-color-on-surface-variant);
47
49
  --grid-record-color-hover: var(--md-sys-color-primary);
48
- --grid-record-wide-fontsize: var(--md-sys-typescale-label-medium-size);
50
+ --grid-record-wide-fontsize: var(--md-sys-typescale-label-medium-size, 0.75rem);
49
51
  --grid-record-selected-background-color: var(--md-sys-color-primary-container);
50
52
  --grid-record-selected-color: var(--md-sys-color-primary);
51
53
  --grid-record-focused-background-color: var(--md-sys-color-secondary-container);
@@ -58,7 +60,7 @@ body {
58
60
  --grid-record-emphasized-color: var(--md-sys-color-on-secondary-fixed-variant);
59
61
  --grid-record-editing-background-color: var(--md-sys-color-inverse-primary);
60
62
  --grid-record-editing-border: 1px dashed rgba(var(--md-sys-color-primary-rgb), 0.4);
61
- --grid-record-fontsize: var(--md-sys-typescale-label-medium-size);
63
+ --grid-record-fontsize: var(--md-sys-typescale-label-medium-size, 0.75rem);
62
64
  --grid-record-border-bottom: var(--grid-container-border-color);
63
65
 
64
66
  --grid-record-dirty-border-top: 24px solid rgba(var(--md-sys-color-primary-rgb), 0.6);
@@ -68,7 +70,7 @@ body {
68
70
  --grid-record-dirty-color: var(--md-sys-color-surface);
69
71
 
70
72
  --grid-footer-background-color: var(--md-sys-color-surface-container-low);
71
- --grid-footer-font-size: var(--md-sys-typescale-label-medium-size);
73
+ --grid-footer-font-size: var(--md-sys-typescale-label-medium-size, 0.75rem);
72
74
  --grid-footer-color: var(--md-sys-color-primary);
73
75
  --grid-footer-limit-color: var(--md-ref-palette-neutral40);
74
76
  --grid-footer-inactive-color: var(--md-ref-palette-neutral40);
@@ -78,12 +80,12 @@ body {
78
80
  --data-list-item-margin: var(--spacing-medium);
79
81
  --data-list-item-padding: var(--spacing-medium) var(--spacing-large);
80
82
  --data-list-item-border-bottom: var(--grid-container-border-color);
81
- --data-list-item-name-font: bold 1.1em var(--theme-font,'Noto');
83
+ --data-list-item-name-font: bold 1.1em var(--theme-font, 'Roboto');
82
84
  --data-list-item-name-color: var(--md-sys-color-secondary);
83
- --data-list-item-disc-font: normal 0.9em var(--theme-font,'Noto');
85
+ --data-list-item-disc-font: normal 0.9em var(--theme-font, 'Roboto');
84
86
  --data-list-item-disc-color: var(--md-sys-color-tertiary);
85
- --data-list-item-etc-label-font: bold 1em/1em var(--theme-font,'Noto');
86
- --data-list-item-etc-font: normal 0.9em/1em var(--theme-font,'Noto');
87
+ --data-list-item-etc-label-font: bold 1em/1em var(--theme-font, 'Roboto');
88
+ --data-list-item-etc-font: normal 0.9em/1em var(--theme-font, 'Roboto');
87
89
  --data-list-item-etc-color: var(--md-ref-palette-neutral50);
88
90
  --data-list-item-icon-font: normal 1em/1em;
89
91
  --data-list-item-icon-color: var(--md-sys-color-on-secondary);
@@ -103,14 +105,14 @@ body {
103
105
  --data-card-item-margin: var(--spacing-medium);
104
106
  --data-card-item-padding: var(--spacing-medium) var(--spacing-large);
105
107
  --data-card-item-border-bottom: var(--grid-container-border-color);
106
- --data-card-item-name-font: bold 1.1em var(--theme-font,'Noto');
108
+ --data-card-item-name-font: bold 1.1em var(--theme-font, 'Roboto');
107
109
  --data-card-item-name-color: var(--md-sys-color-secondary);
108
- --data-card-item-name-label-font: normal 0.65em/0.8em var(--theme-font,'Noto');
110
+ --data-card-item-name-label-font: normal 0.65em/0.8em var(--theme-font, 'Roboto');
109
111
  --data-card-item-name-label-color: rgba(var(--secondary-color-rgb), 0.8);
110
- --data-card-item-disc-font: normal 0.9em var(--theme-font,'Noto');
112
+ --data-card-item-disc-font: normal 0.9em var(--theme-font, 'Roboto');
111
113
  --data-card-item-disc-color: var(--md-sys-color-tertiary);
112
- --data-card-item-etc-label-font: normal 1em/1em var(--theme-font,'Noto');
113
- --data-card-item-etc-font: normal 0.9em/1em var(--theme-font,'Noto');
114
+ --data-card-item-etc-label-font: normal 1em/1em var(--theme-font, 'Roboto');
115
+ --data-card-item-etc-font: normal 0.9em/1em var(--theme-font, 'Roboto');
114
116
  --data-card-item-etc-color: var(--md-ref-palette-neutral50);
115
117
  --data-card-item-icon-font: normal 1em/1em;
116
118
  --data-card-item-icon-color: var(--md-sys-color-on-secondary);
@@ -129,10 +131,11 @@ body {
129
131
  --record-view-background-color: var(--md-sys-color-surface-container);
130
132
  --record-view-gap: var(--spacing-small) 0;
131
133
  --record-view-padding: var(--spacing-medium);
132
- --record-view-label-font: var(--md-sys-typescale-label-large-weight) 15px var(--theme-font,'Noto');
134
+ --record-view-label-font: var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500)) 15px
135
+ var(--theme-font, 'Roboto');
133
136
  --record-view-label-color: var(--md-sys-color-secondary);
134
137
  --record-view-label-icon-size: var(--fontsize-small);
135
- --record-view-font: normal 15px var(--theme-font,'Noto');
138
+ --record-view-font: normal 15px var(--theme-font, 'Roboto');
136
139
  --record-view-color: var(--md-sys-color-secondary);
137
140
  --record-view-focus-color: var(--md-sys-color-primary);
138
141
  --record-view-border-bottom: var(--grid-container-border-color);
@@ -152,8 +155,9 @@ body {
152
155
 
153
156
  @media only screen and (max-width: 460px) {
154
157
  body {
155
- --record-view-label-font: var(--md-sys-typescale-label-large-weight) 15px/32px var(--theme-font,'Noto');
156
- --record-view-font: normal 15px/32px var(--theme-font,'Noto');
158
+ --record-view-label-font: var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500)) 15px/32px
159
+ var(--theme-font, 'Roboto');
160
+ --record-view-font: normal 15px/32px var(--theme-font, 'Roboto');
157
161
  --ox-grist-padding: 0;
158
162
  }
159
163
  }
package/themes/md-typescale-styles.css CHANGED
@@ -3,87 +3,87 @@
3
3
  .md-typescale-display-small-prominent {
4
4
  font: var(--md-sys-typescale-display-small-weight, var(--md-ref-typeface-weight-regular, 400))
5
5
  var(--md-sys-typescale-display-small-size, 2.25rem) / var(--md-sys-typescale-display-small-line-height, 2.75rem)
6
- var(--md-sys-typescale-display-small-font, var(--md-ref-typeface-brand, 'Noto'));
6
+ var(--md-sys-typescale-display-small-font, var(--md-ref-typeface-brand, 'Roboto'));
7
7
  }
8
8
  .md-typescale-display-medium,
9
9
  .md-typescale-display-medium-prominent {
10
10
  font: var(--md-sys-typescale-display-medium-weight, var(--md-ref-typeface-weight-regular, 400))
11
11
  var(--md-sys-typescale-display-medium-size, 2.8125rem) /
12
12
  var(--md-sys-typescale-display-medium-line-height, 3.25rem)
13
- var(--md-sys-typescale-display-medium-font, var(--md-ref-typeface-brand, 'Noto'));
13
+ var(--md-sys-typescale-display-medium-font, var(--md-ref-typeface-brand, 'Roboto'));
14
14
  }
15
15
  .md-typescale-display-large,
16
16
  .md-typescale-display-large-prominent {
17
17
  font: var(--md-sys-typescale-display-large-weight, var(--md-ref-typeface-weight-regular, 400))
18
18
  var(--md-sys-typescale-display-large-size, 3.5625rem) / var(--md-sys-typescale-display-large-line-height, 4rem)
19
- var(--md-sys-typescale-display-large-font, var(--md-ref-typeface-brand, 'Noto'));
19
+ var(--md-sys-typescale-display-large-font, var(--md-ref-typeface-brand, 'Roboto'));
20
20
  }
21
21
  .md-typescale-headline-small,
22
22
  .md-typescale-headline-small-prominent {
23
23
  font: var(--md-sys-typescale-headline-small-weight, var(--md-ref-typeface-weight-regular, 400))
24
24
  var(--md-sys-typescale-headline-small-size, 1.5rem) / var(--md-sys-typescale-headline-small-line-height, 2rem)
25
- var(--md-sys-typescale-headline-small-font, var(--md-ref-typeface-brand, 'Noto'));
25
+ var(--md-sys-typescale-headline-small-font, var(--md-ref-typeface-brand, 'Roboto'));
26
26
  }
27
27
  .md-typescale-headline-medium,
28
28
  .md-typescale-headline-medium-prominent {
29
29
  font: var(--md-sys-typescale-headline-medium-weight, var(--md-ref-typeface-weight-regular, 400))
30
30
  var(--md-sys-typescale-headline-medium-size, 1.75rem) /
31
31
  var(--md-sys-typescale-headline-medium-line-height, 2.25rem)
32
- var(--md-sys-typescale-headline-medium-font, var(--md-ref-typeface-brand, 'Noto'));
32
+ var(--md-sys-typescale-headline-medium-font, var(--md-ref-typeface-brand, 'Roboto'));
33
33
  }
34
34
  .md-typescale-headline-large,
35
35
  .md-typescale-headline-large-prominent {
36
36
  font: var(--md-sys-typescale-headline-large-weight, var(--md-ref-typeface-weight-regular, 400))
37
37
  var(--md-sys-typescale-headline-large-size, 2rem) / var(--md-sys-typescale-headline-large-line-height, 2.5rem)
38
- var(--md-sys-typescale-headline-large-font, var(--md-ref-typeface-brand, 'Noto'));
38
+ var(--md-sys-typescale-headline-large-font, var(--md-ref-typeface-brand, 'Roboto'));
39
39
  }
40
40
  .md-typescale-title-small,
41
41
  .md-typescale-title-small-prominent {
42
42
  font: var(--md-sys-typescale-title-small-weight, var(--md-ref-typeface-weight-medium, 500))
43
43
  var(--md-sys-typescale-title-small-size, 0.875rem) / var(--md-sys-typescale-title-small-line-height, 1.25rem)
44
- var(--md-sys-typescale-title-small-font, var(--md-ref-typeface-plain, 'Noto'));
44
+ var(--md-sys-typescale-title-small-font, var(--md-ref-typeface-plain, 'Roboto'));
45
45
  }
46
46
  .md-typescale-title-medium,
47
47
  .md-typescale-title-medium-prominent {
48
48
  font: var(--md-sys-typescale-title-medium-weight, var(--md-ref-typeface-weight-medium, 500))
49
49
  var(--md-sys-typescale-title-medium-size, 1rem) / var(--md-sys-typescale-title-medium-line-height, 1.5rem)
50
- var(--md-sys-typescale-title-medium-font, var(--md-ref-typeface-plain, 'Noto'));
50
+ var(--md-sys-typescale-title-medium-font, var(--md-ref-typeface-plain, 'Roboto'));
51
51
  }
52
52
  .md-typescale-title-large,
53
53
  .md-typescale-title-large-prominent {
54
54
  font: var(--md-sys-typescale-title-large-weight, var(--md-ref-typeface-weight-regular, 400))
55
55
  var(--md-sys-typescale-title-large-size, 1.375rem) / var(--md-sys-typescale-title-large-line-height, 1.75rem)
56
- var(--md-sys-typescale-title-large-font, var(--md-ref-typeface-brand, 'Noto'));
56
+ var(--md-sys-typescale-title-large-font, var(--md-ref-typeface-brand, 'Roboto'));
57
57
  }
58
58
  .md-typescale-body-small,
59
59
  .md-typescale-body-small-prominent {
60
60
  font: var(--md-sys-typescale-body-small-weight, var(--md-ref-typeface-weight-regular, 400))
61
61
  var(--md-sys-typescale-body-small-size, 0.75rem) / var(--md-sys-typescale-body-small-line-height, 1rem)
62
- var(--md-sys-typescale-body-small-font, var(--md-ref-typeface-plain, 'Noto'));
62
+ var(--md-sys-typescale-body-small-font, var(--md-ref-typeface-plain, 'Roboto'));
63
63
  }
64
64
  .md-typescale-body-medium,
65
65
  .md-typescale-body-medium-prominent {
66
66
  font: var(--md-sys-typescale-body-medium-weight, var(--md-ref-typeface-weight-regular, 400))
67
67
  var(--md-sys-typescale-body-medium-size, 0.875rem) / var(--md-sys-typescale-body-medium-line-height, 1.25rem)
68
- var(--md-sys-typescale-body-medium-font, var(--md-ref-typeface-plain, 'Noto'));
68
+ var(--md-sys-typescale-body-medium-font, var(--md-ref-typeface-plain, 'Roboto'));
69
69
  }
70
70
  .md-typescale-body-large,
71
71
  .md-typescale-body-large-prominent {
72
72
  font: var(--md-sys-typescale-body-large-weight, var(--md-ref-typeface-weight-regular, 400))
73
73
  var(--md-sys-typescale-body-large-size, 1rem) / var(--md-sys-typescale-body-large-line-height, 1.5rem)
74
- var(--md-sys-typescale-body-large-font, var(--md-ref-typeface-plain, 'Noto'));
74
+ var(--md-sys-typescale-body-large-font, var(--md-ref-typeface-plain, 'Roboto'));
75
75
  }
76
76
  .md-typescale-label-small,
77
77
  .md-typescale-label-small-prominent {
78
78
  font: var(--md-sys-typescale-label-small-weight, var(--md-ref-typeface-weight-medium, 500))
79
79
  var(--md-sys-typescale-label-small-size, 0.6875rem) / var(--md-sys-typescale-label-small-line-height, 1rem)
80
- var(--md-sys-typescale-label-small-font, var(--md-ref-typeface-plain, 'Noto'));
80
+ var(--md-sys-typescale-label-small-font, var(--md-ref-typeface-plain, 'Roboto'));
81
81
  }
82
82
  .md-typescale-label-medium,
83
83
  .md-typescale-label-medium-prominent {
84
84
  font: var(--md-sys-typescale-label-medium-weight, var(--md-ref-typeface-weight-medium, 500))
85
85
  var(--md-sys-typescale-label-medium-size, 0.75rem) / var(--md-sys-typescale-label-medium-line-height, 1rem)
86
- var(--md-sys-typescale-label-medium-font, var(--md-ref-typeface-plain, 'Noto'));
86
+ var(--md-sys-typescale-label-medium-font, var(--md-ref-typeface-plain, 'Roboto'));
87
87
  }
88
88
  .md-typescale-label-medium-prominent {
89
89
  font-weight: var(--md-sys-typescale-label-medium-weight-prominent, var(--md-ref-typeface-weight-bold, 700));
@@ -92,7 +92,7 @@
92
92
  .md-typescale-label-large-prominent {
93
93
  font: var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500))
94
94
  var(--md-sys-typescale-label-large-size, 0.875rem) / var(--md-sys-typescale-label-large-line-height, 1.25rem)
95
- var(--md-sys-typescale-label-large-font, var(--md-ref-typeface-plain, 'Noto'));
95
+ var(--md-sys-typescale-label-large-font, var(--md-ref-typeface-plain, 'Roboto'));
96
96
  }
97
97
  .md-typescale-label-large-prominent {
98
98
  font-weight: var(--md-sys-typescale-label-large-weight-prominent, var(--md-ref-typeface-weight-bold, 700));
package/themes/spacing.css CHANGED
@@ -13,31 +13,31 @@
13
13
  --icon-size-huge: 48px;
14
14
 
15
15
  /* form element height */
16
- --form-element-height-tiny:18px;
17
- --form-element-height-small:24px;
18
- --form-element-height-medium:30px;
19
- --form-element-height-large:40px;
20
- --form-element-height-huge:55px;
16
+ --form-element-height-tiny: 18px;
17
+ --form-element-height-small: 24px;
18
+ --form-element-height-medium: 30px;
19
+ --form-element-height-large: 40px;
20
+ --form-element-height-huge: 55px;
21
21
 
22
22
  /* shape corner */
23
- --md-sys-shape-corner-none:0px;
24
- --md-sys-shape-corner-small:5px;
25
- --md-sys-shape-corner-medium:10px;
26
- --md-sys-shape-corner-large:30px;
27
- --md-sys-shape-corner-full:999px;
23
+ --md-sys-shape-corner-none: 0px;
24
+ --md-sys-shape-corner-small: 5px;
25
+ --md-sys-shape-corner-medium: 10px;
26
+ --md-sys-shape-corner-large: 30px;
27
+ --md-sys-shape-corner-full: 999px;
28
28
 
29
29
  /* typescale corner */
30
- --md-sys-typescale-label-tiny-size:11px;
31
- --md-sys-typescale-label-small-size:13px;
32
- --md-sys-typescale-label-medium-size:14px;
33
- --md-sys-typescale-label-large-size:18px;
34
- --md-sys-typescale-label-huge-size:24px;
35
-
36
- --md-sys-typescale-label-medium-line-height:1;
30
+ --md-sys-typescale-label-tiny-size: 11px;
31
+ --md-sys-typescale-label-small-size: 13px;
32
+ --md-sys-typescale-label-medium-size: 14px;
33
+ --md-sys-typescale-label-large-size: 18px;
34
+ --md-sys-typescale-label-huge-size: 24px;
37
35
 
38
- --md-sys-typescale-label-tiny-weight:200;
39
- --md-sys-typescale-label-small-weight:300;
40
- --md-sys-typescale-label-medium-weight:500;
41
- --md-sys-typescale-label-large-weight:700;
42
- --md-sys-typescale-label-full-weight:900;
36
+ --md-sys-typescale-label-medium-line-height: 1;
37
+
38
+ --md-sys-typescale-label-tiny-weight: 200;
39
+ --md-sys-typescale-label-small-weight: 300;
40
+ --md-sys-typescale-label-medium-weight: 500;
41
+ --md-sys-typescale-label-large-weight: 700;
42
+ --md-sys-typescale-label-full-weight: 900;
43
43
  }