enhance grid gap to fit others components

This commit is contained in:
Jordan Blasenhauer 2024-06-20 18:38:20 +02:00
parent 3c22faed8d
commit cec5035777
6 changed files with 15 additions and 25 deletions

View file

@ -168,14 +168,6 @@ body {
@apply relative w-full;
}
.setting.field-container {
@apply px-3 md:px-4 mt-3 mb-4;
}
.table.field-container {
@apply p-0 m-0 -translate-x-1;
}
.input-header-container {
@apply z-20;
}
@ -500,6 +492,9 @@ body {
@apply col-span-12 grid grid-cols-12 w-full relative;
}
.layout-settings {
@apply py-4 gap-x-8 gap-y-8 col-span-12 grid grid-cols-12 w-full relative;
}
/* POPOVER */
@ -1030,11 +1025,11 @@ body {
}
.list-details-container {
@apply col-span-12 grid grid-cols-12 gap-2 my-4;
@apply col-span-12 grid grid-cols-12 gap-3 py-2;
}
.list-details-item {
@apply z-0 px-3 py-2 m-1 min-h-12 relative flex justify-between items-center transition rounded;
@apply z-0 px-3 py-2 min-h-12 relative flex justify-between items-center transition rounded;
}
.enabled.list-details-item {
@ -1132,6 +1127,8 @@ body {
@apply absolute top-0 right-0 min-w-12 dark:brightness-90 flex justify-center items-center w-12 h-12 text-center rounded-circle;
}
/* FORM */
.form-advanced-container {
@ -1142,9 +1139,6 @@ body {
@apply col-span-12 w-full;
}
.form-advanced-settings-container {
@apply grid grid-cols-12 w-full relative;
}
.form-easy-container {
@apply col-span-12 w-full;
@ -1154,10 +1148,6 @@ body {
@apply col-span-12 w-full mt-3 mb-2;
}
.form-easy-step-settings-container {
@apply grid grid-cols-12 w-full relative;
}
.form-raw-container {
@apply col-span-12 w-full;
}

File diff suppressed because one or more lines are too long

View file

@ -293,7 +293,7 @@ onUnmounted(() => {
<Title type="content" :title="plugin.name" />
<Subtitle type="content" :subtitle="plugin.description" />
<Container class="form-advanced-settings-container">
<Container class="layout-settings">
<template
v-for="(setting, name, index) in plugin.settings"
:key="index"

View file

@ -162,7 +162,7 @@ onUnmounted(() => {
/>
<Subtitle type="content" :subtitle="step.subtitle" />
<Container class="form-easy-step-settings-container">
<Container class="layout-settings">
<template
v-for="(setting, name, index) in step.settings"
:key="index"

View file

@ -101,7 +101,10 @@ onBeforeMount(() => {
:containerClass="`col-span-12 w-full`"
:columns="props.columns"
>
<Grid v-if="data.modes.length > 1 || data.templates.length > 1">
<Grid
:gridClass="'layout-settings'"
v-if="data.modes.length > 1 || data.templates.length > 1"
>
<Combobox
v-if="data.templates.length > 1"
v-bind="comboboxTemplate"

View file

@ -143,10 +143,7 @@ function filterData(filter, value) {
</script>
<template>
<Container
v-if="filters.base"
:containerClass="`grid grid-cols-12 col-span-12 w-full`"
>
<Container v-if="filters.base" :containerClass="'layout-settings'">
<slot></slot>
<template v-for="filter in filters.base">
<Input