diff --git a/ts/deck-options/DeckOptionsPage.svelte b/ts/deck-options/DeckOptionsPage.svelte index e503ea708..29231472d 100644 --- a/ts/deck-options/DeckOptionsPage.svelte +++ b/ts/deck-options/DeckOptionsPage.svelte @@ -6,8 +6,6 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html import type { Writable } from "svelte/store"; import Container from "../components/Container.svelte"; - import DynamicallySlottable from "../components/DynamicallySlottable.svelte"; - import Item from "../components/Item.svelte"; import Row from "../components/Row.svelte"; import type { DynamicSvelteComponent } from "../sveltelib/dynamicComponent"; import Addons from "./Addons.svelte"; @@ -67,63 +65,47 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html --gutter-block="0.75rem" class="container-columns" > - - - - - - +
+ + + - - - - - + + + - - - - - + + + - - - - - + + + - - - - - + + + +
- - - - - +
+ + + - - - - - + + + {#if $addons.length} - - - - - + + + {/if} - - - - - - + + + +
@@ -133,22 +115,14 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html .deck-options-page { overflow-x: hidden; + :global(.container-columns) { + display: grid; + gap: 20px; + } + @include bp.with-breakpoint("lg") { - :global(.container) { - display: block; - } - :global(.container-columns) { - column-count: 2; - column-gap: 5em; - - :global(.container) { - break-inside: avoid; - } - } - - :global(.row-columns) { - display: block; + grid-template-columns: repeat(2, 1fr); } } }