feat(legal): create empty loader module

Reviewed-on: #82
Reviewed-by: Jakob Scheid

src/features/legal/services/loader.js

@@ -0,0 +1,15 @@
+/*
+Copyright 2026 Seekra
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/

src/features/legal/views/ImprintView.vue

@@ -0,0 +1,15 @@
+/*
+Copyright 2026 Seekra
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/

src/features/legal/views/PrivacyPolicyView.vue

@@ -0,0 +1,69 @@
+```vue
+<!--
+Copyright 2026 Seekra
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+<script setup>
+import { computed } from 'vue';
+import { useI18n } from 'vue-i18n';
+
+// 1. ALLE Sprachen importieren (Verhindert den ReferenceError)
+import de from '@/legal/privacy/de.md?raw';
+import en from '@/legal/privacy/en.md?raw';
+import fr from '@/legal/privacy/fr.md?raw';
+import es from '@/legal/privacy/es.md?raw';
+import it from '@/legal/privacy/it.md?raw';
+import pt from '@/legal/privacy/pt.md?raw';
+
+const { locale } = useI18n();
+
+const content = computed(() => {
+  const map = {
+    de,
+    en,
+    fr,
+    es,
+    it,
+    pt
+  };
+
+  // Falls eine Sprache mal nicht existiert, nutzen wir 'de' oder 'en' als Fallback
+  return map[locale.value] || de;
+});
+</script>
+
+<template>
+  <main class="privacy-policy-content main-content-padding">
+    <h1>{{ $t('legal.privacy.title') }}</h1>
+
+    <div class="markdown-body">{{ content }}</div>
+  </main>
+</template>
+
+<style scoped>
+.privacy-policy-content {
+  max-width: 900px;
+  margin: 0 auto;
+  padding-top: 40px;
+  padding-bottom: 40px;
+}
+
+/* Sorgt dafür, dass die Zeilenumbrüche aus den .md Dateien erhalten bleiben */
+.markdown-body {
+  white-space: pre-wrap;
+  font-family: inherit;
+  line-height: 1.6;
+}
+</style>

src/features/nav/components/Navbar.vue

@@ -20,10 +20,10 @@ import { useRoute } from 'vue-router';
 import ColorSchemeButton from '@/features/colorScheme/components/ColorSchemeButton.vue';
 import LanguageSwitchButton from '@/features/i18n/components/LanguageSwitchButton.vue';
 import logo from '@/assets/images/logo.svg';
-import Searchbar from '@/features/nav/components/Searchbar-SearchResults.vue';
+import Searchbar from '@/features/search/components/Searchbar.vue';
 
 const route = useRoute();
