1- # logo {
2- width : 25% ;
1+ # logo {
2+ width : 200px ;
3+ height : auto;
34}
45
56/*#navBar{
89 background: -o-linear-gradient(#a4dbf5, #8cc5e0);
910}*/
1011# navBar {
11- background : # 0daeff ; /* Old browsers */
12- background : -moz-linear-gradient (-45deg , # 0daeff 0% , # 3939ad 30% ); /* FF3.6-15 */
13- background : -webkit-linear-gradient (-45deg , # 0daeff 0% , # 3939ad 30% ); /* Chrome10-25,Safari5.1-6 */
14- background : linear-gradient (-45deg , # 0daeff 0% , # 3939ad 30% ); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
15- filter : progid:DXImageTransform.Microsoft.gradient( startColorstr='#3939ad', endColorstr='#0daeff', GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
12+ background : linear-gradient (135deg , # 4158D0 0% , # C850C0 46% , # FFCC70 100% );
13+ box-shadow : 0 2px 4px rgba (0 , 0 , 0 , 0.1 );
14+ padding : 0.5rem 0 ;
1615}
1716.navbar-brand {
18- margin : 0 1rem 0 1rem ;
17+ margin : 0 1rem ;
18+ color : # fff !important ;
19+ font-weight : 500 ;
1920}
20- # mainRow {
21- margin : 1 % ;
21+ # mainRow {
22+ margin : 2 rem 1.5 rem ;
2223}
2324
24- # tableHead {
25- background : -moz-linear-gradient (# a4dbf5, # 8cc5e0 );
26- background : -webkit-linear-gradient (# a4dbf5, # 8cc5e0 );
27- background : -o-linear-gradient (# a4dbf5, # 8cc5e0 );
25+ # tableHead {
26+ background : # f8f9fa ;
27+ color : # 2c3e50 ;
28+ font-weight : 500 ;
29+ border-radius : 8px 8px 0 0 ;
2830}
2931
3032# uploadBoxLabel , # htmlEditorLable {
3436}
3537
3638.my-drop-zone {
37- border : dotted 3px lightgray;
39+ border : 2px dashed # cbd5e0 ;
40+ border-radius : 8px ;
41+ padding : 2rem ;
42+ background : # f7fafc ;
43+ transition : all 0.3s ease;
3844 margin-bottom : 2% ;
3945}
4046
41- # queueProg {
47+ .my-drop-zone : hover {
48+ border-color : # 4158D0 ;
49+ background : # f0f5ff ;
50+ }
51+
52+ # queueProg {
4253 margin-bottom : 2% ;
54+ height : 6px ;
55+ border-radius : 3px ;
4356}
4457
4558# htmlEditorContent {
98111}
99112
100113a .nav-link {
101- color : # add8e6 ;
114+ color : rgba (255 , 255 , 255 , 0.9 ) !important ;
115+ font-weight : 500 ;
116+ padding : 0.5rem 1rem ;
117+ transition : all 0.2s ease;
102118}
103119a .nav-link : hover {
104- color : # E4F2F7 ;
120+ color : # ffffff !important ;
121+ transform : translateY (-1px );
105122}
106123
107124.point-events {
@@ -115,62 +132,141 @@ a.nav-link:hover {
115132 border-bottom : none;
116133}
117134.form-control {
118- padding : 0 .5rem ;
119- border : 1px solid # eeeeee ;
120- color : # 777 ;
121- font-size : .95em ;
135+ padding : 0.5rem 1rem ;
136+ border : 1px solid # e2e8f0 ;
137+ border-radius : 6px ;
138+ color : # 4a5568 ;
139+ font-size : 0.95rem ;
140+ transition : all 0.3s ease;
122141}
123- .form-control [readonly ] {
124- background-color : transparent;
142+ .form-control : focus {
143+ border-color : # 4158D0 ;
144+ box-shadow : 0 0 0 3px rgba (66 , 153 , 225 , 0.15 );
145+ }
146+ .form-control [readonly ] {
147+ background-color : # f8f9fa ;
125148}
126149a {
127- color : # 6C6CA4 ;
128- text-decoration : none;
129- background-color : transparent;
130- -webkit-text-decoration-skip : objects;
150+ color : # 4158D0 ;
151+ transition : color 0.2s ease;
131152}
132153a : hover {
133- color : # 8989B6 ;
134- text-decoration : none;
135- background-color : transparent;
136- -webkit-text-decoration-skip : objects;
154+ color : # C850C0 ;
137155}
138156
139- # tableHead {
140- background : # 8989B6 ;
141- color : # E1E1EC ;
157+ .table {
158+ background : white;
159+ border-radius : 8px ;
160+ box-shadow : 0 0 20px rgba (0 , 0 , 0 , 0.05 );
161+ margin-bottom : 2rem ;
142162}
143163.table td , .table th {
144- padding : .15 em ;
145- vertical-align : top ;
146- border-top : 1px solid # e9ecef ;
164+ padding : .75 rem ;
165+ vertical-align : middle ;
166+ border-top : 1px solid # edf2f7 ;
147167}
148168.table thead th {
149- vertical-align : bottom;
150- border-bottom : 1px solid # e9ecef ;
151- font-weight : 400 ;
169+ border-bottom : 2px solid # edf2f7 ;
170+ font-weight : 600 ;
171+ font-size : 0.875rem ;
172+ text-transform : uppercase;
173+ letter-spacing : 0.5px ;
152174}
153175
154176.table td {
155- font-size : 14 px ;
156- color : # 666666 ;
177+ font-size : 0.9 rem ;
178+ color : # 4a5568 ;
157179}
158180.list-group-item {
159- padding : .2em 1.25rem ;
181+ padding : 0.75rem 1.25rem ;
182+ border : 1px solid # edf2f7 ;
183+ margin-bottom : -1px ;
184+ background-color : white;
185+ transition : all 0.2s ease;
186+ }
187+ .list-group-item : hover {
188+ background-color : # f7fafc ;
160189}
161190
162- i .fa .fa-file {
163- color : # 6C6CA4 !important ;
191+ i .fa .fa-file ,
192+ i .fa .fa-minus ,
193+ i .fa .fa-plus {
194+ color : # 4158D0 !important ;
164195}
165- i .fa .fa-minus {
166- color : # 6C6CA4 !important ;
196+ .bg-lightgray {
197+ background : # f8f9fa ;
198+ border-radius : 8px ;
167199}
168- i .fa .fa-plus {
169- color : # 6C6CA4 !important ;
200+
201+ .progress-bar {
202+ background : linear-gradient (135deg , # 4158D0 0% , # C850C0 100% );
170203}
171- .list-group-item {
172- background-color : transparent;
204+
205+ /* Card styles */
206+ .card {
207+ border : none;
208+ border-radius : 8px ;
209+ box-shadow : 0 0 20px rgba (0 , 0 , 0 , 0.05 );
210+ }
211+
212+ .card-header {
213+ background : # f8f9fa ;
214+ border-bottom : 1px solid # edf2f7 ;
215+ padding : 1rem 1.25rem ;
216+ font-weight : 500 ;
217+ border-radius : 8px 8px 0 0 ;
173218}
219+
220+ /* Navigation link styles */
221+ a .nav-link {
222+ color : rgba (255 , 255 , 255 , 0.9 ) !important ;
223+ font-weight : 500 ;
224+ padding : 0.5rem 1rem ;
225+ transition : all 0.2s ease;
226+ }
227+
228+ a .nav-link : hover {
229+ color : # ffffff !important ;
230+ transform : translateY (-1px );
231+ }
232+
233+ /* Utility classes */
174234.bg-lightgray {
175- background : # F9F9FA ;
235+ background : # f8f9fa ;
236+ border-radius : 8px ;
237+ }
238+
239+ /* Custom scrollbar */
240+ ::-webkit-scrollbar {
241+ width : 8px ;
242+ }
243+
244+ ::-webkit-scrollbar-track {
245+ background : # f1f1f1 ;
246+ }
247+
248+ ::-webkit-scrollbar-thumb {
249+ background : # c8c8c8 ;
250+ border-radius : 4px ;
251+ }
252+
253+ ::-webkit-scrollbar-thumb : hover {
254+ background : # a8a8a8 ;
255+ }
256+
257+ .btn {
258+ padding : 0.5rem 1rem ;
259+ border-radius : 6px ;
260+ font-weight : 500 ;
261+ transition : all 0.3s ease;
262+ }
263+
264+ .btn-primary {
265+ background : linear-gradient (135deg , # 4158D0 0% , # C850C0 100% );
266+ border : none;
267+ }
268+
269+ .btn-primary : hover {
270+ transform : translateY (-1px );
271+ box-shadow : 0 4px 12px rgba (65 , 88 , 208 , 0.15 );
176272}
0 commit comments