@snack-uikit/counter 0.6.2 → 0.6.3-preview-8898cdde.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.
@@ -1,5 +1,6 @@
1
1
  .counter{
2
2
  display:inline-flex;
3
+ flex-shrink:0;
3
4
  align-items:center;
4
5
  justify-content:center;
5
6
  box-sizing:border-box;
@@ -10,39 +11,39 @@
10
11
  .counter[data-color=accent][data-appearance=primary]{
11
12
  color:var(--sys-primary-on-accent, #fdfbff);
12
13
  background-color:var(--sys-primary-accent-default, #794ed3);
13
- border-color:var(--sys-neutral-background1-level, #fdfdff);
14
+ border-color:var(--sys-neutral-background1-level, #fdfdfd);
14
15
  }
15
16
  .counter[data-color=accent][data-appearance=neutral]{
16
17
  color:var(--sys-neutral-on-accent, #ffffff);
17
- background-color:var(--sys-neutral-accent-default, #6f717c);
18
- border-color:var(--sys-neutral-background1-level, #fdfdff);
18
+ background-color:var(--sys-neutral-accent-default, #787b8a);
19
+ border-color:var(--sys-neutral-background1-level, #fdfdfd);
19
20
  }
20
21
  .counter[data-color=accent][data-appearance=red]{
21
22
  color:var(--sys-red-on-accent, #fffbf9);
22
- background-color:var(--sys-red-accent-default, #cd3c3c);
23
- border-color:var(--sys-neutral-background1-level, #fdfdff);
23
+ background-color:var(--sys-red-accent-default, #cb3f3e);
24
+ border-color:var(--sys-neutral-background1-level, #fdfdfd);
24
25
  }
25
26
  .counter[data-color=decor][data-appearance=primary]{
26
27
  color:var(--sys-primary-text-main, #382a62);
27
28
  background-color:var(--sys-primary-decor-default, #ebdefd);
28
- border-color:var(--sys-neutral-background1-level, #fdfdff);
29
+ border-color:var(--sys-neutral-background1-level, #fdfdfd);
29
30
  }
30
31
  .counter[data-color=decor][data-appearance=neutral]{
31
- color:var(--sys-neutral-text-main, #33333b);
32
- background-color:var(--sys-neutral-decor-default, #dfe2ec);
33
- border-color:var(--sys-neutral-background1-level, #fdfdff);
32
+ color:var(--sys-neutral-text-main, #41424e);
33
+ background-color:var(--sys-neutral-decor-default, #dde0ea);
34
+ border-color:var(--sys-neutral-background1-level, #fdfdfd);
34
35
  }
35
36
  .counter[data-color=decor][data-appearance=red]{
36
- color:var(--sys-red-text-main, #621c1b);
37
+ color:var(--sys-red-text-main, #7a2d2d);
37
38
  background-color:var(--sys-red-decor-default, #fdd6cd);
38
- border-color:var(--sys-neutral-background1-level, #fdfdff);
39
+ border-color:var(--sys-neutral-background1-level, #fdfdfd);
39
40
  }
40
41
  .counter[data-size=s]{
41
42
  font-family:var(--sans-label-s-font-family, SB Sans Interface);
42
43
  font-weight:var(--sans-label-s-font-weight, Semibold);
43
44
  line-height:var(--sans-label-s-line-height, 14px);
44
45
  font-size:var(--sans-label-s-font-size, 11px);
45
- letter-spacing:var(--sans-label-s-letter-spacing, -0.1px);
46
+ letter-spacing:var(--sans-label-s-letter-spacing, 0px);
46
47
  paragraph-spacing:var(--sans-label-s-paragraph-spacing, 6.05px);
47
48
  border-radius:var(--radius-counter-s, 8px);
48
49
  height:var(--size-counter-s-height, 16px);
@@ -56,7 +57,7 @@
56
57
  font-weight:var(--sans-label-l-font-weight, Semibold);
57
58
  line-height:var(--sans-label-l-line-height, 20px);
58
59
  font-size:var(--sans-label-l-font-size, 14px);
59
- letter-spacing:var(--sans-label-l-letter-spacing, -0.1px);
60
+ letter-spacing:var(--sans-label-l-letter-spacing, 0px);
60
61
  paragraph-spacing:var(--sans-label-l-paragraph-spacing, 7.7px);
61
62
  }
62
63
  .counter[data-size=s] .key{
@@ -64,7 +65,7 @@
64
65
  font-weight:var(--sans-label-s-font-weight, Semibold);
65
66
  line-height:var(--sans-label-s-line-height, 14px);
66
67
  font-size:var(--sans-label-s-font-size, 11px);
67
- letter-spacing:var(--sans-label-s-letter-spacing, -0.1px);
68
+ letter-spacing:var(--sans-label-s-letter-spacing, 0px);
68
69
  paragraph-spacing:var(--sans-label-s-paragraph-spacing, 6.05px);
69
70
  }
70
71
  .counter[data-size=m]{
@@ -72,7 +73,7 @@
72
73
  font-weight:var(--sans-label-l-font-weight, Semibold);
73
74
  line-height:var(--sans-label-l-line-height, 20px);
74
75
  font-size:var(--sans-label-l-font-size, 14px);
75
- letter-spacing:var(--sans-label-l-letter-spacing, -0.1px);
76
+ letter-spacing:var(--sans-label-l-letter-spacing, 0px);
76
77
  paragraph-spacing:var(--sans-label-l-paragraph-spacing, 7.7px);
77
78
  border-radius:var(--radius-counter-m, 16px);
78
79
  height:var(--size-counter-m-height, 24px);
@@ -86,7 +87,7 @@
86
87
  font-weight:var(--sans-label-l-font-weight, Semibold);
87
88
  line-height:var(--sans-label-l-line-height, 20px);
88
89
  font-size:var(--sans-label-l-font-size, 14px);
89
- letter-spacing:var(--sans-label-l-letter-spacing, -0.1px);
90
+ letter-spacing:var(--sans-label-l-letter-spacing, 0px);
90
91
  paragraph-spacing:var(--sans-label-l-paragraph-spacing, 7.7px);
91
92
  }
92
93
  .counter[data-size=m] .key{
@@ -94,6 +95,6 @@
94
95
  font-weight:var(--sans-label-l-font-weight, Semibold);
95
96
  line-height:var(--sans-label-l-line-height, 20px);
96
97
  font-size:var(--sans-label-l-font-size, 14px);
97
- letter-spacing:var(--sans-label-l-letter-spacing, -0.1px);
98
+ letter-spacing:var(--sans-label-l-letter-spacing, 0px);
98
99
  paragraph-spacing:var(--sans-label-l-paragraph-spacing, 7.7px);
99
100
  }
package/package.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "access": "public"
5
5
  },
6
6
  "title": "Counter",
7
- "version": "0.6.2",
7
+ "version": "0.6.3-preview-8898cdde.0",
8
8
  "sideEffects": [
9
9
  "*.css",
10
10
  "*.woff",
@@ -35,5 +35,5 @@
35
35
  "@snack-uikit/utils": "3.3.0",
36
36
  "classnames": "2.3.2"
37
37
  },
38
- "gitHead": "bf1e1f3cfabccc1ee288c18722e33009bd001798"
38
+ "gitHead": "a0351f376ac28462b847d1bf99ad3f7ba7a1d0cd"
39
39
  }
@@ -7,27 +7,28 @@ $colors: 'accent', 'decor';
7
7
 
8
8
  $value-typography: (
9
9
  s: $sans-label-s,
10
- m: $sans-label-l
10
+ m: $sans-label-l,
11
11
  );
12
12
  $plus-typography: (
13
13
  s: $sans-label-l,
14
- m: $sans-label-l
14
+ m: $sans-label-l,
15
15
  );
16
16
  $key-typography: (
17
17
  s: $sans-label-s,
18
- m: $sans-label-l
18
+ m: $sans-label-l,
19
19
  );
20
20
  $text-color: (
21
21
  accent: 'on-accent',
22
- decor: 'text-main'
22
+ decor: 'text-main',
23
23
  );
24
24
  $bg-color: (
25
25
  accent: 'accent-default',
26
- decor: 'decor-default'
26
+ decor: 'decor-default',
27
27
  );
28
28
 
29
29
  .counter {
30
30
  display: inline-flex;
31
+ flex-shrink: 0;
31
32
  align-items: center;
32
33
  justify-content: center;
33
34