fix(modal): repair layout regression

This commit is contained in:
upsiflu 2024-12-25 20:40:41 +01:00
parent b9f405e52d
commit e3529d8753
1 changed files with 4 additions and 5 deletions

View File

@ -119,11 +119,10 @@ const player = computed(() => [
:title="t('components.ShortcutsModal.header.modal')"
v-model="isOpen"
>
<Layout columns style="column-gap: 64px; column-rule: none;">
<Layout grid="auto / repeat(auto-fit, minmax(min-content, max(calc(50% - 16px), 367px)))">
<div
v-for="section in player"
:key="section.title"
style="break-inside: avoid;"
>
<h3 style="margin-top: 0px;">{{ section.title }}</h3>
<layout stack no-gap>
@ -134,7 +133,7 @@ const player = computed(() => [
<layout flex>
<span :class="$style.description" style="align-self: center;">{{ shortcut.summary }}</span>
<Spacer grow />
<Button style="pointer-events:none;" width="auto">{{ shortcut.key }}</Button>
<Button style="pointer-events:none;" min-content>{{ shortcut.key }}</Button>
</layout>
<hr />
</template>
@ -144,7 +143,7 @@ const player = computed(() => [
v-for="section in general"
:key="section.title"
>
<h3>{{ section.title }}</h3>
<h3 style="margin-top: 0px;">{{ section.title }}</h3>
<layout stack no-gap>
<div
v-for="shortcut in section.shortcuts"
@ -153,7 +152,7 @@ const player = computed(() => [
<layout flex>
<span :class="$style.description" style="align-self: center;">{{ shortcut.summary }}</span>
<Spacer grow />
<Button style="pointer-events:none;" width="auto">{{ shortcut.key }}</Button>
<Button style="pointer-events:none;" min-content>{{ shortcut.key }}</Button>
</layout>
<hr />
</div>