@pmidc/upyog-css 1.0.27 → 1.0.28
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/dist/index.css +73 -0
- package/dist/index.min.css +1 -1
- package/package.json +1 -1
- package/src/index.scss +1 -0
- package/src/pages/ws/index.scss +105 -0
package/package.json
CHANGED
package/src/index.scss
CHANGED
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
.alignmentSettle {
|
|
2
|
+
/* Desktop: 4 fields per row */
|
|
3
|
+
.form-field {
|
|
4
|
+
width: calc(25% - 15px) !important;
|
|
5
|
+
margin-right: 15px !important;
|
|
6
|
+
margin-bottom: 16px !important;
|
|
7
|
+
min-width: calc(25% - 15px) !important;
|
|
8
|
+
max-width: calc(25% - 15px) !important;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
/* Remove margin from 4th field in each row */
|
|
12
|
+
.form-field:nth-child(4n) {
|
|
13
|
+
margin-right: 0 !important;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
/* Search/Reset button - same size as fields */
|
|
17
|
+
.submit {
|
|
18
|
+
width: calc(25% - 15px) !important;
|
|
19
|
+
min-width: calc(25% - 15px) !important;
|
|
20
|
+
max-width: calc(25% - 15px) !important;
|
|
21
|
+
margin-right: 0 !important;
|
|
22
|
+
margin-top: 0 !important;
|
|
23
|
+
display: flex !important;
|
|
24
|
+
flex-direction: column !important;
|
|
25
|
+
justify-content: flex-end !important;
|
|
26
|
+
|
|
27
|
+
button {
|
|
28
|
+
width: 100% !important;
|
|
29
|
+
height: 40px !important;
|
|
30
|
+
margin-bottom: 4px !important;
|
|
31
|
+
font-size: 14px !important;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
p {
|
|
35
|
+
width: 100% !important;
|
|
36
|
+
margin: 0 !important;
|
|
37
|
+
text-align: center !important;
|
|
38
|
+
font-size: 12px !important;
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
/* Tablet: 2 fields per row */
|
|
43
|
+
@media (max-width: 1024px) {
|
|
44
|
+
.form-field {
|
|
45
|
+
width: calc(50% - 10px) !important;
|
|
46
|
+
min-width: calc(50% - 10px) !important;
|
|
47
|
+
max-width: calc(50% - 10px) !important;
|
|
48
|
+
margin-right: 10px !important;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
.form-field:nth-child(4n) {
|
|
52
|
+
margin-right: 10px !important; /* Reset desktop rule */
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
.form-field:nth-child(2n) {
|
|
56
|
+
margin-right: 0 !important; /* 2nd field in each row */
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
.submit {
|
|
60
|
+
width: calc(50% - 10px) !important;
|
|
61
|
+
min-width: calc(50% - 10px) !important;
|
|
62
|
+
max-width: calc(50% - 10px) !important;
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
/* Mobile: 1 field per row */
|
|
67
|
+
@media (max-width: 640px) {
|
|
68
|
+
.form-field {
|
|
69
|
+
width: 100% !important;
|
|
70
|
+
min-width: 100% !important;
|
|
71
|
+
max-width: 100% !important;
|
|
72
|
+
margin-right: 0 !important;
|
|
73
|
+
margin-bottom: 12px !important;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
.form-field:nth-child(2n) {
|
|
77
|
+
margin-right: 0 !important; /* Reset tablet rule */
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
.submit {
|
|
81
|
+
width: 100% !important;
|
|
82
|
+
min-width: 100% !important;
|
|
83
|
+
max-width: 100% !important;
|
|
84
|
+
margin-top: 8px !important;
|
|
85
|
+
|
|
86
|
+
button {
|
|
87
|
+
height: 44px !important; /* Slightly taller for mobile */
|
|
88
|
+
font-size: 16px !important;
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
/* Small mobile optimization */
|
|
94
|
+
@media (max-width: 480px) {
|
|
95
|
+
.form-field {
|
|
96
|
+
margin-bottom: 10px !important;
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
.submit {
|
|
100
|
+
button {
|
|
101
|
+
height: 48px !important; /* Even taller for small screens */
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
}
|