From 45fd18afa7b19355ed5b78968ab92ab8483403b3 Mon Sep 17 00:00:00 2001
From: Alexis <alexis.pele@pm.me>
Date: Sat, 28 Mar 2026 21:36:52 +0100
Subject: [PATCH] Changed primary colour

---
 src/assets/css/main.css        |  6 +++---
 src/components/BikeFilters.vue | 24 ++++++++++++------------
 src/components/Map.vue         |  7 +++++--
 3 files changed, 20 insertions(+), 17 deletions(-)

diff --git a/src/assets/css/main.css b/src/assets/css/main.css
index f8f444b..d74ccc4 100644
--- a/src/assets/css/main.css
+++ b/src/assets/css/main.css
@@ -9,8 +9,8 @@
   --card-foreground: oklch(0.145 0 0);
   --popover: oklch(1 0 0);
   --popover-foreground: oklch(0.145 0 0);
-  --primary: oklch(0.205 0 0);
-  --primary-foreground: oklch(0.985 0 0);
+  --primary: oklch(87.173% 0.17182 90.995);
+  --primary-foreground: oklch(0.205 0 0);
   --secondary: oklch(0.97 0 0);
   --secondary-foreground: oklch(0.205 0 0);
   --muted: oklch(0.97 0 0);
@@ -45,7 +45,7 @@
   --card-foreground: oklch(0.985 0 0);
   --popover: oklch(0.145 0 0);
   --popover-foreground: oklch(0.985 0 0);
-  --primary: oklch(0.985 0 0);
+  --primary: oklch(87.173% 0.17182 90.995);
   --primary-foreground: oklch(0.205 0 0);
   --secondary: oklch(0.269 0 0);
   --secondary-foreground: oklch(0.985 0 0);
diff --git a/src/components/BikeFilters.vue b/src/components/BikeFilters.vue
index 9e47b42..2f59cde 100644
--- a/src/components/BikeFilters.vue
+++ b/src/components/BikeFilters.vue
@@ -17,11 +17,11 @@ defineProps<{
   <aside class="absolute top-5 left-5 z-10 p-2 bg-slate-50 text-slate-950 text-xs rounded-xs">
     <form>
       <div class="grid gap-1.5">
-        <label class="flex flex-row gap-1.5 items-center [&>.checkbox]:hover:bg-foreground text-sm cursor-pointer">
+        <label class="flex flex-row gap-1.5 items-center text-sm cursor-pointer">
           <CheckboxRoot v-model="filterUncovered"
-            class="hover:bg-stone-50 flex size-4 appearance-none items-center justify-center rounded-xs bg-foreground shadow-sm border focus-within:ring-1 cursor-pointer">
-            <CheckboxIndicator class="bg-foreground size-full flex items-center justify-center">
-              <PhCheck :size="10" />
+            class="hover:bg-stone-100 flex size-4 appearance-none items-center justify-center rounded-xs bg-foreground shadow-sm border focus-within:ring-1 cursor-pointer">
+            <CheckboxIndicator class="size-full flex items-center justify-center bg-primary text-primary-foreground">
+              <PhCheck :size="10" weight="bold" />
             </CheckboxIndicator>
           </CheckboxRoot>
 
@@ -34,11 +34,11 @@ defineProps<{
           </span>
         </label>
 
-        <label class="flex flex-row gap-1.5 items-center [&>.checkbox]:hover:bg-foreground text-sm cursor-pointer">
+        <label class="flex flex-row gap-1.5 items-center text-sm cursor-pointer">
           <CheckboxRoot v-model="filterCovered"
-            class="hover:bg-stone-50 flex size-4 appearance-none items-center justify-center rounded-xs bg-foreground shadow-sm border focus-within:ring-1 cursor-pointer">
-            <CheckboxIndicator class="bg-foreground size-full flex items-center justify-center">
-              <PhCheck :size="10" />
+            class="hover:bg-stone-100 flex size-4 appearance-none items-center justify-center rounded-xs bg-foreground shadow-sm border focus-within:ring-1 cursor-pointer">
+            <CheckboxIndicator class="size-full flex items-center justify-center bg-primary text-primary-foreground">
+              <PhCheck :size="10" weight="bold" />
             </CheckboxIndicator>
           </CheckboxRoot>
 
@@ -51,11 +51,11 @@ defineProps<{
           </span>
         </label>
 
-        <label class="flex flex-row gap-1.5 items-center [&>.checkbox]:hover:bg-foreground text-sm cursor-pointer">
+        <label class="flex flex-row gap-1.5 items-center text-sm cursor-pointer">
           <CheckboxRoot v-model="filterKorrigo"
-            class="hover:bg-stone-50 flex size-4 appearance-none items-center justify-center rounded-xs bg-foreground shadow-sm border focus-within:ring-1 cursor-pointer">
-            <CheckboxIndicator class="bg-foreground size-full flex items-center justify-center">
-              <PhCheck :size="10" />
+            class="hover:bg-stone-100 flex size-4 appearance-none items-center justify-center rounded-xs bg-foreground shadow-sm border focus-within:ring-1 cursor-pointer">
+            <CheckboxIndicator class="size-full flex items-center justify-center bg-primary text-primary-foreground">
+              <PhCheck :size="10" weight="bold" />
             </CheckboxIndicator>
           </CheckboxRoot>
 
diff --git a/src/components/Map.vue b/src/components/Map.vue
index a7cd4c9..09efadc 100644
--- a/src/components/Map.vue
+++ b/src/components/Map.vue
@@ -68,8 +68,11 @@ const { filterUncovered, filterCovered, filterKorrigo } = storeToRefs(useMap())
 </script>
 
 <template>
-  <BikeFilters :nb-uncovered="nonCoveredParkingsSpots" :nb-covered="coveredParkingsSpots"
-    :nb-korrigo="premiumParkingsSpots" />
+  <Transition enter-from-class="opacity-0 translate-y-2"
+    enter-active-class="transition-all duration-500 ease-out delay-300" enter-to-class="opacity-100 translate-y-0">
+    <BikeFilters v-if="state.status === 'success'" :nb-uncovered="nonCoveredParkingsSpots"
+      :nb-covered="coveredParkingsSpots" :nb-korrigo="premiumParkingsSpots" />
+  </Transition>
 
   <main class="relative z-0 h-screen w-screen grid place-items-center">
     <div v-if="state.status === 'pending'">Loading...</div>