@egovernments/digit-ui-components-css 0.0.2-beta.10 → 0.0.2-beta.11

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 (48) hide show
  1. package/CHANGELOG.md +88 -84
  2. package/README.md +80 -80
  3. package/dist/index.css +612 -26
  4. package/dist/index.min.css +2 -2
  5. package/package.json +69 -69
  6. package/src/digitv2/components/FormComposerV2.scss +118 -118
  7. package/src/digitv2/components/actionbarV2.scss +207 -0
  8. package/src/digitv2/components/backLinkV2.scss +36 -36
  9. package/src/digitv2/components/bodyContainerV2.scss +39 -39
  10. package/src/digitv2/components/breadcrumbV2.scss +56 -56
  11. package/src/digitv2/components/buttonsV2.scss +451 -426
  12. package/src/digitv2/components/cardV2.scss +497 -484
  13. package/src/digitv2/components/cardbasedoptionsV2.scss +46 -46
  14. package/src/digitv2/components/cardlabelV2.scss +7 -7
  15. package/src/digitv2/components/checkboxV2.scss +83 -83
  16. package/src/digitv2/components/chipV2.scss +129 -129
  17. package/src/digitv2/components/dividerV2.scss +10 -10
  18. package/src/digitv2/components/errorMessageV2.scss +20 -20
  19. package/src/digitv2/components/fieldV1.scss +96 -96
  20. package/src/digitv2/components/headerdropdownV2.scss +152 -0
  21. package/src/digitv2/components/infoCardV2.scss +139 -139
  22. package/src/digitv2/components/infobuttonV2.scss +75 -75
  23. package/src/digitv2/components/labelFieldPairV2.scss +66 -66
  24. package/src/digitv2/components/mobileNumberV2.scss +65 -65
  25. package/src/digitv2/components/multiSelectDropdownV2.scss +315 -315
  26. package/src/digitv2/components/panelCardV2.scss +160 -160
  27. package/src/digitv2/components/panelV2.scss +114 -114
  28. package/src/digitv2/components/popUpV2.scss +330 -319
  29. package/src/digitv2/components/radiobtnV2.scss +115 -115
  30. package/src/digitv2/components/selectDropdownV2.scss +364 -364
  31. package/src/digitv2/components/stepperV2.scss +147 -147
  32. package/src/digitv2/components/textInputV2.scss +462 -462
  33. package/src/digitv2/components/textareaV2.scss +99 -99
  34. package/src/digitv2/components/textblockV2.scss +46 -46
  35. package/src/digitv2/components/timelineV2.scss +171 -159
  36. package/src/digitv2/components/toastV2.scss +80 -80
  37. package/src/digitv2/components/toggleV2.scss +72 -72
  38. package/src/digitv2/components/topbarV2.scss +388 -0
  39. package/src/digitv2/components/treeSelectV2.scss +132 -132
  40. package/src/digitv2/components/uploaderV2.scss +556 -556
  41. package/src/digitv2/components/viewCardFieldPairV2.scss +44 -44
  42. package/src/digitv2/index.scss +169 -168
  43. package/src/digitv2/pages/employee/index.scss +1 -1
  44. package/src/digitv2/pages/employee/workbench.scss +615 -615
  45. package/src/digitv2/typography.scss +638 -638
  46. package/src/index.scss +681 -681
  47. package/src/pages/employee/index.scss +625 -625
  48. package/src/pages/employee/login.scss +220 -220
