Style schedule PrimeReact buttons and swap icon to match Angular

2026-04-16 11:54:35 +03:00
parent 63c3705a0c
commit 5f33ef371d
1 changed files with 62 additions and 0 deletions
@@ -228,4 +228,66 @@
      box-shadow: 0 0 0 0.2em colors.$focus-shadow;
    }
  }
+
+  // PrimeReact AutoComplete dropdown — match Angular's subtle chevron
+  .p-autocomplete-dropdown {
+    background: transparent !important;
+    border: none !important;
+    color: colors.$gray !important;
+    width: 2rem !important;
+    padding: 0 !important;
+
+    .p-icon {
+      width: 0.75rem;
+      height: 0.75rem;
+    }
+  }
+
+  // PrimeReact Calendar button — match Angular's outline icon
+  .p-datepicker-trigger {
+    background: transparent !important;
+    border: none !important;
+    color: colors.$gray !important;
+    width: 2rem !important;
+    padding: 0 !important;
+
+    .p-icon {
+      width: 1rem;
+      height: 1rem;
+      color: colors.$blue;
+    }
+  }
+
+  // Swap button — match Angular's flat style
+  .change-container {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+
+    .button-change {
+      margin-top: vars.$space-m;
+      margin-bottom: -(vars.$space-m);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      height: vars.$medium-button-height;
+      width: 35px;
+      background-color: colors.$white;
+      border: none;
+      box-shadow: none;
+      cursor: pointer;
+
+      &:hover {
+        background-color: colors.$white;
+      }
+
+      .svg--change-city {
+        width: 25px;
+        height: 12px;
+        fill: colors.$blue;
+        transform: rotate(90deg);
+      }
+    }
+  }
 }