console false in prod

components/FAQArea.vue

@@ -2,11 +2,11 @@
   <section id="faq" class="faq">
     <h3>{{ headline }}</h3>
     <Accordion v-if="accordionItems.length" :items="accordionItems" />
-    <p v-else>Lade Daten...</p>
+    <p v-else>Loading...</p>
 
     <div class="row mt-4">
       <div class="col-md-6 mb-3">
-        <h4> Noch Fragen? </h4>
+        <h4> {{ $t('faqBox.questions') }} </h4>
       </div>
       <div class="col-md-6">
         <button role="button" class="pinkBtn" @click.prevent="toggleContactBubble">
@@ -19,22 +19,29 @@
 
 <script setup lang="ts">
 import { computed, defineProps } from 'vue'
+import { useI18n } from 'vue-i18n'
 import { useMainStore } from '@/stores/main'
 import { useHtmlConverter } from '~/composables/useHTMLConverter'
+
+const { t } = useI18n()
 const { convertToHTML } = useHtmlConverter()
 
 const props = defineProps({
   pageLink: { type: String, required: true },
-  headline: { type: String, default: "Häufig gestellte Fragen (FAQs)" },
+  headline: { type: String, required: false },
-  button: { type: String, default: "Sprechen Sie uns gerne an!" },
+  button: { type: String, required: false },
 })
 
+// Fallbacks im Setup definieren, falls keine Props übergeben wurden
+const headline = computed(() => props.headline ?? t('faqBox.faqsDefault'))
+const button = computed(() => props.button ?? t('faqBox.btnDefault'))
+
 const mainStore = useMainStore()
 
 const accordionItems = computed(() =>
   mainStore.getFaqsByPageLink(props.pageLink).map(faq => ({
     title: faq.question,
-    html:  convertToHTML(faq.answer)   // <- hier passiert die Umwandlung
+    html:  convertToHTML(faq.answer)
   }))
 )
 
@@ -42,6 +49,8 @@ const toggleContactBubble = () => mainStore.toggleContactBubble()
 </script>
 
 
+
+  
   <style lang="sass">
   .faq
       width: 80%

i18n/locales/de.json

@@ -47,6 +47,11 @@
             "salutation": "Ihr digimedialoop Team"
         }
     },
+    "faqBox": {
+        "questions": "Fragen?",
+        "faqsDefault": "Häufig gestellte Fragen (FAQs)",
+        "btnDefault": "Sprechen Sie uns gerne an!"
+    },
     "home": {
         "heroBox": {
             "h1": "Ihre Agentur für individuelles Webdesign und professionelle Webentwicklung",

nuxt.config.ts

@@ -39,6 +39,14 @@ export default defineNuxtConfig({
           `
         }
       }
+    },
+    build: {
+      terserOptions: {
+        compress: {
+          drop_console: true,
+          drop_debugger: true,
+        },
+      },
     }
   },
   modules: [

pages/index.vue

@@ -3,7 +3,7 @@
     <section class="heroBox" aria-labelledby="hero-heading">
       <NuxtImg
         provider="strapi"
-        src="/uploads/medium_DML_Home_Hero_4f27bc7f8e.webp"              
+        src="/uploads/large_DML_Home_Hero_4f27bc7f8e.webp"              
         class="hero-bg"
         sizes="sm:100vw md:100vw lg:100vw"
         alt=""                  
@@ -64,6 +64,7 @@ class="pinkBtn" role="button"
       </svg>  
     </section>
     
+
     <section class="canDo" aria-labelledby="canDo-section-title">
       <div class="container">
         <h2 id="canDo-section-title" class="text-center">
@@ -125,6 +126,8 @@ class="pinkBtn" role="button"
             <path d="M 0 0 L 500 0 L 500 14 Q 354.4 -2.8 250 11 Q 145.6 24.8 0 14 L 0 0 Z" fill="#FFF"/>
       </svg>  
     </section>
+
+
     <section>
       <div class="container-10 text-center py-5">
         <h3>{{ $t('home.finalCall.title') }}</h3>
@@ -204,6 +207,7 @@ const canDoItems = [
 
 <style lang="sass">
 .homePage
+
   .heroBox
     position: relative
     min-height: 35rem
@@ -279,6 +283,7 @@ const canDoItems = [
       z-index: 1
       transform: scaleY(-1) 
       bottom: -2px
+  
   .webStrategy
     padding: 4rem 0 3.5rem 0
     h2
@@ -312,6 +317,7 @@ const canDoItems = [
       box-shadow: $innerShadow
       @media(max-width: $breakPointMD)
           right: -50vw
+  
   .targetGroup
     background-image: url('https://strapi.digimedialoop.de/uploads/smartphone_Contacts_40ae56a178.jpg') 
     background-repeat: no-repeat
@@ -328,6 +334,7 @@ const canDoItems = [
     h3
       font-size: clamp(1.1rem, .8rem + 1vw, 1.2rem)
       line-height: 150%
+
 .firstTeaser
   h2
     font-size: 1.6rem
@@ -352,14 +359,13 @@ const canDoItems = [
   p
     padding-right: 1rem
   
+
 .canDo
   margin: 12vh 0
-
   h2
     margin-bottom: 3.5rem
     font-size: clamp(1.6rem, 1rem + 2vw, 1.8rem)
-
+  .canDoGrid
-.canDoGrid
     display: grid
     gap: 2rem
     justify-content: center
@@ -381,7 +387,7 @@ const canDoItems = [
       background-image: linear-gradient(to bottom right, transparent , white)
       box-shadow: 3px 3px 8px 1px $lightgrey
       border-bottom-right-radius: 1rem
-    padding: 2rem
+      padding: 1rem 1.5rem
       border-right: 1px solid lighten($beige, 0%)
       border-bottom: 1px solid lighten($beige, 0%)
       height: 100%
@@ -390,7 +396,7 @@ const canDoItems = [
       width: 100%
       
       .imageBox
-      margin: 2rem auto
+        margin: 0rem auto 1rem auto
         width: 100%
         max-width: 180px
         aspect-ratio: 5 / 4
@@ -414,6 +420,7 @@ const canDoItems = [
         font-family: 'Mainfont-Bold'
         color: darken($pink, 10%)
         text-transform: uppercase
+        margin-bottom: .5rem
 
       p
         font-size: .9rem