Fix calendar select rtl for dark mode

coolcat-creations · Mar 10, 2024 · ba0e780 · ba0e780
1 parent 5f42259
commit ba0e780
Show file tree

Hide file tree

Showing 9 changed files with 36 additions and 6 deletions.
diff --git a/...em/images/calendar-select-bg-dark-rtl.svg → ...urce/system/images/select-bg-dark-rtl.svg b/...em/images/calendar-select-bg-dark-rtl.svg → ...urce/system/images/select-bg-dark-rtl.svg
diff --git a/build/media_source/system/images/select-bg-dark.svg b/build/media_source/system/images/select-bg-dark.svg
diff --git a/...edia_source/templates/administrator/atum/images/calendar/select-bg-dark-rtl.svg b/...edia_source/templates/administrator/atum/images/calendar/select-bg-dark-rtl.svg
diff --git a/...system/images/calendar-select-bg-dark.svg → ...r/atum/images/calendar/select-bg-dark.svg b/...system/images/calendar-select-bg-dark.svg → ...r/atum/images/calendar/select-bg-dark.svg
diff --git a/build/media_source/templates/administrator/atum/images/calendar/select-bg-rtl.svg b/build/media_source/templates/administrator/atum/images/calendar/select-bg-rtl.svg
diff --git a/build/media_source/templates/administrator/atum/images/calendar/select-bg.svg b/build/media_source/templates/administrator/atum/images/calendar/select-bg.svg
diff --git a/build/media_source/templates/administrator/atum/scss/_variables-dark.scss b/build/media_source/templates/administrator/atum/scss/_variables-dark.scss
@@ -439,8 +439,8 @@ $atum-colors-dark: (
   atum-calendar-disabled-color:   #4b4b4b,
   atum-calendar-disabled-bg:      rgba(0,0,0,.5),
   atum-calendar-select-bg:          $form-select-bg-dark,
-  atum-calendar-select-bg-url:      url("../../images/select-bg-dark.svg"),
-  atum-calendar-select-bg-url-rtl:  url("../../images/select-bg-dark-rtl.svg"),
+  atum-calendar-select-bg-url:      url("../images/calendar/select-bg-dark.svg"),
+  atum-calendar-select-bg-url-rtl:  url("../images/calendar/select-bg-dark-rtl.svg"),
 
   // Permissions
   permissions-sliders-oddCol-bg:  var(--template-bg-dark),

diff --git a/build/media_source/templates/administrator/atum/scss/_variables.scss b/build/media_source/templates/administrator/atum/scss/_variables.scss
@@ -828,8 +828,8 @@ $atum-calendar-buttons-color:      var(--atum-calendar-buttons-color);
 $atum-calendar-disabled-color:     var(--atum-calendar-disabled-color);
 $atum-calendar-disabled-bg:        var(--atum-calendar-disabled-bg);
 $atum-calendar-select-bg:          var(--atum-calendar-select-bg);
-$atum-calendar-select-bg-url:      var(--atum-calendar-select-bg-url);
-$atum-calendar-select-bg-url-rtl:  var(--atum-calendar-select-bg-url-rtl);
+$atum-calendar-select-bg-url:       url("../images/calendar/select-bg.svg");
+$atum-calendar-select-bg-url-rtl:  url("../images/calendar/select-bg-rtl.svg");
 
 // Permissions
 $permissions-sliders-oddCol-bg:    var(--permissions-sliders-oddCol);

diff --git a/build/media_source/templates/administrator/atum/scss/system/fields/_calendar.scss b/build/media_source/templates/administrator/atum/scss/system/fields/_calendar.scss
@@ -2,10 +2,31 @@
   background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg width='24' height='24' viewBox='0 0 1792 1792' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1024 544v448q0 14-9 23t-23 9h-320q-14 0-23-9t-9-23v-64q0-14 9-23t23-9h224v-352q0-14 9-23t23-9h64q14 0 23 9t9 23zm416 352q0-148-73-273t-198-198-273-73-273 73-198 198-73 273 73 273 198 198 273 73 273-73 198-198 73-273zm224 0q0 209-103 385.5t-279.5 279.5-385.5 103-385.5-103-279.5-279.5-103-385.5 103-385.5 279.5-279.5 385.5-103 385.5 103 279.5 279.5 103 385.5z'/%3E%3C/svg%3E") !important;
 }
 
+.calendar-container .time td select {
+  background-color: $atum-calendar-select-bg;
+  background-image: $atum-calendar-select-bg-url;
+}
+
+[dir="rtl"] {
+  .calendar-container .time td select {
+    background-image: $atum-calendar-select-bg-url-rtl;
+  }
+}
+
 @if $enable-dark-mode {
   @include color-mode(dark) {
     .time .time-title {
       background-image: url("data:image/svg+xml;base64,PG5zMDpzdmcgeG1sbnM6bnMwPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMTc5MiAxNzkyIj4KICAgIDxuczA6cGF0aCBkPSJNMTAyNCA1NDR2NDQ4cTAgMTQtOSAyM3QtMjMgOWgtMzIwcS0xNCAwLTIzLTl0LTktMjN2LTY0cTAtMTQgOS0yM3QyMy05aDIyNHYtMzUycTAtMTQgOS0yM3QyMy05aDY0cTE0IDAgMjMgOXQ5IDIzem00MTYgMzUycTAtMTQ4LTczLTI3M3QtMTk4LTE5OC0yNzMtNzMtMjczIDczLTE5OCAxOTgtNzMgMjczIDczIDI3MyAxOTggMTk4IDI3MyA3MyAyNzMtNzMgMTk4LTE5OCA3My0yNzN6bTIyNCAwcTAgMjA5LTEwMyAzODUuNXQtMjc5LjUgMjc5LjUtMzg1LjUgMTAzLTM4NS41LTEwMy0yNzkuNS0yNzkuNS0xMDMtMzg1LjUgMTAzLTM4NS41IDI3OS41LTI3OS41IDM4NS41LTEwMyAzODUuNSAxMDMgMjc5LjUgMjc5LjUgMTAzIDM4NS41eiIgZmlsbD0id2hpdGUiIC8+CjwvbnMwOnN2Zz4=") !important;
     }
+    .calendar-container .time td select {
+      background-color: var(--atum-calendar-select-bg);
+      background-image: var(--atum-calendar-select-bg-url);
+    }
+
+    [dir="rtl"] {
+      .calendar-container .time td select {
+        background-image: var(--atum-calendar-select-bg-url-rtl);
+      }
+    }
   }
 }