-const searchQueryModel = ref(route.name === 'searchResults' ? route.query.q || '' : '');
+const searchQueryModel = defineModel();
 
 watch(() => route.name, name => {
     searchQueryModel.value = name === 'searchResults' ? route.query.q || '' : '';
@@ -63,7 +63,8 @@ watch(() => route.query.q, q => {
     display: flex;
     justify-content: space-between;
     align-items: center;
-    padding: 10px 40px;
+    padding: 18px 40px;
+    height: 42px;
 }
 
 .global-nav .right-links {
@@ -91,4 +92,4 @@ watch(() => route.query.q, q => {
 .search-bar {
     width: 70%;
 }
-</style>
+</style>

src/features/nav/components/Searchbar-SearchResults.vue

@@ -1,94 +0,0 @@
-<!--
-Copyright 2026 Seekra
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-    http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<script setup>
-const searchQuery = defineModel();
-
-import { useRouter } from 'vue-router';
-import { useI18n } from 'vue-i18n';
-
-const { t } = useI18n();
-
-const router = useRouter()
-const props = defineProps(['autoSubmit'])
-
-const submitSearch = function () {
-    if (props.autoSubmit !== undefined) {
-        router.push({
-            name: 'searchResults',
-            query: { q: searchQuery.value }
-        });
-    };
-}
-</script>
-
-<template>
-    <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>
-    </div>
-</template>
-
-<style scoped>
-.search-wrapper {
-    --submit-button-padding-y: 8px;
-    --content-height: 32px;
-    --padding: 4px;
-    --padding-left: calc(var(--content-height) + var(--padding));
-    display: flex;
-    align-items: center;
-    border: 1.5px solid var(--border);
-    box-shadow: 0 0px 32px var(--blue-box-shadow);
-    border-radius: calc(var(--content-height) * 0.5 + var(--submit-button-padding-y) + var(--padding));
-    padding: var(--padding);
-    padding-left: var(--padding-left);
-    width: calc(100% - var(--padding-left));
-}
-
-.search-wrapper input {
-    border: none;
-    outline: none;
-    width: 100%;
-    font-size: 1rem;
-    background: transparent;
-    height: calc(var(--content-height) + 2 * var(--submit-button-padding-y));
-}
-
-.search-button {
-    font-size: 1rem;
-    height: calc(var(--content-height) + 2 * var(--submit-button-padding-y));
-    border-radius: calc(var(--content-height) * 0.5 + var(--submit-button-padding-y));
-    border: none;
-    padding: var(--submit-button-padding-y) 20px;
-    background: var(--primary-color);
-    color: var(--white);
-    cursor: pointer;
-    white-space: nowrap;
-}
-
-.search-button:hover {
-    background: var(--primary-color-l-1);
-}
-</style>

src/features/search/views/SearchResultsView.vue

@@ -21,7 +21,7 @@ const { t } = useI18n();
 </script>
 
 <template>
-    <div class="main-content-padding">        
+    <div class="main-content-padding">
         <div class="search-results-error-message-container">
             <div class="search-results-error-message">
                 <p>{{ t('search.error.searchNotAvailable') }}</p>

src/legal/privacy/de.md

@@ -0,0 +1,3 @@
+# Datenschutzerklärung
+
+Hier steht deine Datenschutzerklärung auf Deutsch.

src/legal/privacy/en.md

@@ -0,0 +1,3 @@
+# Privacy Policy
+
+Here is your privacy policy in English.

src/legal/privacy/es.md

@@ -0,0 +1,3 @@
+# Política de privacidad
+
+Aquí tienes tu política de privacidad en español.

src/legal/privacy/fr.md

@@ -0,0 +1,3 @@
+# Politique de confidentialité
+
+Voici ta politique de confidentialité en français.

src/legal/privacy/it.md

@@ -0,0 +1,3 @@
+# Informativa sulla privacy
+
+Qui trovi la tua informativa sulla privacy in italiano.

src/legal/privacy/pt.md

@@ -0,0 +1,3 @@
+# Política de Privacidade
+
+Aqui está a tua Política de Privacidade em português.

src/locales/de.json

@@ -37,5 +37,11 @@
             }
         }
     },
-    "slogan": "Gebaut zum Suchen."
+    "slogan": "Gebaut zum Suchen.",
-}
+
+    "legal": {
+        "privacy": {
+            "title": "Datenschutzerklärung"
+        }
+    }
+}

src/locales/en.json

@@ -37,5 +37,11 @@
             }
         }
     },
-    "slogan": "Built to search."
+    "slogan": "Built to search.",
-}
+
+    "legal": {
+        "privacy": {
+            "title": "Privacy Policy"
+        }
+    }
+}

src/locales/es.json

@@ -37,5 +37,11 @@
             }
         }
     },
-    "slogan": "Hecho para buscar."
+    "slogan": "Hecho para buscar.",
-}
+
+    "legal": {
+        "privacy": {
+            "title": "Política de Privacidad"
+        }
+    }
+}

src/locales/fr.json

@@ -37,5 +37,11 @@
             }
         }
     },
-    "slogan": "Conçu pour chercher."
+    "slogan": "Conçu pour chercher.",
-}
+
+    "legal": {
+        "privacy": {
+            "title": "Politique de Confidentialité"
+        }
+     }
+}

src/locales/it.json

@@ -37,5 +37,11 @@
             }
         }
     },
-    "slogan": "Costruito per cercare."
+    "slogan": "Costruito per cercare.",
-}
+
+    "legal": {
+        "privacy": {
+            "title": "Politica di Privacy"
+        }
+    }
+}

src/locales/pt.json

@@ -37,5 +37,11 @@
             }
         }
     },
-    "slogan": "Feito para pesquisar."
+    "slogan": "Feito para pesquisar.",
-}
+
+    "legal": {
+        "privacy": {
+            "title": "Política de Privacidade"
+        }
+    }
+}

src/router/index.js

@@ -21,6 +21,7 @@ import SearchView from '../views/SearchView.vue';
 import SearchResultsView from '@/features/search/views/SearchResultsView.vue';
 import SettingsView from '@/features/settings/views/SettingsView.vue';
 import NotFound from '../views/NotFound.vue';
+import PrivacyPolicyView from '@/features/legal/views/PrivacyPolicyView.vue';
 
 const routes = [
     {
@@ -52,6 +53,15 @@ const routes = [
         name: 'notFound',
         component: NotFound
     },
+    {
+    path: '/privacy',
+    name: 'privacyPolicy',
+    component: PrivacyPolicyView,
+    meta: {
+        title: () => 'Privacy Policy'
+    }
+    },
+
 ];
 
 const router = createRouter({
@@ -73,4 +83,4 @@ router.afterEach(to => {
     };
 });
 
-export default router;
+export default router;