@djb25/digit-ui-css 1.0.44 → 1.0.45

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.44",
3
+ "version": "1.0.45",
4
4
  "license": "MIT",
5
5
  "main": "dist/index.css",
6
6
  "author": "satyam",
@@ -6,7 +6,8 @@
6
6
  border-radius: 12px;
7
7
  overflow-y: scroll;
8
8
  height: fit-content;
9
- @media (min-width: 768px) {
9
+
10
+ @media (min-width: 769px) {
10
11
  max-width: 25%;
11
12
  min-width: 250px;
12
13
  min-height: 500px;
@@ -17,7 +18,8 @@
17
18
  display: flex;
18
19
  position: relative;
19
20
  gap: 16px;
20
- @media (min-width: 768px) {
21
+
22
+ @media (min-width: 769px) {
21
23
  min-height: 80px;
22
24
  padding-bottom: 20px;
23
25
  }
@@ -86,7 +88,8 @@
86
88
  .vertical-timeline-content {
87
89
  display: flex;
88
90
  flex-direction: column;
89
- @media (min-width: 768px) {
91
+
92
+ @media (min-width: 769px) {
90
93
  min-height: 38px;
91
94
  margin-top: 10px;
92
95
  }
@@ -115,6 +118,9 @@
115
118
  gap: 12px;
116
119
  padding: 12px;
117
120
  height: fit-content;
121
+ max-width: 100%;
122
+ min-width: auto;
123
+ min-height: auto;
118
124
  }
119
125
 
120
126
  .vertical-timeline-wrapper {
@@ -143,9 +149,8 @@
143
149
  cursor: pointer;
144
150
  height: 2rem;
145
151
  padding-inline: 24px;
146
- @media (min-width: 768px) {
147
- min-width: 120px;
148
- }
152
+ flex-shrink: 0;
153
+ min-width: 120px;
149
154
  }
150
155
 
151
156
  /* 🔥 pill becomes tab */
@@ -181,4 +186,4 @@
181
186
  background-color: #1f5fa8;
182
187
  color: #fff;
183
188
  }
184
- }
189
+ }
@@ -275,10 +275,10 @@
275
275
  @apply mb-md mx-md !important;
276
276
  */
277
277
 
278
- &.filter {
278
+ /* &.filter {
279
279
  margin-left: auto;
280
280
  margin-right: auto;
281
- }
281
+ } */
282
282
 
283
283
  .card-header {
284
284
  @apply text-heading-xl-dt;
@@ -8,7 +8,7 @@
8
8
 
9
9
  .header-top-section {
10
10
  width: 100%;
11
- background: linear-gradient(98deg, rgba(110, 192, 221, 0.71) -24.44%, rgba(97, 119, 236, 0.9) 93.53%);
11
+ background: linear-gradient(135deg,#1a67a3,#5282e6 40%,#5495fe);
12
12
  padding: 30px 50px;
13
13
  border-radius: 11px;
14
14
  margin-inline: 42px;
@@ -41,7 +41,7 @@
41
41
 
42
42
  .header-bottom-section {
43
43
  width: 100%;
44
- background: linear-gradient(278deg, rgba(110, 192, 221, 0.71) -24.44%, rgba(97, 119, 236, 0.9) 93.53%);
44
+ background: linear-gradient(135deg,#1a67a3,#5282e6 40%,#5495fe);
45
45
  padding: 5px 20px;
46
46
  border-radius: 11px;
47
47
  position: relative;
@@ -29,3 +29,51 @@
29
29
  left: calc(50% - 240px);
30
30
  }
31
31
  }
32
+
33
+ /* Toast base */
34
+ .toast-success {
35
+ display: flex;
36
+ align-items: center;
37
+ gap: 10px;
38
+
39
+ padding: 12px 16px;
40
+ border-radius: 8px;
41
+
42
+ color: #fff;
43
+ background-color: #22c55e;
44
+
45
+ box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
46
+
47
+ z-index: 9999;
48
+
49
+ /* 👇 animation trigger */
50
+ animation: slideInRight 0.4s ease forwards;
51
+ }
52
+
53
+ /* Slide-in from right */
54
+ @keyframes slideInRight {
55
+ from {
56
+ transform: translateX(120%);
57
+ opacity: 0;
58
+ }
59
+ to {
60
+ transform: translateX(0);
61
+ opacity: 1;
62
+ }
63
+ }
64
+
65
+ /* Slide-out */
66
+ .toast-exit {
67
+ animation: slideOutRight 0.3s ease forwards;
68
+ }
69
+
70
+ @keyframes slideOutRight {
71
+ from {
72
+ transform: translateX(0);
73
+ opacity: 1;
74
+ }
75
+ to {
76
+ transform: translateX(120%);
77
+ opacity: 0;
78
+ }
79
+ }
package/src/index.scss CHANGED
@@ -913,6 +913,10 @@ input[type="number"] {
913
913
  height: 100%;
914
914
  }
915
915
 
916
+ .flex-box-col {
917
+ flex-direction: column;
918
+ }
919
+
916
920
  .flex-box-content-between {
917
921
  display: flex;
918
922
  justify-content: space-between;