From f65c3d58aaba6080a05a7c9584803569a69bb308 Mon Sep 17 00:00:00 2001
From: Jakob Scheid <jakob.scheid@icloud.com>
Date: Sat, 23 May 2026 11:25:48 +0200
Subject: [PATCH] Add containers to components without a content container

---
 src/features/search/components/Searchbar.vue   | 18 ++++++++++--------
 .../search/views/SearchResultsView.vue         | 18 ++++++++++--------
 2 files changed, 20 insertions(+), 16 deletions(-)

diff --git a/src/features/search/components/Searchbar.vue b/src/features/search/components/Searchbar.vue
index 9e3e3de..693096e 100644
--- a/src/features/search/components/Searchbar.vue
+++ b/src/features/search/components/Searchbar.vue
@@ -36,18 +36,20 @@ const submitSearch = function () {
 </script>
 
 <template>
-    <form @submit.prevent="submitSearch">
-        <div class="search-wrapper">
-            <input
+    <div>
+        <form @submit.prevent="submitSearch">
+            <div class="search-wrapper">
+                <input
                 v-model="searchQuery"
                 type="search"
                 :placeholder="t('search.searchBar.placeholder')"
                 required
-            />
-            <button type="submit" class="search-button">{{ t('search.searchBar.submit') }}</button>
-        </div>
-    </form>
-    </template>
+                />
+                <button type="submit" class="search-button">{{ t('search.searchBar.submit') }}</button>
+            </div>
+        </form>
+    </div>
+</template>
 
 <style scoped>
 .search-wrapper {
diff --git a/src/features/search/views/SearchResultsView.vue b/src/features/search/views/SearchResultsView.vue
index e87c644..1e9e78f 100644
--- a/src/features/search/views/SearchResultsView.vue
+++ b/src/features/search/views/SearchResultsView.vue
@@ -28,15 +28,17 @@ searchQueryModel.value = props.searchQuery;
 </script>
 
 <template>
-    <Searchbar class="search-bar" v-model="searchQueryModel" auto-submit />
-
-    <div class="search-results-error-message-container">
-        <div class="search-results-error-message">
-            <p>{{ t('search.error.searchNotAvailable') }}</p>
-            <p>{{ t('error.tryAgainToAnotherTime') }}</p>
+    <div>
+        <Searchbar class="search-bar" v-model="searchQueryModel" auto-submit />
+        
+        <div class="search-results-error-message-container">
+            <div class="search-results-error-message">
+                <p>{{ t('search.error.searchNotAvailable') }}</p>
+                <p>{{ t('error.tryAgainToAnotherTime') }}</p>
+            </div>
+        </div>
+        <div class="search-results-container">
         </div>
-    </div>
-    <div class="search-results-container">
     </div>
 </template>