@djb25/digit-ui-css 1.0.41 → 1.0.42

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@djb25/digit-ui-css",
3
- "version": "1.0.41",
3
+ "version": "1.0.42",
4
4
  "license": "MIT",
5
5
  "main": "dist/index.css",
6
6
  "author": "satyam",
@@ -123,14 +123,14 @@
123
123
  padding: 20px 0;
124
124
  -webkit-background-clip: text;
125
125
  text-align: center;
126
- background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
126
+ background: linear-gradient(135deg, #1f5fa8 0%, #0b2e5b 100%);
127
127
  border-radius: 10px;
128
128
  margin-left: 72px;
129
129
  margin-right: 72px;
130
130
  }
131
131
 
132
132
  .modernFinanceUILoginForm {
133
- background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
133
+ background: linear-gradient(135deg, #1f5fa8 0%, #0b2e5b 100%);
134
134
  min-height: 100vh;
135
135
  display: flex;
136
136
  align-items: center;
@@ -233,7 +233,7 @@
233
233
 
234
234
  .modernFinanceUIWelcomeContent {
235
235
  flex: 1;
236
- background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
236
+ background: linear-gradient(135deg, #1f5fa8 0%, #0b2e5b 100%);
237
237
  padding: 60px 40px;
238
238
  display: flex;
239
239
  flex-direction: column;
@@ -282,14 +282,14 @@
282
282
 
283
283
  .modernLoginForm input:focus {
284
284
  outline: none;
285
- border-color: #667eea;
285
+ border-color: #1f5fa8;
286
286
  box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
287
287
  }
288
288
 
289
289
  .modernLoginButton {
290
290
  width: 100%;
291
291
  padding: 12px 24px;
292
- background: linear-gradient(45deg, #667eea, #764ba2) !important;
292
+ background: linear-gradient(45deg, #1f5fa8, #0b2e5b) !important;
293
293
  border: none !important;
294
294
  border-radius: 8px !important;
295
295
  color: white !important;
@@ -417,7 +417,7 @@
417
417
  }
418
418
 
419
419
  .custom-sidebar.open .menu-item.active {
420
- background-color: #667eea;
420
+ background-color: #1f5fa8;
421
421
  font-weight: bold;
422
422
  margin: 10px;
423
423
  border-radius: 6px;
@@ -535,9 +535,7 @@
535
535
 
536
536
  .collapsible-card {
537
537
  border-radius: 6px;
538
- margin-bottom: 16px;
539
538
  background: #fff;
540
- overflow: hidden;
541
539
  }
542
540
 
543
541
  .collapsible-card-header {
@@ -557,7 +555,7 @@
557
555
  left: 0;
558
556
  width: 4px;
559
557
  height: 100%;
560
- background: #667eea;
558
+ background: #1f5fa8;
561
559
  }
562
560
 
563
561
  .collapsible-card-title {
@@ -627,7 +625,7 @@
627
625
  }
628
626
 
629
627
  .finance-header {
630
- background: linear-gradient(135deg, #667eea, #764ba2);
628
+ background: linear-gradient(135deg, #1f5fa8, #0b2e5b);
631
629
  padding: 16px 24px;
632
630
  color: white;
633
631
  margin-top: 25px;
@@ -835,16 +833,12 @@
835
833
  }
836
834
 
837
835
  .collapsible-card-tab-button.active {
838
- background-color: #667eea;
836
+ background-color: #1f5fa8;
839
837
  color: white;
840
838
  box-shadow: 0 2px 10px rgba(102, 126, 234, 0.3);
841
839
  outline: none;
842
840
  }
843
841
 
844
- .collapsible-card-tab-content {
845
- padding: 20px;
846
- }
847
-
848
842
  @media screen and (max-width: 1024px) {
849
843
  .finance-mainlayout {
850
844
  flex-direction: column !important;
@@ -75,7 +75,7 @@
75
75
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
76
76
  overflow-y: scroll;
77
77
  @media (min-width: 768px) {
78
- max-width: 25%;
78
+ max-width: 100%;
79
79
  }
80
80
  }
81
81
 
@@ -104,12 +104,12 @@
104
104
  }
105
105
 
106
106
  .stepper-circle.active {
107
- background: #667eea;
107
+ background: #1f5fa8;
108
108
  color: #fff;
109
109
  }
110
110
 
111
111
  .stepper-circle.completed {
112
- background: #667eea;
112
+ background: #1f5fa8;
113
113
  color: #fff;
114
114
  }
115
115
 
@@ -125,7 +125,7 @@
125
125
 
126
126
  .stepper-label:hover {
127
127
  cursor: pointer;
128
- color: #667eea;
128
+ color: #1f5fa8;
129
129
  }
130
130
 
131
131
  .stepper-line {
@@ -136,7 +136,7 @@
136
136
  }
137
137
 
138
138
  .stepper-line.completed {
139
- background: #667eea;
139
+ background: #1f5fa8;
140
140
  }
141
141
 
142
142
  @media (max-width: 768px) {
@@ -180,7 +180,7 @@
180
180
  }
181
181
 
182
182
  .stepper-line.completed {
183
- background: #667eea;
183
+ background: #1f5fa8;
184
184
  }
185
185
 
186
186
  /* hide line on last step */
@@ -44,7 +44,7 @@
44
44
  }
45
45
 
46
46
  .vertical-timeline-connector.completed {
47
- background-color: #667eea;
47
+ background-color: #1f5fa8;
48
48
  }
49
49
 
50
50
  .vertical-timeline-pill {
@@ -68,8 +68,8 @@
68
68
  }
69
69
 
70
70
  .vertical-timeline-step.active .vertical-timeline-pill {
71
- background-color: #667eea;
72
- border-color: #667eea;
71
+ background-color: #1f5fa8;
72
+ border-color: #1f5fa8;
73
73
  color: #fff;
74
74
  box-shadow: 0 0 0 5px rgba(244, 119, 56, 0.2);
75
75
  /* Enhanced glow */
@@ -78,8 +78,8 @@
78
78
  }
79
79
 
80
80
  .vertical-timeline-step.completed .vertical-timeline-pill {
81
- background-color: #667eea;
82
- border-color: #667eea;
81
+ background-color: #1f5fa8;
82
+ border-color: #1f5fa8;
83
83
  color: #fff;
84
84
  }
85
85
 
@@ -121,7 +121,7 @@
121
121
  display: flex;
122
122
  border-radius: 99999px;
123
123
  padding: 0.25rem;
124
- background-color: #667eea36;
124
+ background-color: #1f5fa836;
125
125
  overflow-x: scroll;
126
126
  max-width: 100%;
127
127
  }
@@ -170,7 +170,7 @@
170
170
 
171
171
  /* active tab */
172
172
  .vertical-timeline-step.active .vertical-timeline-pill {
173
- background-color: #667eea;
173
+ background-color: #1f5fa8;
174
174
  color: #fff;
175
175
  transform: none;
176
176
  box-shadow: none;
@@ -178,7 +178,7 @@
178
178
 
179
179
  /* completed tab */
180
180
  .vertical-timeline-step.completed .vertical-timeline-pill {
181
- background-color: #667eea;
181
+ background-color: #1f5fa8;
182
182
  color: #fff;
183
183
  }
184
184
  }
@@ -3,7 +3,7 @@ body {
3
3
  }
4
4
 
5
5
  .body-container {
6
- @apply h-full min-h-screen overflow-x-hidden;
6
+ @apply h-full min-h-screen overflow-x-hidden;
7
7
  }
8
8
 
9
9
  .navbar {
@@ -140,10 +140,15 @@ body {
140
140
  .form-container {
141
141
  display: flex;
142
142
  flex-direction: column;
143
- padding: 20px;
143
+ padding: 26px;
144
144
  width: 100%;
145
145
  gap: 12px;
146
146
 
147
+ @media (min-width: 768px) {
148
+ padding-right: 75px;
149
+ padding-top: 33px;
150
+ }
151
+
147
152
  .header {
148
153
  font-size: 18px;
149
154
  display: flex;
@@ -157,7 +162,9 @@ body {
157
162
  }
158
163
 
159
164
  .ws-docs-container {
160
- padding: 8px 0;
165
+ display: flex;
166
+ flex-direction: column;
167
+ gap: 20px;
161
168
  }
162
169
 
163
170
  .ws-doc-card {
@@ -165,7 +172,6 @@ body {
165
172
  border: 1px solid #e0e0e0;
166
173
  border-radius: 8px;
167
174
  padding: 20px;
168
- margin-bottom: 20px;
169
175
  transition: all 0.2s ease;
170
176
  }
171
177
 
@@ -204,12 +210,14 @@ body {
204
210
 
205
211
  .ws-doc-options {
206
212
  padding-left: 4px;
213
+ display: flex;
214
+ flex-direction: column;
215
+ gap: 8px;
207
216
  }
208
217
 
209
218
  .ws-doc-option {
210
219
  display: flex;
211
220
  align-items: flex-start;
212
- margin-bottom: 8px;
213
221
  font-size: 15px;
214
222
  color: #333;
215
223
  }
@@ -71,8 +71,8 @@
71
71
  .jk-digit-primary-btn {
72
72
  width: auto;
73
73
  height: 40px;
74
- background: linear-gradient(135deg, #667eea, #764ba2);
75
- border: 1px solid linear-gradient(135deg, #667eea, #764ba2);
74
+ background: linear-gradient(135deg, #1f5fa8, #0b2e5b);
75
+ border: 1px solid linear-gradient(135deg, #1f5fa8, #0b2e5b);
76
76
  padding: 20px;
77
77
  color: theme(colors.white);
78
78
  display: flex;
@@ -103,4 +103,4 @@
103
103
  flex-flow: column;
104
104
  margin-bottom: 15px;
105
105
  }
106
- }
106
+ }
@@ -178,7 +178,7 @@
178
178
 
179
179
  .submit-bar {
180
180
  @apply h-10 text-center outline-none;
181
- background: linear-gradient(135deg, #667eea, #764ba2);
181
+ background: linear-gradient(135deg, #1f5fa8, #0b2e5b);
182
182
  box-shadow: inset 0px -2px 0px theme(colors.text.primary);
183
183
  cursor: pointer;
184
184
  height: 36px !important;
@@ -195,7 +195,7 @@
195
195
 
196
196
  .submit-bar-disabled {
197
197
  @apply h-10 text-center w-full outline-none opacity-50;
198
- background: linear-gradient(135deg, #667eea, #764ba2);
198
+ background: linear-gradient(135deg, #1f5fa8, #0b2e5b);
199
199
 
200
200
  &:focus {
201
201
  @apply outline-none;
@@ -866,7 +866,7 @@
866
866
  }
867
867
 
868
868
  .sidebar-item.active {
869
- background-color: #667eea;
869
+ background-color: #1f5fa8;
870
870
  color: #ffffff;
871
871
  box-shadow: 0 4px 6px rgba(0, 173, 239, 0.2);
872
872
  padding: 6px;
@@ -1070,7 +1070,7 @@
1070
1070
  }
1071
1071
 
1072
1072
  .sidebar-item.active {
1073
- background-color: #667eea;
1073
+ background-color: #1f5fa8;
1074
1074
  color: #ffffff;
1075
1075
  box-shadow: 0 4px 6px rgba(0, 173, 239, 0.2);
1076
1076
  }
@@ -10,14 +10,14 @@
10
10
  padding: 20px 0;
11
11
  -webkit-background-clip: text;
12
12
  text-align: center;
13
- background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
13
+ background: linear-gradient(135deg, #1f5fa8 0%, #0b2e5b 100%);
14
14
  border-radius: 10px;
15
15
  margin-left: 72px;
16
16
  margin-right: 72px;
17
17
  }
18
18
 
19
19
  .modernFinanceUILoginForm {
20
- background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
20
+ background: linear-gradient(135deg, #1f5fa8 0%, #0b2e5b 100%);
21
21
  min-height: 100vh;
22
22
  display: flex;
23
23
  align-items: center;
@@ -120,7 +120,7 @@
120
120
 
121
121
  .modernFinanceUIWelcomeContent {
122
122
  flex: 1;
123
- background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
123
+ background: linear-gradient(135deg, #1f5fa8 0%, #0b2e5b 100%);
124
124
  padding: 60px 40px;
125
125
  display: flex;
126
126
  flex-direction: column;
@@ -169,14 +169,14 @@
169
169
 
170
170
  .modernLoginForm input:focus {
171
171
  outline: none;
172
- border-color: #667eea;
172
+ border-color: #1f5fa8;
173
173
  box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
174
174
  }
175
175
 
176
176
  .modernLoginButton {
177
177
  width: 100%;
178
178
  padding: 12px 24px;
179
- background: linear-gradient(45deg, #667eea, #764ba2) !important;
179
+ background: linear-gradient(45deg, #1f5fa8, #0b2e5b) !important;
180
180
  border: none !important;
181
181
  border-radius: 8px !important;
182
182
  color: white !important;
@@ -306,7 +306,7 @@
306
306
  }
307
307
 
308
308
  .custom-sidebar.open .menu-item.active {
309
- background-color: #667eea;
309
+ background-color: #1f5fa8;
310
310
  font-weight: bold;
311
311
  margin: 10px;
312
312
  border-radius: 6px;
@@ -424,9 +424,7 @@
424
424
 
425
425
  .collapsible-card {
426
426
  border-radius: 6px;
427
- margin-bottom: 16px;
428
427
  background: #fff;
429
- overflow: hidden;
430
428
  }
431
429
 
432
430
  .collapsible-card-header {
@@ -446,7 +444,7 @@
446
444
  left: 0;
447
445
  width: 4px;
448
446
  height: 100%;
449
- background: #667eea;
447
+ background: #1f5fa8;
450
448
  }
451
449
 
452
450
  .collapsible-card-title {
@@ -516,7 +514,7 @@
516
514
  }
517
515
 
518
516
  .finance-header {
519
- background: linear-gradient(135deg, #667eea, #764ba2);
517
+ background: linear-gradient(135deg, #1f5fa8, #0b2e5b);
520
518
  padding: 16px 24px;
521
519
  color: white;
522
520
  margin-top: 25px;
@@ -725,15 +723,11 @@
725
723
  }
726
724
 
727
725
  .collapsible-card-tab-button.active {
728
- background-color: #667eea;
726
+ background-color: #1f5fa8;
729
727
  color: white;
730
728
  box-shadow: 0 2px 10px rgba(102, 126, 234, 0.3);
731
729
  }
732
730
 
733
- .collapsible-card-tab-content {
734
- padding: 20px;
735
- }
736
-
737
731
  /* -------------------------------------------------------------- */
738
732
  /* EXACT RESPONSIVE FIX FOR MODULE PAGE (MATCHES YOUR SCREENSHOT) */
739
733
  /* -------------------------------------------------------------- */
@@ -1,60 +1,60 @@
1
1
  @import url("../../digitv2/index.scss");
2
2
 
3
3
  .inbox-search-links-container {
4
- @extend .light-paper-primary;
5
- height: 100%;
6
- width: 100% !important;
7
- display: flex;
8
- flex-direction: column;
9
- padding: 1rem;
10
- .header {
11
- @extend .light-text-color-primary;
12
- display: grid;
13
- grid-template-columns: 20% 1fr;
14
- .logo {
15
- padding: 0px;
16
- display: flex;
17
- align-items: center;
18
- justify-content: flex-start;
19
- .inbox-search-icon--projects {
20
- fill : #f47738;
21
- height: 2rem;
22
- width: 2rem;
23
- }
24
- }
25
- .text {
26
- @extend .light-text-color-primary;
27
- line-height: 32px;
28
- font-weight: 700;
29
- color : black;
30
- display: flex;
31
- align-items: center;
32
- justify-content: flex-start;
33
- }
4
+ @extend .light-paper-primary;
5
+ height: 100%;
6
+ width: 100% !important;
7
+ display: flex;
8
+ flex-direction: column;
9
+ padding: 1rem;
10
+ .header {
11
+ @extend .light-text-color-primary;
12
+ display: grid;
13
+ grid-template-columns: 20% 1fr;
14
+ .logo {
15
+ padding: 0px;
16
+ display: flex;
17
+ align-items: center;
18
+ justify-content: flex-start;
19
+ .inbox-search-icon--projects {
20
+ fill: #3a8dcc;
21
+ height: 2rem;
22
+ width: 2rem;
23
+ }
24
+ }
25
+ .text {
26
+ @extend .light-text-color-primary;
27
+ line-height: 32px;
28
+ font-weight: 700;
29
+ color: black;
30
+ display: flex;
31
+ align-items: center;
32
+ justify-content: flex-start;
33
+ }
34
34
 
35
- @media (min-width: 1024px) {
36
- .text {
37
- font-size: 24px;
38
- }
39
- }
35
+ @media (min-width: 1024px) {
36
+ .text {
37
+ font-size: 24px;
38
+ }
39
+ }
40
40
 
41
- @media (max-width: 1024px) {
42
- .text {
43
- font-size: 20px;
44
- }
45
- }
41
+ @media (max-width: 1024px) {
42
+ .text {
43
+ font-size: 20px;
44
+ }
46
45
  }
47
- .contents {
48
- margin-top: 1rem;
49
- box-sizing: border-box;
50
- display: flex;
51
- flex-direction: column;
52
- .link {
53
- @extend .light-primary;
54
- padding: 8px;
55
- --text-opacity: 1;
56
- color: #f47738;
57
- color: rgba(244, 119, 56, var(--text-opacity));
58
- }
46
+ }
47
+ .contents {
48
+ margin-top: 1rem;
49
+ box-sizing: border-box;
50
+ display: flex;
51
+ flex-direction: column;
52
+ .link {
53
+ @extend .light-primary;
54
+ padding: 8px;
55
+ --text-opacity: 1;
56
+ color: #3a8dcc;
57
+ color: rgba(244, 119, 56, var(--text-opacity));
59
58
  }
60
- }
59
+ }
60
+ }