@djb25/digit-ui-css 1.0.60 → 1.0.62

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.60",
3
+ "version": "1.0.62",
4
4
  "license": "MIT",
5
5
  "main": "dist/index.css",
6
6
  "author": "satyam",
@@ -1,8 +1,8 @@
1
1
  .assign-knos-modal {
2
2
  display: flex;
3
3
  flex-direction: column;
4
- gap: 20px;
5
- height: inherit;
4
+ gap: 8px;
5
+ height: 100%;
6
6
  overflow-y: auto;
7
7
  flex: 1;
8
8
 
@@ -27,16 +27,6 @@
27
27
  }
28
28
  }
29
29
 
30
- .summary-bar {
31
- display: flex;
32
- justify-content: space-between;
33
- align-items: center;
34
- background: #f5f7fa;
35
- padding: 14px 18px;
36
- border-radius: 12px;
37
- font-weight: 600;
38
- }
39
-
40
30
  .table-wrapper {
41
31
  border: 1px solid #d6d6d6;
42
32
  border-radius: 14px;
@@ -5,12 +5,241 @@
5
5
  /* Smooth scrolling on iOS */
6
6
  }
7
7
 
8
+ .ekycTable {
9
+ thead {
10
+ th {
11
+ &:first-child {
12
+ min-width: fit-content !important;
13
+ }
14
+ &:nth-child(2) {
15
+ min-width: fit-content !important;
16
+ }
17
+ }
18
+ }
19
+ }
20
+
21
+ .basetable {
22
+ font-family: DM Sans, Segoe UI, ui-sans-serif, sans-serif;
23
+ background: rgb(255, 255, 255);
24
+ border: 1px solid rgb(226, 232, 240);
25
+ border-radius: 12px;
26
+ box-shadow: rgba(15, 23, 42, 0.06) 0px 1px 3px, rgba(15, 23, 42, 0.04) 0px 1px 2px;
27
+ width: 100%;
28
+ flex: 1;
29
+ overflow-y: scroll;
30
+ display: flex;
31
+ flex-direction: column;
32
+ .table-topbar {
33
+ display: flex;
34
+ align-items: center;
35
+ justify-content: space-between;
36
+ padding: 12px 16px;
37
+ border-bottom: 1px solid rgb(226, 232, 240);
38
+ background: rgb(255, 255, 255);
39
+ gap: 12px;
40
+ flex-wrap: wrap;
41
+ border-radius: 12px 12px 0px 0px;
42
+ .topbar-badge {
43
+ display: flex !important;
44
+ align-items: center !important;
45
+ gap: 10px !important;
46
+ flex-wrap: wrap;
47
+ .title {
48
+ margin: 0;
49
+ font-size: 15px;
50
+ font-weight: 700;
51
+ color: #0f172a;
52
+ letter-spacing: -0.015em;
53
+ }
54
+ .total-records {
55
+ display: inline-flex;
56
+ align-items: center;
57
+ gap: 6;
58
+ background: #5282e6;
59
+ color: #fff;
60
+ border-radius: 999;
61
+ padding: 4px 16px;
62
+ font-size: 11;
63
+ font-weight: 600;
64
+ box-shadow: 0 1px 4px rgba(37, 99, 235, 0.28);
65
+ border-radius: 40px;
66
+ .records {
67
+ background: rgba(255, 255, 255, 0.22);
68
+ border-radius: 999;
69
+ padding: 1px 7px;
70
+ font-size: 11;
71
+ font-weight: 700;
72
+ font-family: "JetBrains Mono", "Fira Code", ui-monospace, monospace;
73
+ color: #fff;
74
+ }
75
+ .title {
76
+ font-size: 10;
77
+ opacity: 0.88;
78
+ text-transform: uppercase;
79
+ letter-spacing: 0.06em;
80
+ color: #fff;
81
+ }
82
+ }
83
+ }
84
+
85
+ .search-box-wrapper {
86
+ display: flex;
87
+ align-items: center;
88
+ gap: 8;
89
+ flex-wrap: wrap;
90
+ border: 1px solid #e2e8f0 !important;
91
+ border-radius: 40px;
92
+ padding: 0px 12px;
93
+
94
+ .table-search-box {
95
+ position: relative;
96
+ display: flex;
97
+ align-items: center !important;
98
+ .icon {
99
+ position: absolute;
100
+ left: 9;
101
+ line-height: 0;
102
+ pointer-events: none;
103
+ }
104
+ .icon.accent {
105
+ color: #5282e6;
106
+ }
107
+ .icon.textMuted {
108
+ color: #94a3b8;
109
+ }
110
+ .search-input {
111
+ border-radius: 6;
112
+ padding: 6px 10px 6px 30px;
113
+ font-size: 13;
114
+ font-family: "DM Sans", "Segoe UI", ui-sans-serif, sans-serif;
115
+ color: #0f172a;
116
+ background: #fff;
117
+ outline: none;
118
+ width: 200;
119
+ transition: border-color 0.15s, box-shadow 0.15s;
120
+ }
121
+ .search-input.shadow {
122
+ box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
123
+ }
124
+ .close-button {
125
+ position: absolute;
126
+ right: 7;
127
+ background: none;
128
+ border: none;
129
+ cursor: pointer;
130
+ padding: 2;
131
+ line-height: 0;
132
+ color: #94a3b8;
133
+ display: flex;
134
+ align-items: center;
135
+ }
136
+ .export-button {
137
+ display: inline-flex;
138
+ align-items: center;
139
+ gap: 6;
140
+ border-radius: 6;
141
+ padding: 6px 10px;
142
+ font-size: 12.5;
143
+ font-weight: 600;
144
+ font-family: "DM Sans", "Segoe UI", ui-sans-serif, sans-serif;
145
+ line-height: 1;
146
+ transition: all 0.15s;
147
+ border: 1px solid;
148
+
149
+ .download-icon {
150
+ line-height: 0;
151
+ }
152
+ }
153
+ .export-button.exporting {
154
+ border-color: #cbd5e1;
155
+ background: #f8fafc;
156
+ color: #94a3b8;
157
+ cursor: not-allowed;
158
+ }
159
+ .export-button.normal {
160
+ border-color: #bfdbfe;
161
+ background: #eff6ff;
162
+ color: #5282e6;
163
+ cursor: pointer;
164
+ }
165
+ }
166
+ }
167
+ }
168
+
169
+ .table-content-wrapper {
170
+ flex: 1;
171
+ width: 100%;
172
+ overflow-x: auto;
173
+ -webkit-overflow-scrolling: touch;
174
+ .table-content {
175
+ width: 100%;
176
+ border-collapse: collapse;
177
+ border-spacing: 0;
178
+ font-size: 13.5;
179
+ color: #0f172a;
180
+ font-family: DM Sans, Segoe UI, ui-sans-serif, sans-serif;
181
+
182
+ .thead {
183
+ .tr {
184
+ background: #f8fafc;
185
+ .th-s-no {
186
+ width: 48;
187
+ padding: 12px 8px;
188
+ text-align: center;
189
+ border-bottom: 2px solid #cbd5e1;
190
+ font-size: 11;
191
+ font-weight: 700;
192
+ text-transform: uppercase;
193
+ letter-spacing: 0.07em;
194
+ color: #475569;
195
+ white-space: nowrap;
196
+ vertical-align: middle;
197
+ height: 52px;
198
+ }
199
+
200
+ .th {
201
+ position: relative;
202
+ padding: 12px 14px;
203
+ vertical-align: middle;
204
+ border-bottom: 2px solid #cbd5e1;
205
+ white-space: nowrap;
206
+ user-select: none;
207
+ transition: 0.15s;
208
+ height: 52px;
209
+
210
+ div {
211
+ display: flex;
212
+ align-items: center;
213
+ gap: 5;
214
+ justify-content: center;
215
+ width: 100%;
216
+ .col-head {
217
+ font-size: 11;
218
+ font-weight: 700;
219
+ text-transform: uppercase;
220
+ letter-spacing: 0.07em;
221
+ transition: color 0.15s;
222
+ }
223
+ .col-head.accentDark {
224
+ color: #5282e6;
225
+ }
226
+ .col-head.textSecondary {
227
+ color: #475569;
228
+ }
229
+ }
230
+ }
231
+ }
232
+ }
233
+ }
234
+ }
235
+ }
236
+
8
237
  .table {
9
238
  @apply bg-white w-full;
10
239
 
11
240
  thead {
12
241
  th {
13
- padding: 20px 18px;
242
+ padding: 8px 18px;
14
243
  text-align: left;
15
244
  white-space: nowrap;
16
245
  /* Updated gradient background to match screenshot */
@@ -16,8 +16,9 @@
16
16
  }
17
17
 
18
18
  .popup-module-action-bar {
19
- gap: 16px;
20
- @apply flex flex-row justify-end;
19
+ border-top: 1px solid rgba(15, 23, 42, 0.08);
20
+ padding-top: 12px;
21
+ @apply flex flex-wrap items-center flex-row justify-end gap-3;
21
22
  }
22
23
 
23
24
  .modal-form {
@@ -34,10 +35,5 @@
34
35
  .popup-module-main {
35
36
  @apply w-full p-md h-full;
36
37
  }
37
-
38
- .popup-module-action-bar {
39
- gap: 16px;
40
- @apply flex flex-row justify-end;
41
- }
42
38
  }
43
39
  }