@syncfusion/blazor-themes 24.2.6 → 24.2.7

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.
Files changed (54) hide show
  1. package/SCSS-Themes/bootstrap-dark.scss +58 -1
  2. package/SCSS-Themes/bootstrap.scss +58 -1
  3. package/SCSS-Themes/bootstrap4.scss +60 -3
  4. package/SCSS-Themes/bootstrap5-dark.scss +58 -1
  5. package/SCSS-Themes/bootstrap5.scss +58 -1
  6. package/SCSS-Themes/buttons/button/tailwind-dark.scss +1 -1
  7. package/SCSS-Themes/buttons/button/tailwind.scss +1 -1
  8. package/SCSS-Themes/fabric-dark.scss +58 -1
  9. package/SCSS-Themes/fabric.scss +58 -1
  10. package/SCSS-Themes/fluent-dark.scss +60 -3
  11. package/SCSS-Themes/fluent.scss +60 -3
  12. package/SCSS-Themes/grids/grid/bootstrap4.scss +2 -2
  13. package/SCSS-Themes/grids/grid/fluent-dark.scss +2 -2
  14. package/SCSS-Themes/grids/grid/fluent.scss +2 -2
  15. package/SCSS-Themes/highcontrast.scss +58 -1
  16. package/SCSS-Themes/material-dark.scss +58 -1
  17. package/SCSS-Themes/material.scss +58 -1
  18. package/SCSS-Themes/material3-dark.scss +58 -1
  19. package/SCSS-Themes/material3.scss +58 -1
  20. package/SCSS-Themes/pivotview/pivotview/bootstrap-dark.scss +1 -1
  21. package/SCSS-Themes/pivotview/pivotview/bootstrap.scss +1 -1
  22. package/SCSS-Themes/pivotview/pivotview/bootstrap4.scss +1 -1
  23. package/SCSS-Themes/pivotview/pivotview/bootstrap5-dark.scss +1 -1
  24. package/SCSS-Themes/pivotview/pivotview/bootstrap5.scss +1 -1
  25. package/SCSS-Themes/pivotview/pivotview/fabric-dark.scss +1 -1
  26. package/SCSS-Themes/pivotview/pivotview/fabric.scss +1 -1
  27. package/SCSS-Themes/pivotview/pivotview/fluent-dark.scss +1 -1
  28. package/SCSS-Themes/pivotview/pivotview/fluent.scss +1 -1
  29. package/SCSS-Themes/pivotview/pivotview/highcontrast.scss +1 -1
  30. package/SCSS-Themes/pivotview/pivotview/material-dark.scss +1 -1
  31. package/SCSS-Themes/pivotview/pivotview/material.scss +1 -1
  32. package/SCSS-Themes/pivotview/pivotview/material3-dark.scss +1 -1
  33. package/SCSS-Themes/pivotview/pivotview/material3.scss +1 -1
  34. package/SCSS-Themes/pivotview/pivotview/tailwind-dark.scss +1 -1
  35. package/SCSS-Themes/pivotview/pivotview/tailwind.scss +1 -1
  36. package/SCSS-Themes/schedule/schedule/bootstrap-dark.scss +57 -0
  37. package/SCSS-Themes/schedule/schedule/bootstrap.scss +57 -0
  38. package/SCSS-Themes/schedule/schedule/bootstrap4.scss +57 -0
  39. package/SCSS-Themes/schedule/schedule/bootstrap5-dark.scss +57 -0
  40. package/SCSS-Themes/schedule/schedule/bootstrap5.scss +57 -0
  41. package/SCSS-Themes/schedule/schedule/fabric-dark.scss +57 -0
  42. package/SCSS-Themes/schedule/schedule/fabric.scss +57 -0
  43. package/SCSS-Themes/schedule/schedule/fluent-dark.scss +57 -0
  44. package/SCSS-Themes/schedule/schedule/fluent.scss +57 -0
  45. package/SCSS-Themes/schedule/schedule/highcontrast.scss +57 -0
  46. package/SCSS-Themes/schedule/schedule/material-dark.scss +57 -0
  47. package/SCSS-Themes/schedule/schedule/material.scss +57 -0
  48. package/SCSS-Themes/schedule/schedule/material3-dark.scss +57 -0
  49. package/SCSS-Themes/schedule/schedule/material3.scss +57 -0
  50. package/SCSS-Themes/schedule/schedule/tailwind-dark.scss +57 -0
  51. package/SCSS-Themes/schedule/schedule/tailwind.scss +57 -0
  52. package/SCSS-Themes/tailwind-dark.scss +59 -2
  53. package/SCSS-Themes/tailwind.scss +59 -2
  54. package/package.json +1 -1
