ui-soxo-bootstrap-core 2.6.1-dev.11 → 2.6.1-dev.13

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.
@@ -3,6 +3,25 @@
3
3
  display: flex;
4
4
  flex-direction: column;
5
5
  overflow: hidden;
6
+
7
+ &.consultation-mode {
8
+ background: linear-gradient(180deg, #c8d2d6 0%, #d5d7d1 21%, #d9d8c6 40%, #c6cebe 58%, #a8c0c0 71%, #6e9fbb 84%, #367495 93%, #0a4d6e 100%);
9
+ padding: 12px;
10
+ }
11
+
12
+ &.is-fullscreen {
13
+ padding: 12px;
14
+ }
15
+ }
16
+
17
+ .process-steps-page.consultation-mode .process-steps-card {
18
+ border: none;
19
+ background: transparent;
20
+ box-shadow: none;
21
+ }
22
+
23
+ .process-steps-page.consultation-mode .process-steps-card > .ant-card-body {
24
+ padding: 10px;
6
25
  }
7
26
 
8
27
  .process-steps-card {
@@ -49,11 +68,11 @@
49
68
  flex: 1;
50
69
  max-height: 100%;
51
70
  overflow: hidden;
52
- background: #fff;
53
- border: 1px solid #e5ebf3;
54
- border-radius: 14px;
55
- box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
56
- padding: 14px 16px;
71
+ // background: #fff;
72
+ // border: 1px solid #e5ebf3;
73
+ // border-radius: 14px;
74
+ // box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
75
+ // padding: 14px 16px;
57
76
  position: relative;
58
77
  z-index: 2;
59
78
  }
@@ -84,8 +103,18 @@
84
103
  height: 100%;
85
104
  border: none !important;
86
105
  border-radius: 12px;
87
- background: linear-gradient(180deg, #f4f7fc 0%, #edf2f9 100%);
88
- box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.8), inset 0 8px 16px rgba(15, 23, 42, 0.08), inset 0 -2px 8px rgba(15, 23, 42, 0.04);
106
+ background: linear-gradient(135deg, color-mix(in srgb, var(--accent-color) 15%, var(--surface-color)), var(--surface-color));
107
+
108
+ border: 1px solid color-mix(in srgb, var(--accent-color) 30%, transparent);
109
+
110
+ box-shadow: 0 8px 20px color-mix(in srgb, var(--accent-color) 20%, transparent);
111
+
112
+ transition: all 0.3s ease;
113
+ // background: linear-gradient(180deg, #f4f7fc 0%, #edf2f9 100%);
114
+ // box-shadow:
115
+ // inset 0 1px 2px rgba(255, 255, 255, 0.8),
116
+ // inset 0 8px 16px rgba(15, 23, 42, 0.08),
117
+ // inset 0 -2px 8px rgba(15, 23, 42, 0.04);
89
118
  }
90
119
 
91
120
  .timeline-card .ant-card-body {
@@ -108,6 +137,35 @@
108
137
  transition: all 0.3s ease;
109
138
  height: 100%;
110
139
  overflow-y: auto;
140
+
141
+ scrollbar-width: thin; /* Firefox */
142
+ scrollbar-color: rgba(0, 0, 0, 0.25) transparent;
143
+
144
+ &::-webkit-scrollbar-thumb {
145
+ background: rgba(0, 0, 0, 0);
146
+ }
147
+
148
+ &:hover::-webkit-scrollbar-thumb {
149
+ background: rgba(0, 0, 0, 0.25);
150
+ }
151
+
152
+ &::-webkit-scrollbar {
153
+ width: 6px;
154
+ height: 6px;
155
+ }
156
+
157
+ &::-webkit-scrollbar-track {
158
+ background: transparent;
159
+ }
160
+
161
+ &::-webkit-scrollbar-thumb {
162
+ background: rgba(0, 0, 0, 0.25);
163
+ border-radius: 10px;
164
+ }
165
+
166
+ &::-webkit-scrollbar-thumb:hover {
167
+ background: rgba(0, 0, 0, 0.4);
168
+ }
111
169
  padding-right: 4px;
112
170
  }
113
171
 
@@ -119,7 +177,10 @@
119
177
  border-radius: 10px;
120
178
  background: #fff;
121
179
  padding: 10px 12px;
122
- transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
180
+ transition:
181
+ border-color 0.2s ease,
182
+ box-shadow 0.2s ease,
183
+ transform 0.2s ease;
123
184
  }
124
185
 
125
186
  .timeline-step:hover {
@@ -233,7 +294,11 @@
233
294
  color: #1f3f74;
234
295
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.2);
235
296
  z-index: 40;
236
- transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
297
+ transition:
298
+ background-color 0.2s ease,
299
+ border-color 0.2s ease,
300
+ box-shadow 0.2s ease,
301
+ transform 0.2s ease;
237
302
 
238
303
  &:hover {
239
304
  background: #f0f6ff;
@@ -265,9 +330,8 @@
265
330
  MOBILE & TABLET VIEW FIXES
266
331
  ============================ */
267
332
 
268
-
269
-
270
- @media (max-width: 992px) { // iPad & tablets
333
+ @media (max-width: 992px) {
334
+ // iPad & tablets
271
335
  .process-steps-page,
272
336
  .process-steps-row {
273
337
  min-height: auto;
@@ -275,6 +339,10 @@
275
339
  overflow: visible;
276
340
  }
277
341
 
342
+ .process-steps-page.consultation-mode {
343
+ padding: 8px;
344
+ }
345
+
278
346
  .process-steps-card,
279
347
  .process-steps-card .ant-card-body,
280
348
  .process-steps-content-col {
@@ -327,7 +395,8 @@
327
395
  }
328
396
  }
329
397
 
330
- @media (max-width: 768px) { // mobile screens
398
+ @media (max-width: 768px) {
399
+ // mobile screens
331
400
  .timeline-sidebar {
332
401
  gap: 8px;
333
402
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ui-soxo-bootstrap-core",
3
- "version": "2.6.1-dev.11",
3
+ "version": "2.6.1-dev.13",
4
4
  "description": "All the Core Components for you to start",
5
5
  "keywords": [
6
6
  "all in one"