Add Margin after popup title

This commit is contained in:
philipp lang 2024-09-13 01:29:46 +02:00
parent 3830f3d1d4
commit aa64d1ceb6
12 changed files with 37 additions and 37 deletions

View File

@ -11,7 +11,7 @@
</a>
</div>
<h3 v-if="heading" class="font-semibold text-primary-200 text-xl" v-html="heading"></h3>
<div class="text-primary-100 group is-popup grow flex flex-col">
<div class="text-primary-100 group is-popup grow flex flex-col mt-4">
<suspense>
<div>
<slot></slot>

View File

@ -1,6 +1,6 @@
<template>
<div>
<f-select id="connection" v-model="innerConnection" label="Verbindung" name="connection" class="mt-2" :options="data"></f-select>
<f-select id="connection" v-model="innerConnection" label="Verbindung" name="connection" :options="data"></f-select>
<div v-if="innerConnection" class="mt-4">
<div class="flex space-x-3 items-center bg-zinc-700 rounded-lg mt-3 py-1 px-2">

View File

@ -7,34 +7,34 @@
<f-save-button form="actionform"></f-save-button>
</template>
<form id="actionform" class="grow p-3" @submit.prevent="submit">
<ui-popup heading="Neue Untertätigkeit" v-if="mode === 'edit' && currentSubactivity !== null" @close="currentSubactivity = null">
<subactivity-form class="mt-4" v-if="currentSubactivity" :value="currentSubactivity" @stored="reloadSubactivities" @updated="mergeSubactivity"></subactivity-form>
<ui-popup v-if="mode === 'edit' && currentSubactivity !== null" heading="Neue Untertätigkeit" @close="currentSubactivity = null">
<subactivity-form v-if="currentSubactivity" :value="currentSubactivity" @stored="reloadSubactivities" @updated="mergeSubactivity"></subactivity-form>
</ui-popup>
<div class="flex space-x-3">
<f-text id="name" v-model="inner.name" label="Name" required></f-text>
<f-switch v-model="inner.is_filterable" name="is_filterable" id="is_filterable" label="Filterbar"></f-switch>
<f-switch id="is_filterable" v-model="inner.is_filterable" name="is_filterable" label="Filterbar"></f-switch>
</div>
<div class="flex space-x-3 items-center mt-6 mb-2">
<f-checkboxes-label>Untertätigkeiten</f-checkboxes-label>
<ui-icon-button icon="plus" v-if="mode === 'edit'" @click.prevent="currentSubactivity = inner.subactivity_model">Neu</ui-icon-button>
<ui-icon-button v-if="mode === 'edit'" icon="plus" @click.prevent="currentSubactivity = inner.subactivity_model">Neu</ui-icon-button>
</div>
<div class="grid gap-2 sm:grid-cols-2 md:grid-cols-4">
<div v-for="option in subactivities" class="flex items-center space-x-2">
<a
href="#"
v-if="mode === 'edit'"
@click.prevent="currentSubactivity = option"
href="#"
class="transition hover:bg-yellow-600 group w-5 h-5 rounded-full flex items-center justify-center flex-none"
@click.prevent="currentSubactivity = option"
>
<ui-sprite src="pencil" class="text-yellow-800 w-3 h-3 group-hover:text-yellow-200 transition"></ui-sprite>
</a>
<f-switch
inline
size="sm"
:id="`subactivities-${option.id}`"
:key="option.id"
v-model="inner.subactivities"
inline
size="sm"
name="subactivities[]"
:id="`subactivities-${option.id}`"
:value="option.id"
:label="option.name"
></f-switch>
@ -49,6 +49,11 @@ import {defineAsyncComponent} from 'vue';
import {useToast} from 'vue-toastification';
export default {
props: {
data: {},
meta: {},
},
setup() {
const toast = useToast();
@ -63,11 +68,6 @@ export default {
};
},
props: {
data: {},
meta: {},
},
components: {
'subactivity-form': defineAsyncComponent(() => import('./SubactivityForm.vue')),
},

View File

@ -6,7 +6,7 @@
</template>
<ui-popup v-if="deleting !== null" heading="Bitte bestätigen" @close="deleting = null">
<div>
<p class="mt-4">Diese Aktivität löschen?</p>
<p>Diese Aktivität löschen?</p>
<div class="grid grid-cols-2 gap-3 mt-6">
<a href="#" class="text-center btn btn-danger" @click.prevent="remove">Löschen</a>
<a href="#" class="text-center btn btn-primary" @click.prevent="deleting = null">Abbrechen</a>

View File

@ -7,7 +7,7 @@
<ui-popup v-if="deleting !== null" :heading="`Veranstaltung ${deleting.name} löschen?`" @close="deleting = null">
<div>
<p class="mt-4">Diese Veranstaltung löschen?</p>
<p>Diese Veranstaltung löschen?</p>
<div class="grid grid-cols-2 gap-3 mt-6">
<a
href="#"
@ -24,7 +24,7 @@
</ui-popup>
<ui-popup v-if="single !== null && single.config === null" heading="Vorlage auswählen" @close="cancel">
<div class="mt-3 grid gap-3 grid-cols-2">
<div class="grid gap-3 grid-cols-2">
<a v-for="(template, index) in meta.templates" :key="index" class="py-2 px-3 border rounded bg-zinc-800 hover:bg-zinc-700 transition" href="#" @click.prevent="setTemplate(template)">
<span v-text="template.name"></span>
</a>
@ -36,7 +36,7 @@
</ui-popup>
<ui-popup v-if="single !== null && single.config !== null" :heading="`Veranstaltung ${single.id ? 'bearbeiten' : 'erstellen'}`" full @close="cancel">
<div class="flex flex-col mt-3">
<div class="flex flex-col">
<ui-tabs v-model="active" :entries="tabs"></ui-tabs>
<div v-show="active === 0" class="grid grid-cols-2 gap-3">
<div class="flex space-x-3">

View File

@ -1,6 +1,6 @@
<template>
<div>
<div class="mt-4">
<div>
<f-text id="search_string" v-model="searchString" label="Mitglied finden"></f-text>
</div>
<div v-if="results !== null" class="mt-5 sm:mt-10 space-y-2">

View File

@ -14,7 +14,7 @@
</ui-popup>
<ui-popup v-if="deleting !== null" heading="Teilnehmer*in löschen?" @close="deleting = null">
<div>
<p class="mt-4">Den*Die Teilnehmer*in löschen?</p>
<p>Den*Die Teilnehmer*in löschen?</p>
<div class="grid grid-cols-2 gap-3 mt-6">
<a href="#" class="text-center btn btn-danger" @click.prevent="handleDelete">Mitglied loschen</a>
<a href="#" class="text-center btn btn-primary" @click.prevent="deleting = null">Abbrechen</a>

View File

@ -7,7 +7,7 @@
<ui-popup v-if="deleting !== null" :heading="`Formular-Vorlage ${deleting.name} löschen?`" @close="deleting = null">
<div>
<p class="mt-4">Diese Formular-Vorlage löschen?</p>
<p>Diese Formular-Vorlage löschen?</p>
<div class="grid grid-cols-2 gap-3 mt-6">
<a
href="#"
@ -24,7 +24,7 @@
</ui-popup>
<ui-popup v-if="single !== null" :heading="`Vorlage ${single.id ? 'bearbeiten' : 'erstellen'}`" full @close="cancel">
<div class="flex flex-col mt-3">
<div class="flex flex-col">
<ui-tabs v-model="activeTab" :entries="tabs"></ui-tabs>
<form-builder v-if="activeTab === 0" v-model="single.config" :meta="meta">
<template #meta>

View File

@ -8,7 +8,7 @@
<ui-popup v-if="massstore !== null" heading="Massenrechnung anlegen" @close="massstore = null">
<form @submit.prevent="sendMassstore">
<section class="grid grid-cols-2 gap-3 mt-6">
<section class="grid grid-cols-2 gap-3">
<f-text id="year" v-model="massstore.year" label="Jahr" required></f-text>
</section>
<section class="flex mt-4 space-x-2">
@ -19,7 +19,7 @@
</ui-popup>
<ui-popup v-if="deleting !== null" heading="Rechnung löschen?" @close="deleting = null">
<div>
<p class="mt-4">Diese Rechnung löschen?</p>
<p>Diese Rechnung löschen?</p>
<div class="grid grid-cols-2 gap-3 mt-6">
<a
href="#"
@ -35,7 +35,7 @@
</div>
</ui-popup>
<ui-popup v-if="single !== null" :heading="`Rechnung ${single.id ? 'bearbeiten' : 'erstellen'}`" inner-width="max-w-4xl" @close="cancel">
<form class="grid grid-cols-2 gap-3 mt-4" @submit.prevent="submit">
<form class="grid grid-cols-2 gap-3" @submit.prevent="submit">
<ui-box heading="Für Mitglied anlegen" container-class="flex space-x-3" class="col-span-full">
<f-select id="forMemberMember" v-model="forMember.member_id" name="forMemberMember" :options="meta.members" label="Mitglied"></f-select>
<f-select id="forMemberSubscription" v-model="forMember.subscription_id" name="forMemberSubscription" :options="meta.subscriptions" label="Beitrag"></f-select>

View File

@ -3,12 +3,12 @@
<template #toolbar>
<page-toolbar-button :href="data.meta.links.create" color="primary" icon="plus">Verteiler erstellen</page-toolbar-button>
</template>
<ui-popup heading="Verteiler löschen?" v-if="deleting !== null" @close="deleting.reject()">
<ui-popup v-if="deleting !== null" heading="Verteiler löschen?" @close="deleting.reject()">
<div>
<p class="mt-4">Den Verteiler "{{ deleting.dispatcher.name }}" löschen?</p>
<p>Den Verteiler "{{ deleting.dispatcher.name }}" löschen?</p>
<div class="grid grid-cols-2 gap-3 mt-6">
<a href="#" @click.prevent="deleting.resolve()" class="text-center btn btn-danger">Löschen</a>
<a href="#" @click.prevent="deleting.reject()" class="text-center btn btn-primary">Abbrechen</a>
<a href="#" class="text-center btn btn-danger" @click.prevent="deleting.resolve()">Löschen</a>
<a href="#" class="text-center btn btn-primary" @click.prevent="deleting.reject()">Abbrechen</a>
</div>
</div>
</ui-popup>
@ -32,7 +32,7 @@
</td>
<td>
<i-link :href="dispatcher.links.edit" class="mr-1 inline-flex btn btn-warning btn-sm"><ui-sprite src="pencil"></ui-sprite></i-link>
<button @click.prevent="remove(dispatcher)" class="inline-flex btn btn-danger btn-sm"><ui-sprite src="trash"></ui-sprite></button>
<button class="inline-flex btn btn-danger btn-sm" @click.prevent="remove(dispatcher)"><ui-sprite src="trash"></ui-sprite></button>
</td>
</tr>
</table>
@ -41,6 +41,9 @@
<script>
export default {
props: {
data: {},
},
data: function () {
return {
deleting: null,
@ -60,8 +63,5 @@ export default {
});
},
},
props: {
data: {},
},
};
</script>

View File

@ -5,7 +5,7 @@
</template>
<ui-popup v-if="single !== null" :heading="single.id ? 'Verbindung bearbeiten' : 'Neue Verbindung'" @close="cancel">
<form @submit.prevent="submit">
<section class="grid grid-cols-2 gap-3 mt-6">
<section class="grid grid-cols-2 gap-3">
<f-text id="name" v-model="single.name" name="name" label="Bezeichnung" required></f-text>
<f-select
id="type"

View File

@ -5,7 +5,7 @@
</template>
<ui-popup v-if="single !== null" :heading="single.id ? 'Verbindung bearbeiten' : 'Neue Verbindung'" @close="cancel">
<form @submit.prevent="submit">
<section class="grid grid-cols-2 gap-3 mt-6">
<section class="grid grid-cols-2 gap-3">
<f-text id="name" v-model="single.name" label="Bezeichnung" required></f-text>
<f-text id="domain" v-model="single.domain" label="Domain" required></f-text>
<f-select