* Revert changes to ButtonToolbar from #3167

Flex gap is still not fully supported.
Keeps a small margin increase.

* Add margin to deck config header

* Move StickyHeader into import-page
This commit is contained in:
RumovZ 2024-05-01 12:08:19 +02:00 committed by GitHub
parent 995d7b1fa5
commit 8ad65d40ff
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 29 additions and 10 deletions

View file

@ -39,6 +39,11 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
.button-toolbar {
flex-wrap: var(--buttons-wrap);
padding-left: 0.15rem;
gap: 1rem;
:global(.button-group) {
/* TODO replace with gap once available (blocked by Qt5 / Chromium 77) */
margin-right: 0.3rem;
margin-bottom: 0.15rem;
}
}
</style>

View file

@ -8,7 +8,6 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
import type Modal from "bootstrap/js/dist/modal";
import { createEventDispatcher, getContext } from "svelte";
import ButtonToolbar from "$lib/components/ButtonToolbar.svelte";
import { modalsKey } from "$lib/components/context-keys";
import Select from "$lib/components/Select.svelte";
import StickyContainer from "$lib/components/StickyContainer.svelte";
@ -93,9 +92,9 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
/>
<StickyContainer --gutter-block="0.5rem" --sticky-borders="0 0 1px" breakpoint="sm">
<ButtonToolbar class="justify-content-between flex-grow-1" wrap={false}>
<div class="button-bar">
<Select
class="flex-grow-1"
class="flex-grow-1 mr1"
bind:value
{label}
list={$configList}
@ -113,5 +112,20 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
on:rename={promptToRename}
on:remove={dispatchPresetChange}
/>
</ButtonToolbar>
</div>
</StickyContainer>
<style lang="scss">
.button-bar {
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
flex-grow: 1;
}
/* TODO replace with gap once available (blocked by Qt5 / Chromium 77) */
:global(.mr1) {
margin-right: 1rem;
}
</style>

View file

@ -15,7 +15,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
import BackendProgressIndicator from "$lib/components/BackendProgressIndicator.svelte";
import Container from "$lib/components/Container.svelte";
import ErrorPage from "$lib/components/ErrorPage.svelte";
import StickyHeader from "$lib/components/StickyHeader.svelte";
import StickyHeader from "./StickyHeader.svelte";
import ImportLogPage from "./ImportLogPage.svelte";

View file

@ -6,10 +6,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
import * as tr from "@generated/ftl";
import { getPlatformString } from "@tslib/shortcuts";
import LabelButton from "./LabelButton.svelte";
import Shortcut from "./Shortcut.svelte";
import StickyContainer from "./StickyContainer.svelte";
import ButtonToolbar from "./ButtonToolbar.svelte";
import ButtonToolbar from "$lib/components/ButtonToolbar.svelte";
import LabelButton from "$lib/components/LabelButton.svelte";
import Shortcut from "$lib/components/Shortcut.svelte";
import StickyContainer from "$lib/components/StickyContainer.svelte";
export let path: string;
export let onImport: () => void;