@rolster/react-components 18.15.2 → 18.15.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 (6) hide show
  1. package/dist/cjs/assets/{index-Dbh6DUCn.css → index-CV5CNdv4.css} +28 -15
  2. package/dist/es/assets/{index-Dbh6DUCn.css → index-CV5CNdv4.css} +28 -15
  3. package/dist/esm/components/atoms/Badge/Badge.css +3 -3
  4. package/dist/esm/components/atoms/SkeletonText/SkeletonText.css +9 -2
  5. package/dist/esm/components/molecules/Ballot/Ballot.css +16 -10
  6. package/package.json +2 -2
package/dist/cjs/assets/{index-Dbh6DUCn.css → index-CV5CNdv4.css} RENAMED
@@ -58,13 +58,13 @@
58
58
  position: relative;
59
59
  display: inline-block;
60
60
  width: auto;
61
- padding: var(--rls-sizing-x2);
61
+ padding: var(--rlc-badge-padding);
62
62
  box-sizing: border-box;
63
63
  font-size: var(--rls-caption-font-size);
64
64
  letter-spacing: var(--rls-caption-letter-spacing);
65
65
  line-height: var(--rls-caption-line-height);
66
- color: var(--rls-theme-color-500);
67
- background: var(--rls-theme-color-100);
66
+ color: var(--rls-theme-color-100);
67
+ background: var(--rls-theme-color-500);
68
68
  border-radius: var(--rls-sizing-x2);
69
69
  }
70
70
  .rls-badge > span {
@@ -790,14 +790,21 @@
790
790
  letter-spacing: var(--rlc-skeleton-text-letter-spacing);
791
791
  line-height: var(--rlc-skeleton-text-height);
792
792
  font-weight: inherit;
793
+ overflow: inherit;
794
+ white-space: inherit;
795
+ text-overflow: inherit;
793
796
  }
794
797
  .rls-skeleton-text__value {
795
- display: block;
798
+ display: flex;
799
+ column-gap: var(--rlc-skeleton-text-column-gap);
800
+ align-items: center;
796
801
  font-weight: inherit;
797
802
  font-size: inherit;
798
803
  line-height: inherit;
799
804
  letter-spacing: inherit;
800
- overflow: hidden;
805
+ overflow: inherit;
806
+ white-space: inherit;
807
+ text-overflow: inherit;
801
808
  }
802
809
 
803
810
  .rls-switch {
@@ -863,7 +870,7 @@
863
870
  width: 100%;
864
871
  align-content: center;
865
872
  column-gap: var(--rls-sizing-x4);
866
- padding: var(--rls-sizing-x4);
873
+ padding: var(--rlc-ballot-padding);
867
874
  box-sizing: border-box;
868
875
  overflow: hidden;
869
876
  }
@@ -878,28 +885,34 @@
878
885
  display: flex;
879
886
  overflow: hidden;
880
887
  flex-direction: column;
881
- row-gap: var(--rls-sizing-x2);
888
+ row-gap: var(--rlc-ballot-component-row-gap);
882
889
  }
883
890
  .rls-ballot__title {
891
+ --rlc-skeleton-text-height: var(--rls-ballot-title-height);
892
+ --rlc-skeleton-text-letter-spacing: var(--rls-ballot-title-letter-spacing);
893
+ --rlc-skeleton-text-font-size: var(--rls-ballot-title-font-size);
884
894
  position: relative;
885
895
  width: 100%;
886
896
  color: var(--rls-app-color-500);
887
897
  overflow: hidden;
888
898
  white-space: nowrap;
889
899
  text-overflow: ellipsis;
890
- font-weight: var(--rls-font-weight-medium);
891
- font-size: var(--rls-label-font-size);
892
- letter-spacing: var(--rls-label-letter-spacing);
893
- min-height: var(--rls-label-line-height);
894
- line-height: var(--rls-label-line-height);
900
+ font-weight: var(--rlc-ballot-title-font-weight);
901
+ font-size: var(--rls-ballot-title-font-size);
902
+ letter-spacing: var(--rls-ballot-title-letter-spacing);
903
+ min-height: var(--rls-ballot-title-height);
904
+ line-height: var(--rls-ballot-title-height);
895
905
  }
896
906
  .rls-ballot__subtitle {
907
+ --rlc-skeleton-text-height: var(--rlc-ballot-subtitle-height);
908
+ --rlc-skeleton-text-letter-spacing: var(--rls-ballot-subtitle-letter-spacing);
909
+ --rlc-skeleton-text-font-size: var(--rls-ballot-subtitle-font-size);
897
910
  position: relative;
898
911
  width: var(--rlc-ballot-subtitle-width);
899
912
  color: var(--rls-app-color-300);
900
- font-weight: var(--rls-font-weight-semibold);
901
- font-size: var(--rls-smalltext-font-size);
902
- letter-spacing: var(--rls-smalltext-letter-spacing);
913
+ font-weight: var(--rlc-ballot-subtitle-font-weight);
914
+ font-size: var(--rls-ballot-subtitle-font-size);
915
+ letter-spacing: var(--rls-ballot-subtitle-letter-spacing);
903
916
  min-height: var(--rlc-ballot-subtitle-height);
904
917
  line-height: var(--rlc-ballot-subtitle-height);
905
918
  overflow: var(--rlc-ballot-subtitle-overflow);
package/dist/es/assets/{index-Dbh6DUCn.css → index-CV5CNdv4.css} RENAMED
@@ -58,13 +58,13 @@
58
58
  position: relative;
59
59
  display: inline-block;
60
60
  width: auto;
61
- padding: var(--rls-sizing-x2);
61
+ padding: var(--rlc-badge-padding);
62
62
  box-sizing: border-box;
63
63
  font-size: var(--rls-caption-font-size);
64
64
  letter-spacing: var(--rls-caption-letter-spacing);
65
65
  line-height: var(--rls-caption-line-height);
66
- color: var(--rls-theme-color-500);
67
- background: var(--rls-theme-color-100);
66
+ color: var(--rls-theme-color-100);
67
+ background: var(--rls-theme-color-500);
68
68
  border-radius: var(--rls-sizing-x2);
69
69
  }
70
70
  .rls-badge > span {
@@ -790,14 +790,21 @@
790
790
  letter-spacing: var(--rlc-skeleton-text-letter-spacing);
791
791
  line-height: var(--rlc-skeleton-text-height);
792
792
  font-weight: inherit;
793
+ overflow: inherit;
794
+ white-space: inherit;
795
+ text-overflow: inherit;
793
796
  }
794
797
  .rls-skeleton-text__value {
795
- display: block;
798
+ display: flex;
799
+ column-gap: var(--rlc-skeleton-text-column-gap);
800
+ align-items: center;
796
801
  font-weight: inherit;
797
802
  font-size: inherit;
798
803
  line-height: inherit;
799
804
  letter-spacing: inherit;
800
- overflow: hidden;
805
+ overflow: inherit;
806
+ white-space: inherit;
807
+ text-overflow: inherit;
801
808
  }
802
809
 
803
810
  .rls-switch {
@@ -863,7 +870,7 @@
863
870
  width: 100%;
864
871
  align-content: center;
865
872
  column-gap: var(--rls-sizing-x4);
866
- padding: var(--rls-sizing-x4);
873
+ padding: var(--rlc-ballot-padding);
867
874
  box-sizing: border-box;
868
875
  overflow: hidden;
869
876
  }
@@ -878,28 +885,34 @@
878
885
  display: flex;
879
886
  overflow: hidden;
880
887
  flex-direction: column;
881
- row-gap: var(--rls-sizing-x2);
888
+ row-gap: var(--rlc-ballot-component-row-gap);
882
889
  }
883
890
  .rls-ballot__title {
891
+ --rlc-skeleton-text-height: var(--rls-ballot-title-height);
892
+ --rlc-skeleton-text-letter-spacing: var(--rls-ballot-title-letter-spacing);
893
+ --rlc-skeleton-text-font-size: var(--rls-ballot-title-font-size);
884
894
  position: relative;
885
895
  width: 100%;
886
896
  color: var(--rls-app-color-500);
887
897
  overflow: hidden;
888
898
  white-space: nowrap;
889
899
  text-overflow: ellipsis;
890
- font-weight: var(--rls-font-weight-medium);
891
- font-size: var(--rls-label-font-size);
892
- letter-spacing: var(--rls-label-letter-spacing);
893
- min-height: var(--rls-label-line-height);
894
- line-height: var(--rls-label-line-height);
900
+ font-weight: var(--rlc-ballot-title-font-weight);
901
+ font-size: var(--rls-ballot-title-font-size);
902
+ letter-spacing: var(--rls-ballot-title-letter-spacing);
903
+ min-height: var(--rls-ballot-title-height);
904
+ line-height: var(--rls-ballot-title-height);
895
905
  }
896
906
  .rls-ballot__subtitle {
907
+ --rlc-skeleton-text-height: var(--rlc-ballot-subtitle-height);
908
+ --rlc-skeleton-text-letter-spacing: var(--rls-ballot-subtitle-letter-spacing);
909
+ --rlc-skeleton-text-font-size: var(--rls-ballot-subtitle-font-size);
897
910
  position: relative;
898
911
  width: var(--rlc-ballot-subtitle-width);
899
912
  color: var(--rls-app-color-300);
900
- font-weight: var(--rls-font-weight-semibold);
901
- font-size: var(--rls-smalltext-font-size);
902
- letter-spacing: var(--rls-smalltext-letter-spacing);
913
+ font-weight: var(--rlc-ballot-subtitle-font-weight);
914
+ font-size: var(--rls-ballot-subtitle-font-size);
915
+ letter-spacing: var(--rls-ballot-subtitle-letter-spacing);
903
916
  min-height: var(--rlc-ballot-subtitle-height);
904
917
  line-height: var(--rlc-ballot-subtitle-height);
905
918
  overflow: var(--rlc-ballot-subtitle-overflow);
package/dist/esm/components/atoms/Badge/Badge.css CHANGED
@@ -2,13 +2,13 @@
2
2
  position: relative;
3
3
  display: inline-block;
4
4
  width: auto;
5
- padding: var(--rls-sizing-x2);
5
+ padding: var(--rlc-badge-padding);
6
6
  box-sizing: border-box;
7
7
  font-size: var(--rls-caption-font-size);
8
8
  letter-spacing: var(--rls-caption-letter-spacing);
9
9
  line-height: var(--rls-caption-line-height);
10
- color: var(--rls-theme-color-500);
11
- background: var(--rls-theme-color-100);
10
+ color: var(--rls-theme-color-100);
11
+ background: var(--rls-theme-color-500);
12
12
  border-radius: var(--rls-sizing-x2);
13
13
  }
14
14
  .rls-badge > span {
package/dist/esm/components/atoms/SkeletonText/SkeletonText.css CHANGED
@@ -6,12 +6,19 @@
6
6
  letter-spacing: var(--rlc-skeleton-text-letter-spacing);
7
7
  line-height: var(--rlc-skeleton-text-height);
8
8
  font-weight: inherit;
9
+ overflow: inherit;
10
+ white-space: inherit;
11
+ text-overflow: inherit;
9
12
  }
10
13
  .rls-skeleton-text__value {
11
- display: block;
14
+ display: flex;
15
+ column-gap: var(--rlc-skeleton-text-column-gap);
16
+ align-items: center;
12
17
  font-weight: inherit;
13
18
  font-size: inherit;
14
19
  line-height: inherit;
15
20
  letter-spacing: inherit;
16
- overflow: hidden;
21
+ overflow: inherit;
22
+ white-space: inherit;
23
+ text-overflow: inherit;
17
24
  }
package/dist/esm/components/molecules/Ballot/Ballot.css CHANGED
@@ -6,7 +6,7 @@
6
6
  width: 100%;
7
7
  align-content: center;
8
8
  column-gap: var(--rls-sizing-x4);
9
- padding: var(--rls-sizing-x4);
9
+ padding: var(--rlc-ballot-padding);
10
10
  box-sizing: border-box;
11
11
  overflow: hidden;
12
12
  }
@@ -21,28 +21,34 @@
21
21
  display: flex;
22
22
  overflow: hidden;
23
23
  flex-direction: column;
24
- row-gap: var(--rls-sizing-x2);
24
+ row-gap: var(--rlc-ballot-component-row-gap);
25
25
  }
26
26
  .rls-ballot__title {
27
+ --rlc-skeleton-text-height: var(--rls-ballot-title-height);
28
+ --rlc-skeleton-text-letter-spacing: var(--rls-ballot-title-letter-spacing);
29
+ --rlc-skeleton-text-font-size: var(--rls-ballot-title-font-size);
27
30
  position: relative;
28
31
  width: 100%;
29
32
  color: var(--rls-app-color-500);
30
33
  overflow: hidden;
31
34
  white-space: nowrap;
32
35
  text-overflow: ellipsis;
33
- font-weight: var(--rls-font-weight-medium);
34
- font-size: var(--rls-label-font-size);
35
- letter-spacing: var(--rls-label-letter-spacing);
36
- min-height: var(--rls-label-line-height);
37
- line-height: var(--rls-label-line-height);
36
+ font-weight: var(--rlc-ballot-title-font-weight);
37
+ font-size: var(--rls-ballot-title-font-size);
38
+ letter-spacing: var(--rls-ballot-title-letter-spacing);
39
+ min-height: var(--rls-ballot-title-height);
40
+ line-height: var(--rls-ballot-title-height);
38
41
  }
39
42
  .rls-ballot__subtitle {
43
+ --rlc-skeleton-text-height: var(--rlc-ballot-subtitle-height);
44
+ --rlc-skeleton-text-letter-spacing: var(--rls-ballot-subtitle-letter-spacing);
45
+ --rlc-skeleton-text-font-size: var(--rls-ballot-subtitle-font-size);
40
46
  position: relative;
41
47
  width: var(--rlc-ballot-subtitle-width);
42
48
  color: var(--rls-app-color-300);
43
- font-weight: var(--rls-font-weight-semibold);
44
- font-size: var(--rls-smalltext-font-size);
45
- letter-spacing: var(--rls-smalltext-letter-spacing);
49
+ font-weight: var(--rlc-ballot-subtitle-font-weight);
50
+ font-size: var(--rls-ballot-subtitle-font-size);
51
+ letter-spacing: var(--rls-ballot-subtitle-letter-spacing);
46
52
  min-height: var(--rlc-ballot-subtitle-height);
47
53
  line-height: var(--rlc-ballot-subtitle-height);
48
54
  overflow: var(--rlc-ballot-subtitle-overflow);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rolster/react-components",
3
- "version": "18.15.2",
3
+ "version": "18.15.4",
4
4
  "type": "module",
5
5
  "description": "Package containing UI components for React Project.",
6
6
  "module": "dist/esm/index.js",
@@ -53,7 +53,7 @@
53
53
  "@rollup/plugin-node-resolve": "^15.2.1",
54
54
  "@rollup/plugin-typescript": "^11.1.3",
55
55
  "@rolster/rollup": "^1.0.6",
56
- "@rolster/styles-foundations": "^2.3.2",
56
+ "@rolster/styles-foundations": "^2.3.8",
57
57
  "@rolster/types": "^1.0.9",
58
58
  "@types/node-sass": "^4.11.4",
59
59
  "@types/react": "^18.0.28",