1
- body {
1
+ . e-hotel-book {
2
2
margin : 0 ;
3
3
font-family : "Segoe UI" ;
4
4
font-weight : 400 ;
@@ -16,10 +16,10 @@ body {
16
16
}
17
17
18
18
.e-title-bar {
19
- background-color : # ffffff ;
19
+ background-color : # 111827 ;
20
20
padding : 20px 32px ;
21
21
box-shadow : none;
22
- border-bottom : 3px solid # aedbf9 !important ;
22
+ border-bottom : 3px solid # 6366f1 !important ;
23
23
display : flex;
24
24
align-items : center;
25
25
}
38
38
}
39
39
40
40
.e-menu-button ::before {
41
- content : "\e94c " ;
42
- color : # 333 ;
43
- font-size : 17 px ;
41
+ content : "\e721 " ;
42
+ color : # ffffff ;
43
+ font-size : 20 px ;
44
44
font-family : "e-icons" ;
45
45
cursor : pointer;
46
46
}
@@ -55,16 +55,16 @@ body {
55
55
}
56
56
57
57
.e-side-bar-close-button ::before {
58
- content : "\e7a7 " ;
59
- color : # 333 ;
60
- font-size : 17 px ;
58
+ content : "\e7e7 " ;
59
+ color : # ffffff ;
60
+ font-size : 20 px ;
61
61
font-family : "e-icons" ;
62
62
margin-left : 15px ;
63
63
cursor : pointer;
64
64
}
65
65
66
66
.e-side-bar-operation-container {
67
- background-color : # ffffff ;
67
+ background-color : # 111827 ;
68
68
width : 260px ;
69
69
}
70
70
@@ -83,13 +83,13 @@ body {
83
83
.e-line-separator ,
84
84
.e-data-line-separator {
85
85
width : 95% ;
86
- background-color : # EAEAEA ;
86
+ background-color : # ffffff ;
87
87
padding : 1px 0px ;
88
88
margin : 10px auto;
89
89
}
90
90
91
91
.e-app-container {
92
- background-color : # F0F4F6 ;
92
+ background-color : # 31353e ;
93
93
width : 100% ;
94
94
}
95
95
@@ -126,14 +126,14 @@ body {
126
126
127
127
.e-title-text {
128
128
font-weight : 600 ;
129
- color : # 333333 ;
129
+ color : # ffffff ;
130
130
}
131
131
132
132
.e-header-text {
133
133
text-align : center;
134
134
padding : 10px ;
135
135
font-weight : 600 ;
136
- color : # 333333 ;
136
+ color : # ffffff ;
137
137
}
138
138
139
139
.e-headercell .e-header-text {
@@ -142,16 +142,41 @@ body {
142
142
143
143
.e-semi-header-text {
144
144
font-weight : 600 ;
145
- color : # 333333 ;
145
+ color : # ffffff ;
146
+ }
147
+
148
+ .e-semi-title-header-text {
149
+ font-weight : 200 ;
150
+ color : # ffffff ;
146
151
}
147
152
148
153
.e-semi-bold-header-text {
154
+ font-weight : 700 ;
155
+ color : # 22d3ee ;
156
+ font-size : 24px ;
157
+ }
158
+
159
+ .e-semi-bold-title-header-text {
149
160
font-weight : 600 ;
150
- color : # 333333 ;
161
+ color : # ffffff ;
162
+ }
163
+
164
+ .e-rowcell .e-grid-hotel-name {
165
+ font-weight : 700 ;
166
+ font-size : 18px ;
167
+ }
168
+
169
+ .e-rowcell .e-grid-room-name {
170
+ font-weight : 600 ;
171
+ font-size : 17px ;
172
+ }
173
+
174
+ .e-rowcell .e-grid-date {
175
+ font-weight : 500 ;
151
176
}
152
177
153
178
.e-light-blue-border-bottom {
154
- border-bottom : 3px solid # e0f2fe !important ;
179
+ border-bottom : 3px solid # 6366f1 !important ;
155
180
}
156
181
157
182
.templateRow td {
@@ -160,14 +185,14 @@ body {
160
185
161
186
.e-rowtemplate-border-applier {
162
187
box-shadow : none;
163
- border : 1px solid # EAEAEA !important ;
188
+ border : 1px solid # ffffff !important ;
164
189
}
165
190
166
191
.e-room-not-available-cover {
167
192
position : absolute;
168
193
width : calc (100% - 2px );
169
194
height : 100% ;
170
- background-color : # f2f2f2 ;
195
+ background-color : # 4b5563 ;
171
196
opacity : 0.5 ;
172
197
z-index : 1000 ;
173
198
}
@@ -214,17 +239,23 @@ body {
214
239
padding-right : 15px ;
215
240
}
216
241
242
+ .normal-text-color {
243
+ color : # e5e7eb ;
244
+ }
245
+
246
+ .normal-hint-text-color {
247
+ color : # 9ca3af ;
248
+ }
249
+
217
250
.e-map-text-spacer {
218
251
margin-left : 10px ;
219
252
}
220
253
221
254
.e-map-text-styler {
222
- color : # 008ae6 ;
223
255
cursor : pointer;
224
256
}
225
257
226
258
.e-address-text-styler {
227
- color : # 008ae6 ;
228
259
text-decoration : underline;
229
260
}
230
261
@@ -237,6 +268,13 @@ body {
237
268
padding-bottom : 0px ;
238
269
}
239
270
271
+ .e-custom-rating-color .e-rating-container .e-rating-item-container .e-rating-selected .e-rating-icon {
272
+ background : linear-gradient (to right, # ffa600 var (--rating-value ), # ffa600 var (--rating-value ));
273
+ -webkit-background-clip : text;
274
+ -webkit-text-fill-color : transparent;
275
+ -webkit-text-stroke : 1px # ffa600 ;
276
+ }
277
+
240
278
.e-rating-container .e-rating-item-container {
241
279
font-size : 16px ;
242
280
}
@@ -272,7 +310,8 @@ body {
272
310
273
311
.e-cost-styler {
274
312
font-weight : 600 ;
275
- color : # 333333 ;
313
+ color : # ffffff ;
314
+ font-size : 24px ;
276
315
}
277
316
278
317
.e-book-button {
@@ -293,7 +332,7 @@ body {
293
332
}
294
333
295
334
.e-details-container {
296
- background-color : # F0F4F6 ;
335
+ background-color : # 31353e ;
297
336
padding-top : 30px ;
298
337
}
299
338
@@ -325,10 +364,10 @@ body {
325
364
}
326
365
327
366
.e-back-button ::before {
328
- content : "\e610 " ;
367
+ content : "\e773 " ;
329
368
color : black;
330
369
padding : 5px ;
331
- font-size : 17 px ;
370
+ font-size : 20 px ;
332
371
font-family : "e-icons" ;
333
372
margin : 10px ;
334
373
cursor : pointer;
@@ -352,22 +391,23 @@ body {
352
391
353
392
.e-details-info-container {
354
393
display : flex;
355
- background-color : # ffffff ;
394
+ background-color : # 111827 ;
356
395
margin-top : 30px ;
357
396
}
358
397
359
398
.e-booking-details-container {
360
- width : 100 % ;
361
- border-left : 5px solid # F0F4F6 !important ;
362
- border-right : 5px solid # F0F4F6 !important ;
399
+ flex : 3 ;
400
+ border-left : 5px solid # 31353e !important ;
401
+ border-right : 5px solid # 31353e !important ;
363
402
}
364
403
365
404
.e-booking-details-separator {
366
405
padding : 10px 15px ;
367
406
}
368
407
369
408
.e-hotel-details-container {
370
- border-right : 5px solid # F0F4F6 !important ;
409
+ flex : 1 ;
410
+ border-right : 5px solid # 31353e !important ;
371
411
}
372
412
373
413
.e-hotel-details-side-bar-separator {
@@ -396,23 +436,21 @@ body {
396
436
padding-left : 0px ;
397
437
}
398
438
399
- .e-chip .e-outline {
400
- margin-left : 0px ;
439
+ .e-chip .e-info {
440
+ margin : 6 px 6 px 0 px 0px ;
401
441
}
402
442
403
- @import '../node_modules/@syncfusion/ej2-base/styles/fabric.css' ;
404
- @import '../node_modules/@syncfusion/ej2-buttons/styles/fabric.css' ;
405
- @import '../node_modules/@syncfusion/ej2-calendars/styles/fabric.css' ;
406
- @import '../node_modules/@syncfusion/ej2-dropdowns/styles/fabric.css' ;
407
- @import '../node_modules/@syncfusion/ej2-inputs/styles/fabric.css' ;
408
- @import '../node_modules/@syncfusion/ej2-navigations/styles/fabric.css' ;
409
- @import '../node_modules/@syncfusion/ej2-popups/styles/fabric.css' ;
410
- @import '../node_modules/@syncfusion/ej2-splitbuttons/styles/fabric.css' ;
411
- @import "../node_modules/@syncfusion/ej2-react-grids/styles/fabric.css" ;
412
- @import "../node_modules/@syncfusion/ej2-icons/styles/fabric.css" ;
413
- @import "../node_modules/@syncfusion/ej2-lists/styles/fabric.css" ;
414
- @import '../node_modules/@syncfusion/ej2-notifications/styles/fabric.css' ;
443
+ @media only screen and (max-width : 1120px ) {
444
+
445
+ .e-booking-details-container {
446
+ flex : 2 ;
447
+ }
448
+
449
+ .e-hotel-details-container {
450
+ flex : 1 ;
451
+ }
415
452
453
+ }
416
454
417
455
@media only screen and (max-width : 1050px ) {
418
456
@@ -463,13 +501,13 @@ body {
463
501
464
502
.e-booking-details-container {
465
503
width : 100% ;
466
- border-left : 0px solid # F0F4F6 !important ;
467
- border-right : 0px solid # F0F4F6 !important ;
468
- border-bottom : 5px solid # F0F4F6 !important ;
504
+ border-left : 0px solid # 31353e !important ;
505
+ border-right : 0px solid # 31353e !important ;
506
+ border-bottom : 5px solid # 31353e !important ;
469
507
}
470
508
471
509
.e-hotel-details-container {
472
- border-right : 0px solid # F0F4F6 !important ;
510
+ border-right : 0px solid # 31353e !important ;
473
511
}
474
512
}
475
513
0 commit comments