@@ -114402,7 +114402,7 @@ $pivotpager-string-maindiv-font-color: rgba($content-text-color-alt1) !default;
114402
114402
 
114403
114403
  th.e-group-row .e-axis-row {
114404
114404
  display: inline-block;
114405
- height: 100%;
114405
+ height: auto;
114406
114406
  vertical-align: top;
114407
114407
  width: 100%;
114408
114408
  }
@@ -117730,6 +117730,7 @@ $schedule-tbar-right-items-btn-border-radius: 20px !default;
117730
117730
  $schedule-tbar-right-active-items-btn-border: 1px solid rgba($primary) !default;
117731
117731
  $schedule-device-tbar-right-items-btn-border-radius: 0 !default;
117732
117732
  $schedule-device-tbar-right-items-btn-border: none !default;
117733
+ $schedule-device-font-size: 8px !default;
117733
117734
 
117734
117735
  // view definitions
117735
117736
  $schedule-timeline-header-cells-height: 40px !default;
@@ -118072,6 +118073,28 @@ $schedule-bgr-tbar-btn-text-font-size: $schedule-header-nrml-font-size !default;
118072
118073
  }
118073
118074
  }
118074
118075
 
118076
+ @media screen and (max-width: 320px) {
118077
+ .e-schedule-toolbar {
118078
+ .e-toolbar-pop {
118079
+ width: 100%;
118080
+
118081
+ .e-toolbar-item .e-tbar-btn.e-btn {
118082
+ padding-left: 7px;
118083
+ }
118084
+
118085
+ &.e-rtl {
118086
+ .e-toolbar-item .e-tbar-btn.e-btn {
118087
+ padding-right: 7px;
118088
+ }
118089
+ }
118090
+ }
118091
+
118092
+ .e-tbar-btn .e-tbar-btn-text {
118093
+ font-size: $schedule-device-font-size;
118094
+ }
118095
+ }
118096
+ }
118097
+
118075
118098
  .e-schedule-resource-toolbar {
118076
118099
  background: $schedule-tbar-default-bg;
118077
118100
  border-bottom: $schedule-tbar-border-bottom-size;
@@ -120965,7 +120988,24 @@ $schedule-bgr-tbar-btn-text-font-size: $schedule-header-nrml-font-size !default;
120965
120988
  }
120966
120989
  }
120967
120990
  }
120991
+
120992
+ /*! schedule event window for smaller viewports*/
120993
+ @media screen and (max-width: 320px) {
120994
+ .e-schedule-dialog.e-popup.e-popup-open {
120995
+ max-height: 350px;
120996
+ min-width: 100%;
120997
+ }
120968
120998
 
120999
+ .e-schedule-dialog {
121000
+ .e-all-day-container {
121001
+ padding-bottom: 10px;
121002
+ }
121003
+
121004
+ .e-all-day-time-zone-row {
121005
+ display: block;
121006
+ }
121007
+ }
121008
+ }
120969
121009
  .e-ddl.e-popup {
120970
121010
  .e-resource-template {
120971
121011
  display: flex;
@@ -121649,6 +121689,23 @@ $schedule-bgr-tbar-btn-text-font-size: $schedule-header-nrml-font-size !default;
121649
121689
  }
121650
121690
  }
