@alfalab/core-components-tab-bar 4.0.3 → 4.0.4

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 (25) hide show
  1. package/components/tab/index.css +13 -10
  2. package/components/tab/index.module.css.js +1 -1
  3. package/components/tab/index.module.css.js.map +1 -1
  4. package/cssm/components/tab/index.module.css +6 -3
  5. package/cssm/index.module.css +0 -2
  6. package/esm/components/tab/index.css +13 -10
  7. package/esm/components/tab/index.module.css.js +1 -1
  8. package/esm/components/tab/index.module.css.js.map +1 -1
  9. package/esm/index.css +5 -7
  10. package/esm/index.module.css.js +1 -1
  11. package/esm/index.module.css.js.map +1 -1
  12. package/index.css +5 -7
  13. package/index.module.css.js +1 -1
  14. package/index.module.css.js.map +1 -1
  15. package/modern/components/tab/index.css +13 -10
  16. package/modern/components/tab/index.module.css.js +1 -1
  17. package/modern/components/tab/index.module.css.js.map +1 -1
  18. package/modern/index.css +5 -7
  19. package/modern/index.module.css.js +1 -1
  20. package/modern/index.module.css.js.map +1 -1
  21. package/moderncssm/components/tab/index.module.css +2 -1
  22. package/moderncssm/index.module.css +0 -2
  23. package/package.json +1 -1
  24. package/src/components/tab/index.module.css +2 -1
  25. package/src/index.module.css +0 -2
package/components/tab/index.css CHANGED
@@ -8,13 +8,15 @@
8
8
  --border-radius-0: 0;
9
9
  }
10
10
  :root {
11
+ --gap-3xs: 2px;
11
12
  --gap-2xs: 4px;
12
- --gap-xs: 8px;
13
13
  --gap-0: 0px;
14
+ --gap-2: var(--gap-3xs);
14
15
  --gap-4: var(--gap-2xs);
15
- --gap-8: var(--gap-xs);
16
+ --gap-6: 6px;
17
+ --gap-10: 10px;
16
18
  }
17
- .tab-bar__component_1gp7j {
19
+ .tab-bar__component_1vhmw {
18
20
  -webkit-tap-highlight-color: transparent;
19
21
  box-sizing: border-box;
20
22
  background-color: transparent;
@@ -39,23 +41,24 @@
39
41
  flex-direction: column;
40
42
  flex: 1 0 0;
41
43
  align-items: center;
42
- padding: var(--gap-8) var(--gap-0);
44
+ padding: var(--gap-10) var(--gap-0) var(--gap-6);
43
45
  color: var(--color-light-neutral-translucent-700);
44
46
  }
45
- .tab-bar__primary_1gp7j {
47
+ .tab-bar__primary_1vhmw {
46
48
  color: var(--color-light-accent-primary);
47
49
  }
48
- .tab-bar__secondary_1gp7j {
50
+ .tab-bar__secondary_1vhmw {
49
51
  color: var(--color-light-accent-secondary);
50
52
  }
51
- .tab-bar__icon_1gp7j {
53
+ .tab-bar__icon_1vhmw {
52
54
  display: flex;
53
55
  align-items: center;
54
56
  justify-content: center;
55
57
  flex-grow: 1;
56
58
  width: 100%;
59
+ margin-bottom: var(--gap-2);
57
60
  }
58
- .tab-bar__label_1gp7j {
61
+ .tab-bar__label_1vhmw {
59
62
  -webkit-line-clamp: 1;
60
63
  display: -webkit-box;
61
64
  -webkit-box-orient: vertical;
@@ -65,10 +68,10 @@
65
68
 
66
69
  color: var(--color-light-text-secondary);
67
70
  }
68
- .tab-bar__labelSelected_1gp7j {
71
+ .tab-bar__labelSelected_1vhmw {
69
72
  color: inherit;
70
73
  }
71
- .tab-bar__indicator_1gp7j {
74
+ .tab-bar__indicator_1vhmw {
72
75
  position: absolute;
73
76
  top: 3px;
74
77
  left: calc(50% + var(--gap-4));
package/components/tab/index.module.css.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  require('./index.css');
4
4
 
5
- var styles = {"component":"tab-bar__component_1gp7j","primary":"tab-bar__primary_1gp7j","secondary":"tab-bar__secondary_1gp7j","icon":"tab-bar__icon_1gp7j","label":"tab-bar__label_1gp7j","labelSelected":"tab-bar__labelSelected_1gp7j","indicator":"tab-bar__indicator_1gp7j"};
5
+ var styles = {"component":"tab-bar__component_1vhmw","primary":"tab-bar__primary_1vhmw","secondary":"tab-bar__secondary_1vhmw","icon":"tab-bar__icon_1vhmw","label":"tab-bar__label_1vhmw","labelSelected":"tab-bar__labelSelected_1vhmw","indicator":"tab-bar__indicator_1vhmw"};
6
6
 
7
7
  module.exports = styles;
8
8
  //# sourceMappingURL=index.module.css.js.map
package/components/tab/index.module.css.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.module.css.js","sources":["../../src/components/tab/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n\n.component {\n @mixin button-reset;\n\n position: relative;\n display: inline-flex;\n flex-direction: column;\n flex: 1 0 0;\n align-items: center;\n padding: var(--gap-8) var(--gap-0);\n color: var(--color-light-neutral-translucent-700);\n}\n\n.primary {\n color: var(--color-light-accent-primary);\n}\n\n.secondary {\n color: var(--color-light-accent-secondary);\n}\n\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-grow: 1;\n width: 100%;\n}\n\n.label {\n @mixin row_limit 1;\n word-break: break-all;\n flex-shrink: 0;\n\n color: var(--color-light-text-secondary);\n}\n\n.labelSelected {\n color: inherit;\n}\n\n.indicator {\n position: absolute;\n top: 3px;\n left: calc(50% + var(--gap-4));\n height: 16px;\n min-width: 16px;\n}\n"],"names":[],"mappings":";;;;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,SAAS,CAAC,wBAAwB,CAAC,WAAW,CAAC,0BAA0B,CAAC,MAAM,CAAC,qBAAqB,CAAC,OAAO,CAAC,sBAAsB,CAAC,eAAe,CAAC,8BAA8B,CAAC,WAAW,CAAC,0BAA0B,CAAC;;;;"}
1
+ {"version":3,"file":"index.module.css.js","sources":["../../src/components/tab/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n\n.component {\n @mixin button-reset;\n\n position: relative;\n display: inline-flex;\n flex-direction: column;\n flex: 1 0 0;\n align-items: center;\n padding: var(--gap-10) var(--gap-0) var(--gap-6);\n color: var(--color-light-neutral-translucent-700);\n}\n\n.primary {\n color: var(--color-light-accent-primary);\n}\n\n.secondary {\n color: var(--color-light-accent-secondary);\n}\n\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-grow: 1;\n width: 100%;\n margin-bottom: var(--gap-2);\n}\n\n.label {\n @mixin row_limit 1;\n word-break: break-all;\n flex-shrink: 0;\n\n color: var(--color-light-text-secondary);\n}\n\n.labelSelected {\n color: inherit;\n}\n\n.indicator {\n position: absolute;\n top: 3px;\n left: calc(50% + var(--gap-4));\n height: 16px;\n min-width: 16px;\n}\n"],"names":[],"mappings":";;;;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,SAAS,CAAC,wBAAwB,CAAC,WAAW,CAAC,0BAA0B,CAAC,MAAM,CAAC,qBAAqB,CAAC,OAAO,CAAC,sBAAsB,CAAC,eAAe,CAAC,8BAA8B,CAAC,WAAW,CAAC,0BAA0B,CAAC;;;;"}
package/cssm/components/tab/index.module.css CHANGED
@@ -8,11 +8,13 @@
8
8
  --border-radius-0: 0;
9
9
  }
10
10
  :root {
11
+ --gap-3xs: 2px;
11
12
  --gap-2xs: 4px;
12
- --gap-xs: 8px;
13
13
  --gap-0: 0px;
14
+ --gap-2: var(--gap-3xs);
14
15
  --gap-4: var(--gap-2xs);
15
- --gap-8: var(--gap-xs);
16
+ --gap-6: 6px;
17
+ --gap-10: 10px;
16
18
  }
17
19
  .component {
18
20
  -webkit-tap-highlight-color: transparent;
@@ -39,7 +41,7 @@
39
41
  flex-direction: column;
40
42
  flex: 1 0 0;
41
43
  align-items: center;
42
- padding: var(--gap-8) var(--gap-0);
44
+ padding: var(--gap-10) var(--gap-0) var(--gap-6);
43
45
  color: var(--color-light-neutral-translucent-700);
44
46
  }
45
47
  .primary {
@@ -54,6 +56,7 @@
54
56
  justify-content: center;
55
57
  flex-grow: 1;
56
58
  width: 100%;
59
+ margin-bottom: var(--gap-2);
57
60
  }
58
61
  .label {
59
62
  -webkit-line-clamp: 1;
package/cssm/index.module.css CHANGED
@@ -12,8 +12,6 @@
12
12
  .component {
13
13
  display: flex;
14
14
  justify-content: center;
15
- height: 64px;
16
- max-height: 64px;
17
15
  box-sizing: border-box;
18
16
  overflow: hidden;
19
17
  transition: box-shadow 0.2s ease;
package/esm/components/tab/index.css CHANGED
@@ -8,13 +8,15 @@
8
8
  --border-radius-0: 0;
9
9
  }
10
10
  :root {
11
+ --gap-3xs: 2px;
11
12
  --gap-2xs: 4px;
12
- --gap-xs: 8px;
13
13
  --gap-0: 0px;
14
+ --gap-2: var(--gap-3xs);
14
15
  --gap-4: var(--gap-2xs);
15
- --gap-8: var(--gap-xs);
16
+ --gap-6: 6px;
17
+ --gap-10: 10px;
16
18
  }
17
- .tab-bar__component_1gp7j {
19
+ .tab-bar__component_1vhmw {
18
20
  -webkit-tap-highlight-color: transparent;
19
21
  box-sizing: border-box;
20
22
  background-color: transparent;
@@ -39,23 +41,24 @@
39
41
  flex-direction: column;
40
42
  flex: 1 0 0;
41
43
  align-items: center;
42
- padding: var(--gap-8) var(--gap-0);
44
+ padding: var(--gap-10) var(--gap-0) var(--gap-6);
43
45
  color: var(--color-light-neutral-translucent-700);
44
46
  }
45
- .tab-bar__primary_1gp7j {
47
+ .tab-bar__primary_1vhmw {
46
48
  color: var(--color-light-accent-primary);
47
49
  }
48
- .tab-bar__secondary_1gp7j {
50
+ .tab-bar__secondary_1vhmw {
49
51
  color: var(--color-light-accent-secondary);
50
52
  }
51
- .tab-bar__icon_1gp7j {
53
+ .tab-bar__icon_1vhmw {
52
54
  display: flex;
53
55
  align-items: center;
54
56
  justify-content: center;
55
57
  flex-grow: 1;
56
58
  width: 100%;
59
+ margin-bottom: var(--gap-2);
57
60
  }
58
- .tab-bar__label_1gp7j {
61
+ .tab-bar__label_1vhmw {
59
62
  -webkit-line-clamp: 1;
60
63
  display: -webkit-box;
61
64
  -webkit-box-orient: vertical;
@@ -65,10 +68,10 @@
65
68
 
66
69
  color: var(--color-light-text-secondary);
67
70
  }
68
- .tab-bar__labelSelected_1gp7j {
71
+ .tab-bar__labelSelected_1vhmw {
69
72
  color: inherit;
70
73
  }
71
- .tab-bar__indicator_1gp7j {
74
+ .tab-bar__indicator_1vhmw {
72
75
  position: absolute;
73
76
  top: 3px;
74
77
  left: calc(50% + var(--gap-4));
package/esm/components/tab/index.module.css.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- var styles = {"component":"tab-bar__component_1gp7j","primary":"tab-bar__primary_1gp7j","secondary":"tab-bar__secondary_1gp7j","icon":"tab-bar__icon_1gp7j","label":"tab-bar__label_1gp7j","labelSelected":"tab-bar__labelSelected_1gp7j","indicator":"tab-bar__indicator_1gp7j"};
3
+ var styles = {"component":"tab-bar__component_1vhmw","primary":"tab-bar__primary_1vhmw","secondary":"tab-bar__secondary_1vhmw","icon":"tab-bar__icon_1vhmw","label":"tab-bar__label_1vhmw","labelSelected":"tab-bar__labelSelected_1vhmw","indicator":"tab-bar__indicator_1vhmw"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
package/esm/components/tab/index.module.css.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.module.css.js","sources":["../../src/components/tab/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n\n.component {\n @mixin button-reset;\n\n position: relative;\n display: inline-flex;\n flex-direction: column;\n flex: 1 0 0;\n align-items: center;\n padding: var(--gap-8) var(--gap-0);\n color: var(--color-light-neutral-translucent-700);\n}\n\n.primary {\n color: var(--color-light-accent-primary);\n}\n\n.secondary {\n color: var(--color-light-accent-secondary);\n}\n\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-grow: 1;\n width: 100%;\n}\n\n.label {\n @mixin row_limit 1;\n word-break: break-all;\n flex-shrink: 0;\n\n color: var(--color-light-text-secondary);\n}\n\n.labelSelected {\n color: inherit;\n}\n\n.indicator {\n position: absolute;\n top: 3px;\n left: calc(50% + var(--gap-4));\n height: 16px;\n min-width: 16px;\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,SAAS,CAAC,wBAAwB,CAAC,WAAW,CAAC,0BAA0B,CAAC,MAAM,CAAC,qBAAqB,CAAC,OAAO,CAAC,sBAAsB,CAAC,eAAe,CAAC,8BAA8B,CAAC,WAAW,CAAC,0BAA0B,CAAC;;;;"}
1
+ {"version":3,"file":"index.module.css.js","sources":["../../src/components/tab/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n\n.component {\n @mixin button-reset;\n\n position: relative;\n display: inline-flex;\n flex-direction: column;\n flex: 1 0 0;\n align-items: center;\n padding: var(--gap-10) var(--gap-0) var(--gap-6);\n color: var(--color-light-neutral-translucent-700);\n}\n\n.primary {\n color: var(--color-light-accent-primary);\n}\n\n.secondary {\n color: var(--color-light-accent-secondary);\n}\n\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-grow: 1;\n width: 100%;\n margin-bottom: var(--gap-2);\n}\n\n.label {\n @mixin row_limit 1;\n word-break: break-all;\n flex-shrink: 0;\n\n color: var(--color-light-text-secondary);\n}\n\n.labelSelected {\n color: inherit;\n}\n\n.indicator {\n position: absolute;\n top: 3px;\n left: calc(50% + var(--gap-4));\n height: 16px;\n min-width: 16px;\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,SAAS,CAAC,wBAAwB,CAAC,WAAW,CAAC,0BAA0B,CAAC,MAAM,CAAC,qBAAqB,CAAC,OAAO,CAAC,sBAAsB,CAAC,eAAe,CAAC,8BAA8B,CAAC,WAAW,CAAC,0BAA0B,CAAC;;;;"}
package/esm/index.css CHANGED
@@ -9,26 +9,24 @@
9
9
  :root {
10
10
  --sab: env(safe-area-inset-bottom, var(--gap-0));
11
11
  }
12
- .tab-bar__component_1ks6h {
12
+ .tab-bar__component_1rh6p {
13
13
  display: flex;
14
14
  justify-content: center;
15
- height: 64px;
16
- max-height: 64px;
17
15
  box-sizing: border-box;
18
16
  overflow: hidden;
19
17
  transition: box-shadow 0.2s ease;
20
18
  }
21
- .tab-bar__component_1ks6h.tab-bar__modal-bg-primary_1ks6h {
19
+ .tab-bar__component_1rh6p.tab-bar__modal-bg-primary_1rh6p {
22
20
  background-color: var(--color-light-base-bg-primary);
23
21
  }
24
- .tab-bar__component_1ks6h.tab-bar__modal-bg-alt-primary_1ks6h {
22
+ .tab-bar__component_1rh6p.tab-bar__modal-bg-alt-primary_1rh6p {
25
23
  background-color: var(--color-light-base-bg-alt-primary);
26
24
  }
27
25
  @media (display-mode: standalone) {
28
- .tab-bar__component_1ks6h {
26
+ .tab-bar__component_1rh6p {
29
27
  padding-bottom: var(--sab);
30
28
  }
31
29
  }
32
- .tab-bar__border_1ks6h {
30
+ .tab-bar__border_1rh6p {
33
31
  box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);
34
32
  }
package/esm/index.module.css.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- var styles = {"component":"tab-bar__component_1ks6h","modal-bg-primary":"tab-bar__modal-bg-primary_1ks6h","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_1ks6h","border":"tab-bar__border_1ks6h"};
3
+ var styles = {"component":"tab-bar__component_1rh6p","modal-bg-primary":"tab-bar__modal-bg-primary_1rh6p","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_1rh6p","border":"tab-bar__border_1rh6p"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
package/esm/index.module.css.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '@alfalab/core-components-vars/src/safe-area.css';\n\n.component {\n display: flex;\n justify-content: center;\n height: 64px;\n max-height: 64px;\n box-sizing: border-box;\n overflow: hidden;\n transition: box-shadow 0.2s ease;\n\n &.modal-bg-primary {\n background-color: var(--color-light-base-bg-primary);\n }\n\n &.modal-bg-alt-primary {\n background-color: var(--color-light-base-bg-alt-primary);\n }\n\n @media (display-mode: standalone) {\n padding-bottom: var(--sab);\n }\n}\n\n.border {\n box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,kBAAkB,CAAC,iCAAiC,CAAC,sBAAsB,CAAC,qCAAqC,CAAC,QAAQ,CAAC,uBAAuB,CAAC;;;;"}
1
+ {"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '@alfalab/core-components-vars/src/safe-area.css';\n\n.component {\n display: flex;\n justify-content: center;\n box-sizing: border-box;\n overflow: hidden;\n transition: box-shadow 0.2s ease;\n\n &.modal-bg-primary {\n background-color: var(--color-light-base-bg-primary);\n }\n\n &.modal-bg-alt-primary {\n background-color: var(--color-light-base-bg-alt-primary);\n }\n\n @media (display-mode: standalone) {\n padding-bottom: var(--sab);\n }\n}\n\n.border {\n box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,kBAAkB,CAAC,iCAAiC,CAAC,sBAAsB,CAAC,qCAAqC,CAAC,QAAQ,CAAC,uBAAuB,CAAC;;;;"}
package/index.css CHANGED
@@ -9,26 +9,24 @@
9
9
  :root {
10
10
  --sab: env(safe-area-inset-bottom, var(--gap-0));
11
11
  }
12
- .tab-bar__component_1ks6h {
12
+ .tab-bar__component_1rh6p {
13
13
  display: flex;
14
14
  justify-content: center;
15
- height: 64px;
16
- max-height: 64px;
17
15
  box-sizing: border-box;
18
16
  overflow: hidden;
19
17
  transition: box-shadow 0.2s ease;
20
18
  }
21
- .tab-bar__component_1ks6h.tab-bar__modal-bg-primary_1ks6h {
19
+ .tab-bar__component_1rh6p.tab-bar__modal-bg-primary_1rh6p {
22
20
  background-color: var(--color-light-base-bg-primary);
23
21
  }
24
- .tab-bar__component_1ks6h.tab-bar__modal-bg-alt-primary_1ks6h {
22
+ .tab-bar__component_1rh6p.tab-bar__modal-bg-alt-primary_1rh6p {
25
23
  background-color: var(--color-light-base-bg-alt-primary);
26
24
  }
27
25
  @media (display-mode: standalone) {
28
- .tab-bar__component_1ks6h {
26
+ .tab-bar__component_1rh6p {
29
27
  padding-bottom: var(--sab);
30
28
  }
31
29
  }
32
- .tab-bar__border_1ks6h {
30
+ .tab-bar__border_1rh6p {
33
31
  box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);
34
32
  }
package/index.module.css.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  require('./index.css');
4
4
 
5
- var styles = {"component":"tab-bar__component_1ks6h","modal-bg-primary":"tab-bar__modal-bg-primary_1ks6h","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_1ks6h","border":"tab-bar__border_1ks6h"};
5
+ var styles = {"component":"tab-bar__component_1rh6p","modal-bg-primary":"tab-bar__modal-bg-primary_1rh6p","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_1rh6p","border":"tab-bar__border_1rh6p"};
6
6
 
7
7
  module.exports = styles;
8
8
  //# sourceMappingURL=index.module.css.js.map
package/index.module.css.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '@alfalab/core-components-vars/src/safe-area.css';\n\n.component {\n display: flex;\n justify-content: center;\n height: 64px;\n max-height: 64px;\n box-sizing: border-box;\n overflow: hidden;\n transition: box-shadow 0.2s ease;\n\n &.modal-bg-primary {\n background-color: var(--color-light-base-bg-primary);\n }\n\n &.modal-bg-alt-primary {\n background-color: var(--color-light-base-bg-alt-primary);\n }\n\n @media (display-mode: standalone) {\n padding-bottom: var(--sab);\n }\n}\n\n.border {\n box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);\n}\n"],"names":[],"mappings":";;;;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,kBAAkB,CAAC,iCAAiC,CAAC,sBAAsB,CAAC,qCAAqC,CAAC,QAAQ,CAAC,uBAAuB,CAAC;;;;"}
1
+ {"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '@alfalab/core-components-vars/src/safe-area.css';\n\n.component {\n display: flex;\n justify-content: center;\n box-sizing: border-box;\n overflow: hidden;\n transition: box-shadow 0.2s ease;\n\n &.modal-bg-primary {\n background-color: var(--color-light-base-bg-primary);\n }\n\n &.modal-bg-alt-primary {\n background-color: var(--color-light-base-bg-alt-primary);\n }\n\n @media (display-mode: standalone) {\n padding-bottom: var(--sab);\n }\n}\n\n.border {\n box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);\n}\n"],"names":[],"mappings":";;;;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,kBAAkB,CAAC,iCAAiC,CAAC,sBAAsB,CAAC,qCAAqC,CAAC,QAAQ,CAAC,uBAAuB,CAAC;;;;"}
package/modern/components/tab/index.css CHANGED
@@ -8,13 +8,15 @@
8
8
  --border-radius-0: 0;
9
9
  }
10
10
  :root {
11
+ --gap-3xs: 2px;
11
12
  --gap-2xs: 4px;
12
- --gap-xs: 8px;
13
13
  --gap-0: 0px;
14
+ --gap-2: var(--gap-3xs);
14
15
  --gap-4: var(--gap-2xs);
15
- --gap-8: var(--gap-xs);
16
+ --gap-6: 6px;
17
+ --gap-10: 10px;
16
18
  }
17
- .tab-bar__component_1gp7j {
19
+ .tab-bar__component_1vhmw {
18
20
  -webkit-tap-highlight-color: transparent;
19
21
  box-sizing: border-box;
20
22
  background-color: transparent;
@@ -39,23 +41,24 @@
39
41
  flex-direction: column;
40
42
  flex: 1 0 0;
41
43
  align-items: center;
42
- padding: var(--gap-8) var(--gap-0);
44
+ padding: var(--gap-10) var(--gap-0) var(--gap-6);
43
45
  color: var(--color-light-neutral-translucent-700);
44
46
  }
45
- .tab-bar__primary_1gp7j {
47
+ .tab-bar__primary_1vhmw {
46
48
  color: var(--color-light-accent-primary);
47
49
  }
48
- .tab-bar__secondary_1gp7j {
50
+ .tab-bar__secondary_1vhmw {
49
51
  color: var(--color-light-accent-secondary);
50
52
  }
51
- .tab-bar__icon_1gp7j {
53
+ .tab-bar__icon_1vhmw {
52
54
  display: flex;
53
55
  align-items: center;
54
56
  justify-content: center;
55
57
  flex-grow: 1;
56
58
  width: 100%;
59
+ margin-bottom: var(--gap-2);
57
60
  }
58
- .tab-bar__label_1gp7j {
61
+ .tab-bar__label_1vhmw {
59
62
  -webkit-line-clamp: 1;
60
63
  display: -webkit-box;
61
64
  -webkit-box-orient: vertical;
@@ -65,10 +68,10 @@
65
68
 
66
69
  color: var(--color-light-text-secondary);
67
70
  }
68
- .tab-bar__labelSelected_1gp7j {
71
+ .tab-bar__labelSelected_1vhmw {
69
72
  color: inherit;
70
73
  }
71
- .tab-bar__indicator_1gp7j {
74
+ .tab-bar__indicator_1vhmw {
72
75
  position: absolute;
73
76
  top: 3px;
74
77
  left: calc(50% + var(--gap-4));
package/modern/components/tab/index.module.css.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- const styles = {"component":"tab-bar__component_1gp7j","primary":"tab-bar__primary_1gp7j","secondary":"tab-bar__secondary_1gp7j","icon":"tab-bar__icon_1gp7j","label":"tab-bar__label_1gp7j","labelSelected":"tab-bar__labelSelected_1gp7j","indicator":"tab-bar__indicator_1gp7j"};
3
+ const styles = {"component":"tab-bar__component_1vhmw","primary":"tab-bar__primary_1vhmw","secondary":"tab-bar__secondary_1vhmw","icon":"tab-bar__icon_1vhmw","label":"tab-bar__label_1vhmw","labelSelected":"tab-bar__labelSelected_1vhmw","indicator":"tab-bar__indicator_1vhmw"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
package/modern/components/tab/index.module.css.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.module.css.js","sources":["../../src/components/tab/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n\n.component {\n @mixin button-reset;\n\n position: relative;\n display: inline-flex;\n flex-direction: column;\n flex: 1 0 0;\n align-items: center;\n padding: var(--gap-8) var(--gap-0);\n color: var(--color-light-neutral-translucent-700);\n}\n\n.primary {\n color: var(--color-light-accent-primary);\n}\n\n.secondary {\n color: var(--color-light-accent-secondary);\n}\n\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-grow: 1;\n width: 100%;\n}\n\n.label {\n @mixin row_limit 1;\n word-break: break-all;\n flex-shrink: 0;\n\n color: var(--color-light-text-secondary);\n}\n\n.labelSelected {\n color: inherit;\n}\n\n.indicator {\n position: absolute;\n top: 3px;\n left: calc(50% + var(--gap-4));\n height: 16px;\n min-width: 16px;\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,SAAS,CAAC,wBAAwB,CAAC,WAAW,CAAC,0BAA0B,CAAC,MAAM,CAAC,qBAAqB,CAAC,OAAO,CAAC,sBAAsB,CAAC,eAAe,CAAC,8BAA8B,CAAC,WAAW,CAAC,0BAA0B,CAAC;;;;"}
1
+ {"version":3,"file":"index.module.css.js","sources":["../../src/components/tab/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n\n.component {\n @mixin button-reset;\n\n position: relative;\n display: inline-flex;\n flex-direction: column;\n flex: 1 0 0;\n align-items: center;\n padding: var(--gap-10) var(--gap-0) var(--gap-6);\n color: var(--color-light-neutral-translucent-700);\n}\n\n.primary {\n color: var(--color-light-accent-primary);\n}\n\n.secondary {\n color: var(--color-light-accent-secondary);\n}\n\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-grow: 1;\n width: 100%;\n margin-bottom: var(--gap-2);\n}\n\n.label {\n @mixin row_limit 1;\n word-break: break-all;\n flex-shrink: 0;\n\n color: var(--color-light-text-secondary);\n}\n\n.labelSelected {\n color: inherit;\n}\n\n.indicator {\n position: absolute;\n top: 3px;\n left: calc(50% + var(--gap-4));\n height: 16px;\n min-width: 16px;\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,SAAS,CAAC,wBAAwB,CAAC,WAAW,CAAC,0BAA0B,CAAC,MAAM,CAAC,qBAAqB,CAAC,OAAO,CAAC,sBAAsB,CAAC,eAAe,CAAC,8BAA8B,CAAC,WAAW,CAAC,0BAA0B,CAAC;;;;"}
package/modern/index.css CHANGED
@@ -9,26 +9,24 @@
9
9
  :root {
10
10
  --sab: env(safe-area-inset-bottom, var(--gap-0));
11
11
  }
12
- .tab-bar__component_1ks6h {
12
+ .tab-bar__component_1rh6p {
13
13
  display: flex;
14
14
  justify-content: center;
15
- height: 64px;
16
- max-height: 64px;
17
15
  box-sizing: border-box;
18
16
  overflow: hidden;
19
17
  transition: box-shadow 0.2s ease;
20
18
  }
21
- .tab-bar__component_1ks6h.tab-bar__modal-bg-primary_1ks6h {
19
+ .tab-bar__component_1rh6p.tab-bar__modal-bg-primary_1rh6p {
22
20
  background-color: var(--color-light-base-bg-primary);
23
21
  }
24
- .tab-bar__component_1ks6h.tab-bar__modal-bg-alt-primary_1ks6h {
22
+ .tab-bar__component_1rh6p.tab-bar__modal-bg-alt-primary_1rh6p {
25
23
  background-color: var(--color-light-base-bg-alt-primary);
26
24
  }
27
25
  @media (display-mode: standalone) {
28
- .tab-bar__component_1ks6h {
26
+ .tab-bar__component_1rh6p {
29
27
  padding-bottom: var(--sab);
30
28
  }
31
29
  }
32
- .tab-bar__border_1ks6h {
30
+ .tab-bar__border_1rh6p {
33
31
  box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);
34
32
  }
package/modern/index.module.css.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- const styles = {"component":"tab-bar__component_1ks6h","modal-bg-primary":"tab-bar__modal-bg-primary_1ks6h","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_1ks6h","border":"tab-bar__border_1ks6h"};
3
+ const styles = {"component":"tab-bar__component_1rh6p","modal-bg-primary":"tab-bar__modal-bg-primary_1rh6p","modal-bg-alt-primary":"tab-bar__modal-bg-alt-primary_1rh6p","border":"tab-bar__border_1rh6p"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
package/modern/index.module.css.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '@alfalab/core-components-vars/src/safe-area.css';\n\n.component {\n display: flex;\n justify-content: center;\n height: 64px;\n max-height: 64px;\n box-sizing: border-box;\n overflow: hidden;\n transition: box-shadow 0.2s ease;\n\n &.modal-bg-primary {\n background-color: var(--color-light-base-bg-primary);\n }\n\n &.modal-bg-alt-primary {\n background-color: var(--color-light-base-bg-alt-primary);\n }\n\n @media (display-mode: standalone) {\n padding-bottom: var(--sab);\n }\n}\n\n.border {\n box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,kBAAkB,CAAC,iCAAiC,CAAC,sBAAsB,CAAC,qCAAqC,CAAC,QAAQ,CAAC,uBAAuB,CAAC;;;;"}
1
+ {"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '@alfalab/core-components-vars/src/safe-area.css';\n\n.component {\n display: flex;\n justify-content: center;\n box-sizing: border-box;\n overflow: hidden;\n transition: box-shadow 0.2s ease;\n\n &.modal-bg-primary {\n background-color: var(--color-light-base-bg-primary);\n }\n\n &.modal-bg-alt-primary {\n background-color: var(--color-light-base-bg-alt-primary);\n }\n\n @media (display-mode: standalone) {\n padding-bottom: var(--sab);\n }\n}\n\n.border {\n box-shadow: 0 -1px 0 0 var(--color-light-neutral-translucent-300);\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,kBAAkB,CAAC,iCAAiC,CAAC,sBAAsB,CAAC,qCAAqC,CAAC,QAAQ,CAAC,uBAAuB,CAAC;;;;"}
package/moderncssm/components/tab/index.module.css CHANGED
@@ -25,7 +25,7 @@
25
25
  flex-direction: column;
26
26
  flex: 1 0 0;
27
27
  align-items: center;
28
- padding: var(--gap-8) var(--gap-0);
28
+ padding: var(--gap-10) var(--gap-0) var(--gap-6);
29
29
  color: var(--color-light-neutral-translucent-700);
30
30
  }
31
31
 
@@ -43,6 +43,7 @@
43
43
  justify-content: center;
44
44
  flex-grow: 1;
45
45
  width: 100%;
46
+ margin-bottom: var(--gap-2);
46
47
  }
47
48
 
48
49
  .label {
package/moderncssm/index.module.css CHANGED
@@ -5,8 +5,6 @@
5
5
  .component {
6
6
  display: flex;
7
7
  justify-content: center;
8
- height: 64px;
9
- max-height: 64px;
10
8
  box-sizing: border-box;
11
9
  overflow: hidden;
12
10
  transition: box-shadow 0.2s ease;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-tab-bar",
3
- "version": "4.0.3",
3
+ "version": "4.0.4",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "license": "MIT",
package/src/components/tab/index.module.css CHANGED
@@ -8,7 +8,7 @@
8
8
  flex-direction: column;
9
9
  flex: 1 0 0;
10
10
  align-items: center;
11
- padding: var(--gap-8) var(--gap-0);
11
+ padding: var(--gap-10) var(--gap-0) var(--gap-6);
12
12
  color: var(--color-light-neutral-translucent-700);
13
13
  }
14
14
 
@@ -26,6 +26,7 @@
26
26
  justify-content: center;
27
27
  flex-grow: 1;
28
28
  width: 100%;
29
+ margin-bottom: var(--gap-2);
29
30
  }
30
31
 
31
32
  .label {
package/src/index.module.css CHANGED
@@ -4,8 +4,6 @@
4
4
  .component {
5
5
  display: flex;
6
6
  justify-content: center;
7
- height: 64px;
8
- max-height: 64px;
9
7
  box-sizing: border-box;
10
8
  overflow: hidden;
11
9
  transition: box-shadow 0.2s ease;