From 3360d7c5fa4124a4a285b9f23861310ec22dc7d9 Mon Sep 17 00:00:00 2001
From: Gabriellvl <vanlangenhovefga@gmail.com>
Date: Fri, 2 May 2025 09:49:32 +0200
Subject: [PATCH] fix: stijl + positie zoek kaart

---
 frontend/src/components/BrowseThemes.vue | 39 +++++++++++++-----------
 1 file changed, 22 insertions(+), 17 deletions(-)

diff --git a/frontend/src/components/BrowseThemes.vue b/frontend/src/components/BrowseThemes.vue
index b65c4e26..7b1971d4 100644
--- a/frontend/src/components/BrowseThemes.vue
+++ b/frontend/src/components/BrowseThemes.vue
@@ -57,6 +57,22 @@
         </div>
 
         <v-row v-else>
+            <v-col
+                cols="12"
+                sm="6"
+                md="4"
+                lg="4"
+                class="d-flex"
+            >
+                <ThemeCard
+                    path="/learningPath/search"
+                    :is-absolute-path="true"
+                    :title="t('searchAllLearningPathsTitle')"
+                    :description="t('searchAllLearningPathsDescription')"
+                    icon="mdi-magnify"
+                    class="fill-height grey-bg-card"
+                />
+            </v-col>
             <v-col
                 v-for="card in cards"
                 :key="card.key"
@@ -74,24 +90,13 @@
                     class="fill-height"
                 />
             </v-col>
-            <v-col
-                cols="12"
-                sm="6"
-                md="4"
-                lg="4"
-                class="d-flex"
-            >
-                <ThemeCard
-                    path="/learningPath/search"
-                    :is-absolute-path="true"
-                    :title="t('searchAllLearningPathsTitle')"
-                    :description="t('searchAllLearningPathsDescription')"
-                    icon="mdi-magnify"
-                    class="fill-height"
-                />
-            </v-col>
         </v-row>
     </v-container>
 </template>
 
-<style scoped></style>
+<style scoped>
+    .grey-bg-card {
+        background-color: #f6faf2;
+        border: 2px solid #0e6942;
+    }
+</style>