3
0

Fix inline actions for record blocks on hover interaction

This commit is contained in:
Jože Fortun 2024-11-25 11:39:03 +01:00
parent 36878c9dbb
commit ac06c00805
8 changed files with 71 additions and 20 deletions

View File

@ -77,13 +77,22 @@
<th scope="col"> <th scope="col">
{{ $t("type") }} {{ $t("type") }}
</th> </th>
<th scope="col" style="width: 250px;"> <th
scope="col"
style="width: 250px;"
>
{{ $t("valueModifiers") }} {{ $t("valueModifiers") }}
</th> </th>
<th scope="col" style="width: 250px;"> <th
scope="col"
style="width: 250px;"
>
{{ $t("multiValues") }} {{ $t("multiValues") }}
</th> </th>
<th scope="col" style="width: 150px;" /> <th
scope="col"
style="width: 150px;"
/>
</tr> </tr>
</thead> </thead>

View File

@ -97,17 +97,29 @@
> >
<thead class="text-primary"> <thead class="text-primary">
<tr> <tr>
<th scope="col" style="width: auto;" /> <th
scope="col"
style="width: auto;"
/>
<th scope="col" style="min-width: 200px;"> <th
scope="col"
style="min-width: 200px;"
>
{{ $t("navigation.type") }} {{ $t("navigation.type") }}
</th> </th>
<th scope="col" style="min-width: 200px;"> <th
scope="col"
style="min-width: 200px;"
>
{{ $t("navigation.color") }} {{ $t("navigation.color") }}
</th> </th>
<th scope="col" style="min-width: 200px;"> <th
scope="col"
style="min-width: 200px;"
>
{{ $t("navigation.background") }} {{ $t("navigation.background") }}
</th> </th>
@ -119,7 +131,10 @@
{{ $t("navigation.enabled") }} {{ $t("navigation.enabled") }}
</th> </th>
<th scope="col" style="width: auto; min-width: 100px;" /> <th
scope="col"
style="width: auto; min-width: 100px;"
/>
</tr> </tr>
</thead> </thead>

View File

@ -43,13 +43,22 @@
> >
<thead> <thead>
<tr class="text-primary"> <tr class="text-primary">
<th scope="col" style="min-width: 200px;"> <th
scope="col"
style="min-width: 200px;"
>
{{ $t("navigation.text") }} {{ $t("navigation.text") }}
</th> </th>
<th scope="col" style="min-width: 200px;"> <th
scope="col"
style="min-width: 200px;"
>
{{ $t("navigation.url") }} {{ $t("navigation.url") }}
</th> </th>
<th scope="col" style="min-width: 200px;"> <th
scope="col"
style="min-width: 200px;"
>
{{ $t('navigation.openIn') }} {{ $t('navigation.openIn') }}
</th> </th>
<th <th

View File

@ -25,7 +25,7 @@
:label-cols-xl="options.horizontalFieldLayoutEnabled && '5'" :label-cols-xl="options.horizontalFieldLayoutEnabled && '5'"
:content-cols-md="options.horizontalFieldLayoutEnabled && '6'" :content-cols-md="options.horizontalFieldLayoutEnabled && '6'"
:content-cols-xl="options.horizontalFieldLayoutEnabled && '7'" :content-cols-xl="options.horizontalFieldLayoutEnabled && '7'"
:class="columnWrapClass" :class="`field-container ${columnWrapClass}`"
:style="fieldWidth" :style="fieldWidth"
> >
<template #label> <template #label>
@ -167,7 +167,7 @@ export default {
fieldLayoutClass () { fieldLayoutClass () {
const classes = { const classes = {
default: 'd-flex flex-column', default: 'd-flex flex-column gap-2',
noWrap: 'd-flex gap-2', noWrap: 'd-flex gap-2',
wrap: 'row no-gutters', wrap: 'row no-gutters',
} }

View File

@ -21,7 +21,7 @@
<div <div
v-if="canDisplay(field)" v-if="canDisplay(field)"
:key="field.id" :key="field.id"
:class="columnWrapClass" :class="`field-container ${columnWrapClass}`"
:style="fieldWidth" :style="fieldWidth"
> >
<field-editor <field-editor

View File

@ -124,7 +124,10 @@
<tr> <tr>
<th scope="col" /> <th scope="col" />
<th class="d-flex align-items-center text-primary" scope="col"> <th
class="d-flex align-items-center text-primary"
scope="col"
>
{{ $t('tabs.table.columns.title.label') }} {{ $t('tabs.table.columns.title.label') }}
<c-hint <c-hint
:tooltip="$t('interpolationFootnote', ['${record.values.fieldName}', '${recordID}', '${ownerID}', '${userID}'])" :tooltip="$t('interpolationFootnote', ['${record.values.fieldName}', '${recordID}', '${ownerID}', '${userID}'])"

View File

@ -257,18 +257,27 @@
</div> </div>
</th> </th>
<th class="text-primary" scope="col"> <th
class="text-primary"
scope="col"
>
{{ $t('general:label.type') }} {{ $t('general:label.type') }}
</th> </th>
<th scope="col" /> <th scope="col" />
<th scope="col" /> <th scope="col" />
<th class="text-primary text-center pr-3" scope="col"> <th
class="text-primary text-center pr-3"
scope="col"
>
{{ $t('general:label.required') }} {{ $t('general:label.required') }}
</th> </th>
<th class="text-primary text-center pl-2" scope="col"> <th
class="text-primary text-center pl-2"
scope="col"
>
{{ $t('general:label.multi') }} {{ $t('general:label.multi') }}
</th> </th>

View File

@ -258,7 +258,10 @@
> >
<b-thead> <b-thead>
<tr> <tr>
<th scope="col" style="width: 40px;" /> <th
scope="col"
style="width: 40px;"
/>
<th <th
class="text-primary" class="text-primary"
scope="col" scope="col"
@ -273,7 +276,10 @@
> >
{{ $t('page-layout.handle') }} {{ $t('page-layout.handle') }}
</th> </th>
<th scope="col" style="min-width: 100px;" /> <th
scope="col"
style="min-width: 100px;"
/>
</tr> </tr>
</b-thead> </b-thead>