package/src/digitv2/components/viewCardFieldPairV2.scss CHANGED
@@ -1,45 +1,45 @@
1
- .digit-viewcard-field-pair{
2
- @apply w-full flex-col;
3
- display: flex;
4
- height: fit-content;
5
- background-color: transparent;
6
- gap: theme(digitv2.spacers.spacer1);
7
-
8
- .digit-viewcard-label{
9
- @extend .typography.heading-s;
10
- @apply whitespace-pre-wrap break-words w-full;
11
- word-break: break-word;
12
- color: theme(digitv2.lightTheme.text-primary);
13
- }
14
-
15
- .digit-viewcard-value{
16
- @extend .typography.body-s;
17
- @apply whitespace-pre-wrap break-words w-full;
18
- color: theme(digitv2.lightTheme.text-primary);
19
- }
20
-
21
- &.inline{
22
- flex-direction: row;
23
-
24
- @media (min-width: 48rem) {
25
- gap: theme(digitv2.spacers.spacer6);
26
- }
27
-
28
- @media (min-width: 30.063rem) and (max-width: 47.938rem) {
29
- gap: theme(digitv2.spacers.spacer5);
30
- }
31
-
32
- @media (max-width: 30rem) {
33
- gap: theme(digitv2.spacers.spacer4);
34
- }
35
-
36
- .digit-viewcard-label{
37
- width: 20%;
38
- }
39
-
40
- .digit-viewcard-value{
41
- width: 80%;
42
- }
43
-
44
- }
1
+ .digit-viewcard-field-pair{
2
+ @apply w-full flex-col;
3
+ display: flex;
4
+ height: fit-content;
5
+ background-color: transparent;
6
+ gap: theme(digitv2.spacers.spacer1);
7
+
8
+ .digit-viewcard-label{
9
+ @extend .typography.heading-s;
10
+ @apply whitespace-pre-wrap break-words w-full;
11
+ word-break: break-word;
12
+ color: theme(digitv2.lightTheme.text-primary);
13
+ }
14
+
15
+ .digit-viewcard-value{
16
+ @extend .typography.body-s;
17
+ @apply whitespace-pre-wrap break-words w-full;
18
+ color: theme(digitv2.lightTheme.text-primary);
19
+ }
20
+
21
+ &.inline{
22
+ flex-direction: row;
23
+
24
+ @media (min-width: 48rem) {
25
+ gap: theme(digitv2.spacers.spacer6);
26
+ }
27
+
28
+ @media (min-width: 30.063rem) and (max-width: 47.938rem) {
29
+ gap: theme(digitv2.spacers.spacer5);
30
+ }
31
+
32
+ @media (max-width: 30rem) {
33
+ gap: theme(digitv2.spacers.spacer4);
34
+ }
35
+
36
+ .digit-viewcard-label{
37
+ width: 20%;
38
+ }
39
+
40
+ .digit-viewcard-value{
41
+ width: 80%;
42
+ }
43
+
44
+ }
45
45
  }
package/src/digitv2/index.scss CHANGED
@@ -1,169 +1,170 @@
1
- @import url("./components/backLinkV2.scss");
2
- @import url("./components/bodyContainerV2.scss");
3
- @import url("./components/breadcrumbV2.scss");
4
- @import url("./components/buttonsV2.scss");
5
- @import url("./components/cardlabelV2.scss");
6
- @import url("./components/cardbasedoptionsV2.scss");
7
- @import url("./components/cardV2.scss");
8
- @import url("./components/checkboxV2.scss");
9
- @import url("./components/dividerV2.scss");
10
- @import url("./components/errorMessageV2.scss");
11
- @import url("./components/fieldV1.scss");
12
- @import url("./components/FormComposerV2.scss");
13
- @import url("./components/infobuttonV2.scss");
14
- @import url("./components/infoCardV2.scss");
15
- @import url("./components/labelFieldPairV2.scss");
16
- @import url("./components/mobileNumberV2.scss");
17
- @import url("./components/multiSelectDropdownV2.scss");
18
- @import url("./components/panelCardV2.scss");
19
- @import url("./components/panelV2.scss");
20
- @import url("./components/popUpV2.scss");
21
- @import url("./components/radiobtnV2.scss");
22
- @import url("./components/chipV2.scss");
23
- @import url("./components/selectDropdownV2.scss");
24
- @import url("./components/stepperV2.scss");
25
- @import url("./components/textareaV2.scss");
26
- @import url("./components/textblockV2.scss");
27
- @import url("./components/textInputV2.scss");
28
- @import url("./components/timelineV2.scss");
29
- @import url("./components/toastV2.scss");
30
- @import url("./components/toggleV2.scss");
31
- @import url("./components/treeSelectV2.scss");
32
- @import url("./components/uploaderV2.scss");
33
- @import url("./components/viewCardFieldPairV2.scss");
34
-
35
-
36
-
37
- /* pages */
38
- @import url("./pages/employee/index.scss");
39
-
40
- /* important to be remove after fixing the components */
41
- .light {
42
- &-primary {
43
- color: theme(digitv2.lightTheme.primary-orange) !important;
44
-
45
- &-button {
46
- background-color: theme(digitv2.lightTheme.primary-orange);
47
- }
48
-
49
- &-bg {
50
- background-color: theme(digitv2.lightTheme.primary-orangebg);
51
- }
52
- }
53
-
54
- &-text-color {
55
- &-primary {
56
- color: theme(digitv2.lightTheme.text-primary);
57
- }
58
-
59
- &-secondary {
60
- color: theme(digitv2.lightTheme.text-secondary);
61
- }
62
-
63
- &-disabled {
64
- color: theme(digitv2.lightTheme.text-disabled);
65
- }
66
- }
67
-
68
- &-background {
69
- background-color: theme(digitv2.lightTheme.generic-background);
70
- }
71
-
72
- &-paper {
73
- &-primary {
74
- background-color: theme(digitv2.lightTheme.paper-primary) !important;
75
-
76
- &-color {
77
- color: theme(digitv2.lightTheme.paper-primary) !important;
78
- }
79
- }
80
-
81
- &-secondary {
82
- background-color: theme(digitv2.lightTheme.paper-secondary);
83
- }
84
- &-border {
85
- border: 0.5px solid;
86
- border-radius: 0.5rem;
87
- border-color: theme(digitv2.lightTheme.generic-background);
88
- }
89
-
90
- &-border {
91
- border-radius: 4px;
92
- border-style: solid;
93
- border-width: 1px;
94
- border-color: theme(digitv2.lightTheme.generic-divider);
95
- }
96
- }
97
-
98
- &-divider {
99
- background-color: theme(digitv2.lightTheme.generic-divider);
100
- }
101
-
102
- &-header-sidenav {
103
- color: theme(digitv2.lightTheme.primary-bluegray);
104
- }
105
-
106
- &-input-border {
107
- border-color: theme(digitv2.lightTheme.generic-inputborder);
108
- }
109
- }
110
-
111
- .alert {
112
- &-error {
113
- color: theme(digitv2.lightTheme.alert-error);
114
-
115
- &-bg {
116
- background-color: theme(digitv2.lightTheme.alert-errorbg);
117
- }
118
-
119
- &-border {
120
- border-color: theme(digitv2.lightTheme.alert-error) !important;
121
- }
122
- }
123
-
124
- &-success {
125
- color: theme(digitv2.lightTheme.alert-success);
126
-
127
- &-bg {
128
- background-color: theme(digitv2.lightTheme.alert-successbg);
129
- }
130
- }
131
-
132
- &-info {
133
- color: theme(digitv2.alert.info);
134
-
135
- &-bg {
136
- background-color: theme(digitv2.alert.info-bg);
137
- }
138
- }
139
- }
140
-
141
- .chart {
142
- &-item-1 {
143
- color: theme(digitv2.chart.chart-1);
144
- }
145
-
146
- &-item-1-gradient {
147
- color: theme(digitv2.chart.chart-1-gradient);
148
- }
149
-
150
- &-item-2 {
151
- color: theme(digitv2.chart.chart-2);
152
- }
153
-
154
- &-item-2-gradient {
155
- color: theme(digitv2.chart.chart-2-gradient);
156
- }
157
-
158
- &-item-3 {
159
- color: theme(digitv2.chart.chart-3);
160
- }
161
-
162
- &-item-4 {
163
- color: theme(digitv2.chart.chart-4);
164
- }
165
-
166
- &-item-5 {
167
- color: theme(digitv2.chart.chart-5);
168
- }
1
+ @import url("./components/backLinkV2.scss");
2
+ @import url("./components/bodyContainerV2.scss");
3
+ @import url("./components/breadcrumbV2.scss");
4
+ @import url("./components/buttonsV2.scss");
5
+ @import url("./components/cardlabelV2.scss");
6
+ @import url("./components/cardbasedoptionsV2.scss");
7
+ @import url("./components/cardV2.scss");
8
+ @import url("./components/checkboxV2.scss");
9
+ @import url("./components/dividerV2.scss");
10
+ @import url("./components/errorMessageV2.scss");
11
+ @import url("./components/fieldV1.scss");
12
+ @import url("./components/FormComposerV2.scss");
13
+ @import url("./components/infobuttonV2.scss");
14
+ @import url("./components/infoCardV2.scss");
15
+ @import url("./components/labelFieldPairV2.scss");
16
+ @import url("./components/mobileNumberV2.scss");
17
+ @import url("./components/multiSelectDropdownV2.scss");
18
+ @import url("./components/panelCardV2.scss");
19
+ @import url("./components/panelV2.scss");
20
+ @import url("./components/popUpV2.scss");
21
+ @import url("./components/radiobtnV2.scss");
22
+ @import url("./components/chipV2.scss");
23
+ @import url("./components/selectDropdownV2.scss");
24
+ @import url("./components/stepperV2.scss");
25
+ @import url("./components/textareaV2.scss");
26
+ @import url("./components/textblockV2.scss");
27
+ @import url("./components/textInputV2.scss");
28
+ @import url("./components/timelineV2.scss");
29
+ @import url("./components/toastV2.scss");
30
+ @import url("./components/toggleV2.scss");
31
+ @import url("./components/treeSelectV2.scss");
32
+ @import url("./components/uploaderV2.scss");
33
+ @import url("./components/viewCardFieldPairV2.scss");
34
+ @import url("./components/actionbarV2.scss");
35
+ @import url("./components/headerdropdownV2.scss");
36
+ @import url("./components/topbarV2.scss");
37
+
38
+ /* pages */
39
+ @import url("./pages/employee/index.scss");
40
+
41
+ /* important to be remove after fixing the components */
42
+ .light {
43
+ &-primary {
44
+ color: theme(digitv2.lightTheme.primary-orange) !important;
45
+
46
+ &-button {
47
+ background-color: theme(digitv2.lightTheme.primary-orange);
48
+ }
49
+
50
+ &-bg {
51
+ background-color: theme(digitv2.lightTheme.primary-orangebg);
52
+ }
53
+ }
54
+
55
+ &-text-color {
56
+ &-primary {
57
+ color: theme(digitv2.lightTheme.text-primary);
58
+ }
59
+
60
+ &-secondary {
61
+ color: theme(digitv2.lightTheme.text-secondary);
62
+ }
63
+
64
+ &-disabled {
65
+ color: theme(digitv2.lightTheme.text-disabled);
66
+ }
67
+ }
68
+
69
+ &-background {
70
+ background-color: theme(digitv2.lightTheme.generic-background);
71
+ }
72
+
73
+ &-paper {
74
+ &-primary {
75
+ background-color: theme(digitv2.lightTheme.paper-primary) !important;
76
+
77
+ &-color {
78
+ color: theme(digitv2.lightTheme.paper-primary) !important;
79
+ }
80
+ }
81
+
82
+ &-secondary {
83
+ background-color: theme(digitv2.lightTheme.paper-secondary);
84
+ }
85
+ &-border {
86
+ border: 0.5px solid;
87
+ border-radius: 0.5rem;
88
+ border-color: theme(digitv2.lightTheme.generic-background);
89
+ }
90
+
91
+ &-border {
92
+ border-radius: 4px;
93
+ border-style: solid;
94
+ border-width: 1px;
95
+ border-color: theme(digitv2.lightTheme.generic-divider);
96
+ }
97
+ }
98
+
99
+ &-divider {
100
+ background-color: theme(digitv2.lightTheme.generic-divider);
101
+ }
102
+
103
+ &-header-sidenav {
104
+ color: theme(digitv2.lightTheme.primary-bluegray);
105
+ }
106
+
107
+ &-input-border {
108
+ border-color: theme(digitv2.lightTheme.generic-inputborder);
109
+ }
110
+ }
111
+
112
+ .alert {
113
+ &-error {
114
+ color: theme(digitv2.lightTheme.alert-error);
115
+
116
+ &-bg {
117
+ background-color: theme(digitv2.lightTheme.alert-errorbg);
118
+ }
119
+
120
+ &-border {
121
+ border-color: theme(digitv2.lightTheme.alert-error) !important;
122
+ }
123
+ }
124
+
125
+ &-success {
126
+ color: theme(digitv2.lightTheme.alert-success);
127
+
128
+ &-bg {
129
+ background-color: theme(digitv2.lightTheme.alert-successbg);
130
+ }
131
+ }
132
+
133
+ &-info {
134
+ color: theme(digitv2.alert.info);
135
+
136
+ &-bg {
137
+ background-color: theme(digitv2.alert.info-bg);
138
+ }
139
+ }
140
+ }
141
+
142
+ .chart {
143
+ &-item-1 {
144
+ color: theme(digitv2.chart.chart-1);
145
+ }
146
+
147
+ &-item-1-gradient {
148
+ color: theme(digitv2.chart.chart-1-gradient);
149
+ }
150
+
151
+ &-item-2 {
152
+ color: theme(digitv2.chart.chart-2);
153
+ }
154
+
155
+ &-item-2-gradient {
156
+ color: theme(digitv2.chart.chart-2-gradient);
157
+ }
158
+
159
+ &-item-3 {
160
+ color: theme(digitv2.chart.chart-3);
161
+ }
162
+
163
+ &-item-4 {
164
+ color: theme(digitv2.chart.chart-4);
165
+ }
166
+
167
+ &-item-5 {
168
+ color: theme(digitv2.chart.chart-5);
169
+ }
169
170
  }
package/src/digitv2/pages/employee/index.scss CHANGED
@@ -1 +1 @@
1
- @import url("./workbench.scss");
1
+ @import url("./workbench.scss");