121651
121691
 
121692
+ /*! schedule quick popup for smaller viewports */
121693
+ @media screen and (max-width: 320px) {
121694
+ .e-quick-popup-wrapper {
121695
+ min-width: 100%;
121696
+
121697
+ .e-popup-footer {
121698
+ padding-left: 5px;
121699
+ }
121700
+
121701
+ &.e-rtl {
121702
+ .e-popup-footer {
121703
+ padding-right: 5px;
121704
+ }
121705
+ }
121706
+ }
121707
+ }
121708
+
121652
121709
  .e-bigger .e-quick-popup-wrapper {
121653
121710
  .e-cell-popup .e-popup-content .e-popup-table .e-subject {
121654
121711
  font-size: 24px;
@@ -2162,7 +2162,7 @@ $pivotpager-single-size-title-padding: 8px !default;
2162
2162
 
2163
2163
  th.e-group-row .e-axis-row {
2164
2164
  display: inline-block;
2165
- height: 100%;
2165
+ height: auto;
2166
2166
  vertical-align: top;
2167
2167
  width: 100%;
2168
2168
  }
@@ -2159,7 +2159,7 @@ $pivotpager-single-size-title-padding: 8px !default;
2159
2159
 
2160
2160
  th.e-group-row .e-axis-row {
2161
2161
  display: inline-block;
2162
- height: 100%;
2162
+ height: auto;
2163
2163
  vertical-align: top;
2164
2164
  width: 100%;
2165
2165
  }
@@ -2159,7 +2159,7 @@ $pivotpager-single-size-title-padding: 8px !default;
2159
2159
 
2160
2160
  th.e-group-row .e-axis-row {
2161
2161
  display: inline-block;
2162
- height: 100%;
2162
+ height: auto;
2163
2163
  vertical-align: top;
2164
2164
  width: 100%;
2165
2165
  }
@@ -2164,7 +2164,7 @@ $pivotpager-single-size-title-padding: 8px !default;
2164
2164
 
2165
2165
  th.e-group-row .e-axis-row {
2166
2166
  display: inline-block;
2167
- height: 100%;
2167
+ height: auto;
2168
2168
  vertical-align: top;
2169
2169
  width: 100%;
2170
2170
  }
@@ -2164,7 +2164,7 @@ $pivotpager-single-size-title-padding: 8px !default;
2164
2164
 
2165
2165
  th.e-group-row .e-axis-row {
2166
2166
  display: inline-block;
2167
- height: 100%;
2167
+ height: auto;
2168
2168
  vertical-align: top;
2169
2169
  width: 100%;
2170
2170
  }
@@ -2161,7 +2161,7 @@ $pivotpager-single-size-title-padding: 4px !default;
2161
2161
 
2162
2162
  th.e-group-row .e-axis-row {
2163
2163
  display: inline-block;
2164
- height: 100%;
2164
+ height: auto;
2165
2165
  vertical-align: top;
2166
2166
  width: 100%;
2167
2167
  }
@@ -2158,7 +2158,7 @@ $pivotpager-single-size-title-padding: 4px !default;
2158
2158
 
2159
2159
  th.e-group-row .e-axis-row {
2160
2160
  display: inline-block;
2161
- height: 100%;
2161
+ height: auto;
2162
2162
  vertical-align: top;
2163
2163
  width: 100%;
2164
2164
  }
@@ -2164,7 +2164,7 @@ $pivotpager-single-size-title-padding: 8px !default;
2164
2164
 
2165
2165
  th.e-group-row .e-axis-row {
2166
2166
  display: inline-block;
2167
- height: 100%;
2167
+ height: auto;
2168
2168
  vertical-align: top;
2169
2169
  width: 100%;
2170
2170
  }
@@ -2164,7 +2164,7 @@ $pivotpager-single-size-title-padding: 8px !default;
2164
2164
 
2165
2165
  th.e-group-row .e-axis-row {
2166
2166
  display: inline-block;
2167
- height: 100%;
2167
+ height: auto;
2168
2168
  vertical-align: top;
2169
2169
  width: 100%;
2170
2170
  }
@@ -2157,7 +2157,7 @@ $pivotpager-single-size-title-padding: 4px !default;
2157
2157
 
2158
2158
  th.e-group-row .e-axis-row {
2159
2159
  display: inline-block;
2160
- height: 100%;
2160
+ height: auto;
2161
2161
  vertical-align: top;
2162
2162
  width: 100%;
2163
2163
  }
@@ -2165,7 +2165,7 @@ $pivotpager-single-size-title-padding: 14px !default;
2165
2165
 
2166
2166
  th.e-group-row .e-axis-row {
2167
2167
  display: inline-block;
2168
- height: 100%;
2168
+ height: auto;
2169
2169
  vertical-align: top;
2170
2170
  width: 100%;
2171
2171
  }
@@ -2161,7 +2161,7 @@ $pivotpager-single-size-title-padding: 14px !default;
2161
2161
 
2162
2162
  th.e-group-row .e-axis-row {
2163
2163
  display: inline-block;
2164
- height: 100%;
2164
+ height: auto;
2165
2165
  vertical-align: top;
2166
2166
  width: 100%;
2167
2167
  }
@@ -2167,7 +2167,7 @@ $pivotpager-string-maindiv-font-color: rgba($content-text-color-alt1) !default;
2167
2167
 
2168
2168
  th.e-group-row .e-axis-row {
2169
2169
  display: inline-block;
2170
- height: 100%;
2170
+ height: auto;
2171
2171
  vertical-align: top;
2172
2172
  width: 100%;
2173
2173
  }
@@ -2167,7 +2167,7 @@ $pivotpager-string-maindiv-font-color: rgba($content-text-color-alt1) !default;
2167
2167
 
2168
2168
  th.e-group-row .e-axis-row {
2169
2169
  display: inline-block;
2170
- height: 100%;
2170
+ height: auto;
2171
2171
  vertical-align: top;
2172
2172
  width: 100%;
2173
2173
  }
@@ -2164,7 +2164,7 @@ $pivotpager-single-size-title-padding: 8px !default;
2164
2164
 
2165
2165
  th.e-group-row .e-axis-row {
2166
2166
  display: inline-block;
2167
- height: 100%;
2167
+ height: auto;
2168
2168
  vertical-align: top;
2169
2169
  width: 100%;
2170
2170
  }
@@ -2164,7 +2164,7 @@ $pivotpager-single-size-title-padding: 8px !default;
2164
2164
 
2165
2165
  th.e-group-row .e-axis-row {
2166
2166
  display: inline-block;
2167
- height: 100%;
2167
+ height: auto;
2168
2168
  vertical-align: top;
2169
2169
  width: 100%;
2170
2170
  }
@@ -195,6 +195,7 @@ $schedule-tbar-right-items-btn-border-radius: 0 !default;
195
195
  $schedule-tbar-right-active-items-btn-border: none !default;
196
196
  $schedule-device-tbar-right-items-btn-border-radius: 0 !default;
197
197
  $schedule-device-tbar-right-items-btn-border: none !default;
198
+ $schedule-device-font-size: 8px !default;
198
199
 
199
200
  $schedule-content-nrml-font-text-transform: initial !default;
200
201
  $schedule-header-hover-border-radius: 4px !default;
@@ -542,6 +543,28 @@ $schedule-tree-content-color: #fff !default;
542
543
  }
543
544
  }
544
545
 
546
+ @media screen and (max-width: 320px) {
547
+ .e-schedule-toolbar {
548
+ .e-toolbar-pop {
549
+ width: 100%;
550
+
551
+ .e-toolbar-item .e-tbar-btn.e-btn {
552
+ padding-left: 7px;
553
+ }
554
+
555
+ &.e-rtl {
556
+ .e-toolbar-item .e-tbar-btn.e-btn {
557
+ padding-right: 7px;
558
+ }
559
+ }
560
+ }
561
+
562
+ .e-tbar-btn .e-tbar-btn-text {
563
+ font-size: $schedule-device-font-size;
564
+ }
565
+ }
566
+ }
567
+
545
568
  .e-schedule-resource-toolbar {
546
569
  background: $schedule-tbar-default-bg;
547
570
  border-bottom: $schedule-tbar-border-bottom-size;
@@ -3435,7 +3458,24 @@ $schedule-tree-content-color: #fff !default;
3435
3458
  }
3436
3459
  }
3437
3460
  }
3461
+
3462
+ /*! schedule event window for smaller viewports*/
3463
+ @media screen and (max-width: 320px) {
3464
+ .e-schedule-dialog.e-popup.e-popup-open {
3465
+ max-height: 350px;
3466
+ min-width: 100%;
3467
+ }
3438
3468
 
3469
+ .e-schedule-dialog {
3470
+ .e-all-day-container {
3471
+ padding-bottom: 10px;
3472
+ }
3473
+
3474
+ .e-all-day-time-zone-row {
3475
+ display: block;
3476
+ }
3477
+ }
3478
+ }
3439
3479
  .e-ddl.e-popup {
3440
3480
  .e-resource-template {
3441
3481
  display: flex;
@@ -4119,6 +4159,23 @@ $schedule-tree-content-color: #fff !default;
4119
4159
  }
4120
4160
  }
4121
4161
 
4162
+ /*! schedule quick popup for smaller viewports */
4163
+ @media screen and (max-width: 320px) {
4164
+ .e-quick-popup-wrapper {
4165
+ min-width: 100%;
4166
+
4167
+ .e-popup-footer {
4168
+ padding-left: 5px;
4169
+ }
4170
+
4171
+ &.e-rtl {
4172
+ .e-popup-footer {
4173
+ padding-right: 5px;
4174
+ }
4175
+ }
4176
+ }
4177
+ }
4178
+
4122
4179
  .e-bigger .e-quick-popup-wrapper {
4123
4180
  .e-cell-popup .e-popup-content .e-popup-table .e-subject {
4124
4181
  font-size: 24px;
@@ -192,6 +192,7 @@ $schedule-tbar-right-items-btn-border-radius: 0 !default;
192
192
  $schedule-tbar-right-active-items-btn-border: none !default;
193
193
  $schedule-device-tbar-right-items-btn-border-radius: 0 !default;
194
194
  $schedule-device-tbar-right-items-btn-border: none !default;
195
+ $schedule-device-font-size: 8px !default;
195
196
 
196
197
  $schedule-timezone-enable-nrml-height: 60px !default;
197
198
  $schedule-timezone-enable-bgr-height: 70px !default;
@@ -542,6 +543,28 @@ $schedule-tree-content-color: $shadow !default;
542
543
  }
543
544
  }
544
545
 
546
+ @media screen and (max-width: 320px) {
547
+ .e-schedule-toolbar {
548
+ .e-toolbar-pop {
549
+ width: 100%;
550
+
551
+ .e-toolbar-item .e-tbar-btn.e-btn {
552
+ padding-left: 7px;
553
+ }
554
+
555
+ &.e-rtl {
556
+ .e-toolbar-item .e-tbar-btn.e-btn {
557
+ padding-right: 7px;
558
+ }
559
+ }
560
+ }
561
+
562
+ .e-tbar-btn .e-tbar-btn-text {
563
+ font-size: $schedule-device-font-size;
564
+ }
565
+ }
566
+ }
567
+
545
568
  .e-schedule-resource-toolbar {
546
569
  background: $schedule-tbar-default-bg;
547
570
  border-bottom: $schedule-tbar-border-bottom-size;
@@ -3435,7 +3458,24 @@ $schedule-tree-content-color: $shadow !default;
3435
3458
  }
3436
3459
  }
3437
3460
  }
3461
+
3462
+ /*! schedule event window for smaller viewports*/
3463
+ @media screen and (max-width: 320px) {
3464
+ .e-schedule-dialog.e-popup.e-popup-open {
3465
+ max-height: 350px;
3466
+ min-width: 100%;
3467
+ }
3438
3468
 
3469
+ .e-schedule-dialog {
3470
+ .e-all-day-container {
3471
+ padding-bottom: 10px;
3472
+ }
3473
+
3474
+ .e-all-day-time-zone-row {
3475
+ display: block;
3476
+ }
3477
+ }
3478
+ }
3439
3479
  .e-ddl.e-popup {
3440
3480
  .e-resource-template {
3441
3481
  display: flex;
@@ -4119,6 +4159,23 @@ $schedule-tree-content-color: $shadow !default;
4119
4159
  }
4120
4160
  }
4121
4161
 
4162
+ /*! schedule quick popup for smaller viewports */
4163
+ @media screen and (max-width: 320px) {
4164
+ .e-quick-popup-wrapper {
4165
+ min-width: 100%;
4166
+
4167
+ .e-popup-footer {
4168
+ padding-left: 5px;
4169
+ }
4170
+
4171
+ &.e-rtl {
4172
+ .e-popup-footer {
4173
+ padding-right: 5px;
4174
+ }
4175
+ }
4176
+ }
4177
+ }
4178
+
4122
4179
  .e-bigger .e-quick-popup-wrapper {
4123
4180
  .e-cell-popup .e-popup-content .e-popup-table .e-subject {
4124
4181
  font-size: 24px;
@@ -200,6 +200,7 @@ $schedule-tbar-right-items-btn-border-radius: 0 !default;
200
200
  $schedule-tbar-right-active-items-btn-border: none !default;
201
201
  $schedule-device-tbar-right-items-btn-border-radius: 0 !default;
202
202
  $schedule-device-tbar-right-items-btn-border: none !default;
203
+ $schedule-device-font-size: 8px !default;
203
204
 
204
205
  $schedule-content-nrml-font-text-transform: initial !default;
205
206
  $schedule-header-hover-border-radius: 4px !default;
@@ -545,6 +546,28 @@ $schedule-tbar-border-hover-color: darken($gray-600, 12.5%) !default;
545
546
  }
546
547
  }
547
548
 
549
+ @media screen and (max-width: 320px) {
550
+ .e-schedule-toolbar {
551
+ .e-toolbar-pop {
552
+ width: 100%;
553
+
554
+ .e-toolbar-item .e-tbar-btn.e-btn {
555
+ padding-left: 7px;
556
+ }
557
+
558
+ &.e-rtl {
559
+ .e-toolbar-item .e-tbar-btn.e-btn {
560
+ padding-right: 7px;
561
+ }
562
+ }
563
+ }
564
+
565
+ .e-tbar-btn .e-tbar-btn-text {
566
+ font-size: $schedule-device-font-size;
567
+ }
568
+ }
569
+ }
570
+
548
571
  .e-schedule-resource-toolbar {
549
572
  background: $schedule-tbar-default-bg;
550
573
  border-bottom: $schedule-tbar-border-bottom-size;
@@ -3438,7 +3461,24 @@ $schedule-tbar-border-hover-color: darken($gray-600, 12.5%) !default;
3438
3461
  }
3439
3462
  }
3440
3463
  }
3464
+
3465
+ /*! schedule event window for smaller viewports*/
3466
+ @media screen and (max-width: 320px) {
3467
+ .e-schedule-dialog.e-popup.e-popup-open {
3468
+ max-height: 350px;
3469
+ min-width: 100%;
3470
+ }
3441
3471
 
3472
+ .e-schedule-dialog {
3473
+ .e-all-day-container {
3474
+ padding-bottom: 10px;
3475
+ }
3476
+
3477
+ .e-all-day-time-zone-row {
3478
+ display: block;
3479
+ }
3480
+ }
3481
+ }
3442
3482
  .e-ddl.e-popup {
3443
3483
  .e-resource-template {
3444
3484
  display: flex;
@@ -4122,6 +4162,23 @@ $schedule-tbar-border-hover-color: darken($gray-600, 12.5%) !default;
4122
4162
  }
4123
4163
  }
4124
4164
 
4165
+ /*! schedule quick popup for smaller viewports */
4166
+ @media screen and (max-width: 320px) {
4167
+ .e-quick-popup-wrapper {
4168
+ min-width: 100%;
4169
+
4170
+ .e-popup-footer {
4171
+ padding-left: 5px;
4172
+ }
4173
+
4174
+ &.e-rtl {
4175
+ .e-popup-footer {
4176
+ padding-right: 5px;
4177
+ }
4178
+ }
4179
+ }
4180
+ }
4181
+
4125
4182
  .e-bigger .e-quick-popup-wrapper {
4126
4183
  .e-cell-popup .e-popup-content .e-popup-table .e-subject {
4127
4184
  font-size: 24px;
@@ -208,6 +208,7 @@ $schedule-tbar-right-items-btn-border-radius: 0 !default;
208
208
  $schedule-tbar-right-active-items-btn-border: none !default;
209
209
  $schedule-device-tbar-right-items-btn-border-radius: 0 !default;
210
210
  $schedule-device-tbar-right-items-btn-border: none !default;
211
+ $schedule-device-font-size: 8px !default;
211
212
 
212
213
  // view definitions
213
214
  $schedule-timeline-header-time-slots-bg: $schedule-tbar-default-bg !default;
@@ -552,6 +553,28 @@ $schedule-multiple-event-popup-icon-bg-color: $schedule-header-bg-color !default
552
553
  }
553
554
  }
554
555
 
556
+ @media screen and (max-width: 320px) {
557
+ .e-schedule-toolbar {
558
+ .e-toolbar-pop {
559
+ width: 100%;
560
+
561
+ .e-toolbar-item .e-tbar-btn.e-btn {
562
+ padding-left: 7px;
563
+ }
564
+
565
+ &.e-rtl {
566
+ .e-toolbar-item .e-tbar-btn.e-btn {
567
+ padding-right: 7px;
568
+ }
569
+ }
570
+ }
571
+
572
+ .e-tbar-btn .e-tbar-btn-text {
573
+ font-size: $schedule-device-font-size;
574
+ }
575
+ }
576
+ }
577
+
555
578
  .e-schedule-resource-toolbar {
556
579
  background: $schedule-tbar-default-bg;
557
580
  border-bottom: $schedule-tbar-border-bottom-size;
@@ -3445,7 +3468,24 @@ $schedule-multiple-event-popup-icon-bg-color: $schedule-header-bg-color !default
3445
3468
  }
3446
3469
  }
3447
3470
  }
3471
+
3472
+ /*! schedule event window for smaller viewports*/
3473
+ @media screen and (max-width: 320px) {
3474
+ .e-schedule-dialog.e-popup.e-popup-open {
3475
+ max-height: 350px;
3476
+ min-width: 100%;
3477
+ }
3448
3478
 
3479
+ .e-schedule-dialog {
3480
+ .e-all-day-container {
3481
+ padding-bottom: 10px;
3482
+ }
3483
+
3484
+ .e-all-day-time-zone-row {
3485
+ display: block;
3486
+ }
3487
+ }
3488
+ }
3449
3489
  .e-ddl.e-popup {
3450
3490
  .e-resource-template {
3451
3491
  display: flex;
@@ -4129,6 +4169,23 @@ $schedule-multiple-event-popup-icon-bg-color: $schedule-header-bg-color !default
4129
4169
  }
4130
4170
  }
4131
4171
 
