mirror of
https://github.com/ankitects/anki.git
synced 2025-09-21 15:32:23 -04:00
tweak deckconfig top area formatting
I suspect there's a better way to ensure selector and save button are shown on the same line on both large and small widths; PRs are welcome.
This commit is contained in:
parent
76eb119870
commit
3abe6168aa
3 changed files with 16 additions and 12 deletions
|
@ -17,6 +17,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
:global(h2) {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
:global(input, select) {
|
||||
font-size: 16px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div>
|
||||
|
|
|
@ -23,7 +23,8 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
<style lang="scss">
|
||||
.form-select {
|
||||
display: inline-block;
|
||||
width: 70%;
|
||||
grid-row: 2;
|
||||
grid-column: 1 / 4;
|
||||
}
|
||||
|
||||
.outer {
|
||||
|
@ -40,10 +41,9 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
}
|
||||
|
||||
.inner {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
display: grid;
|
||||
width: 35em;
|
||||
|
||||
grid-template-columns: 1fr 1fr 1fr 1fr;
|
||||
& > :global(*) {
|
||||
padding-left: 0.5em;
|
||||
padding-right: 0.5em;
|
||||
|
@ -57,7 +57,9 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
|
||||
<div class="outer">
|
||||
<div class="inner">
|
||||
<div>{tr.actionsOptionsFor({ val: state.currentDeck.name })}</div>
|
||||
<div style="grid-column: 1 / 4;">
|
||||
{tr.actionsOptionsFor({ val: state.currentDeck.name })}
|
||||
</div>
|
||||
|
||||
<!-- svelte-ignore a11y-no-onchange -->
|
||||
<select class="form-select" on:change={blur}>
|
||||
|
@ -68,7 +70,9 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
{/each}
|
||||
</select>
|
||||
|
||||
<OptionsDropdown {state} />
|
||||
<div style="grid-row: 2; align-items: right;">
|
||||
<OptionsDropdown {state} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -19,20 +19,16 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||
.inner {
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
:global(input, select) {
|
||||
font-size: 16px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="modal">
|
||||
<!-- filled in later-->
|
||||
</div>
|
||||
|
||||
<ConfigSelector {state} />
|
||||
|
||||
<div class="outer">
|
||||
<div class="inner">
|
||||
<ConfigSelector {state} />
|
||||
|
||||
<ConfigEditor {state} />
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue