Füge eine neue Skriptfunktion zum Kopieren des Build-Verzeichnisses in die package.json hinzu und verbessere das Styling in ContactRender und WorshipRender Komponenten durch Hinzufügen von Margen.

package.json

@@ -4,7 +4,8 @@
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve",
-    "build": "vue-cli-service build",
+  "build": "vue-cli-service build && npm run copy-dist",
+  "copy-dist": "cp -r dist/* public/",
     "lint": "vue-cli-service lint"
   },
   "dependencies": {

src/components/ContactRender.vue

@@ -1,5 +1,5 @@
 <template>
-    <div v-if="config && config.style === 'box' && contacts && contacts.length && contacts.length > 0">
+    <div v-if="config && config.style === 'box' && contacts && contacts.length && contacts.length > 0" class="bottom-margin">
         <div v-for="contact in contacts" :key="contact.id" class="contact-box">
             <p>{{ contact.name }}</p>
             <p v-if="displayOptions.includes('phone')">Telefon: {{ contact.phone }}</p>
@@ -11,7 +11,7 @@
                 pos.caption).join(', ') }}</p>
         </div>
     </div>
-    <span v-else-if="config.style === 'float' && contacts && contacts.length && contacts.length > 0">
+    <span v-else-if="config.style === 'float' && contacts && contacts.length && contacts.length > 0" class="bottom-margin">
         <span v-for="contact in contacts" :key="contact.id">
             {{ contact.name }}
             <span v-if="displayOptions.includes('phone')">, Telefon: {{ contact.phone }}</span>
@@ -65,4 +65,7 @@ export default {
 .contact-box p {
     margin: 0;
 }
+.bottom-margin {
+    margin-bottom: 1rem;
+}
 </style>

src/components/WorshipRender.vue

@@ -13,7 +13,7 @@
                     <h3>
                         <span :class="worship.highlightTime ? 'highlight-time' : ''">{{ formatTime(worship.time)
                             }}</span>&nbsp;-&nbsp;
-                        {{ !worship.neighborInvitation ? worship.title : `Gottesdienst in ${worship.eventPlace.name}` }}
+                        {{ worship.title ? worship.title : `Gottesdienst in ${worship.eventPlace.name}` }}
                     </h3>
                     <div v-if="worship.organizer">Gestaltung: {{ worship.organizer }}</div>
                     <div v-if="worship.sacristanService" class="internal-information">Küsterdienst: {{ worship.sacristanService }}</div>