4172
+ /*! schedule quick popup for smaller viewports */
4173
+ @media screen and (max-width: 320px) {
4174
+ .e-quick-popup-wrapper {
4175
+ min-width: 100%;
4176
+
4177
+ .e-popup-footer {
4178
+ padding-left: 5px;
4179
+ }
4180
+
4181
+ &.e-rtl {
4182
+ .e-popup-footer {
4183
+ padding-right: 5px;
4184
+ }
4185
+ }
4186
+ }
4187
+ }
4188
+
4132
4189
  .e-bigger .e-quick-popup-wrapper {
4133
4190
  .e-cell-popup .e-popup-content .e-popup-table .e-subject {
4134
4191
  font-size: 24px;
@@ -208,6 +208,7 @@ $schedule-tbar-right-items-btn-border-radius: 0 !default;
208
208
  $schedule-tbar-right-active-items-btn-border: none !default;
209
209
  $schedule-device-tbar-right-items-btn-border-radius: 0 !default;
210
210
  $schedule-device-tbar-right-items-btn-border: none !default;
211
+ $schedule-device-font-size: 8px !default;
211
212
 
212
213
  // view definitions
213
214
  $schedule-timeline-header-time-slots-bg: $schedule-tbar-default-bg !default;
@@ -552,6 +553,28 @@ $schedule-multiple-event-popup-icon-bg-color: $schedule-header-bg-color !default
552
553
  }
553
554
  }
554
555
 
556
+ @media screen and (max-width: 320px) {
557
+ .e-schedule-toolbar {
558
+ .e-toolbar-pop {
559
+ width: 100%;
560
+
561
+ .e-toolbar-item .e-tbar-btn.e-btn {
562
+ padding-left: 7px;
563
+ }
564
+
565
+ &.e-rtl {
566
+ .e-toolbar-item .e-tbar-btn.e-btn {
567
+ padding-right: 7px;
568
+ }
569
+ }
570
+ }
571
+
572
+ .e-tbar-btn .e-tbar-btn-text {
573
+ font-size: $schedule-device-font-size;
574
+ }
575
+ }
576
+ }
577
+
555
578
  .e-schedule-resource-toolbar {
556
579
  background: $schedule-tbar-default-bg;
557
580
  border-bottom: $schedule-tbar-border-bottom-size;
@@ -3445,7 +3468,24 @@ $schedule-multiple-event-popup-icon-bg-color: $schedule-header-bg-color !default
3445
3468
  }
3446
3469
  }
3447
3470
  }
3471
+
3472
+ /*! schedule event window for smaller viewports*/
3473
+ @media screen and (max-width: 320px) {
3474
+ .e-schedule-dialog.e-popup.e-popup-open {
3475
+ max-height: 350px;
3476
+ min-width: 100%;
3477
+ }
3448
3478
 
3479
+ .e-schedule-dialog {
3480
+ .e-all-day-container {
3481
+ padding-bottom: 10px;
3482
+ }
3483
+
3484
+ .e-all-day-time-zone-row {
3485
+ display: block;
3486
+ }
3487
+ }
3488
+ }
3449
3489
  .e-ddl.e-popup {
3450
3490
  .e-resource-template {
3451
3491
  display: flex;
@@ -4129,6 +4169,23 @@ $schedule-multiple-event-popup-icon-bg-color: $schedule-header-bg-color !default
4129
4169
  }
4130
4170
  }
4131
4171
 
4172
+ /*! schedule quick popup for smaller viewports */
4173
+ @media screen and (max-width: 320px) {
4174
+ .e-quick-popup-wrapper {
4175
+ min-width: 100%;
4176
+
4177
+ .e-popup-footer {
4178
+ padding-left: 5px;
4179
+ }
4180
+
4181
+ &.e-rtl {
4182
+ .e-popup-footer {
4183
+ padding-right: 5px;
4184
+ }
4185
+ }
4186
+ }
4187
+ }
4188
+
4132
4189
  .e-bigger .e-quick-popup-wrapper {
4133
4190
  .e-cell-popup .e-popup-content .e-popup-table .e-subject {
4134
4191
  font-size: 24px;