diff options
| author | Wolfgang Müller | 2024-11-22 18:17:57 +0100 |
|---|---|---|
| committer | Wolfgang Müller | 2024-11-22 18:17:57 +0100 |
| commit | 387550086a00b5a1b8221c1528e6f616430e7b3c (patch) | |
| tree | b92625ebd3fd658410aa7bce1bdb31e53be72949 /frontend/src/lib/tabs | |
| parent | 940ef5c245d29b1441bfa1a88c808f637075b109 (diff) | |
| download | hircine-trunk.tar.gz | |
Elements now have a consistent style applied to them when in focus.
Additionally, select elements will now have an outline when focused,
making it easier to notice the currently selected element.
Diffstat (limited to '')
| -rw-r--r-- | frontend/src/lib/tabs/Tab.svelte | 2 | ||||
| -rw-r--r-- | frontend/src/lib/tabs/Tabs.svelte | 4 |
2 files changed, 3 insertions, 3 deletions
diff --git a/frontend/src/lib/tabs/Tab.svelte b/frontend/src/lib/tabs/Tab.svelte index 0a6be57..cddd072 100644 --- a/frontend/src/lib/tabs/Tab.svelte +++ b/frontend/src/lib/tabs/Tab.svelte @@ -8,7 +8,7 @@ </script> {#if $context.current === id} - <div class="h-full overflow-auto py-2 pe-3" in:fade={fadeDefault}> + <div class="h-full overflow-auto py-2 pe-3 ps-1" in:fade={fadeDefault}> <slot /> </div> {/if} diff --git a/frontend/src/lib/tabs/Tabs.svelte b/frontend/src/lib/tabs/Tabs.svelte index 09cdbdd..fd5d08e 100644 --- a/frontend/src/lib/tabs/Tabs.svelte +++ b/frontend/src/lib/tabs/Tabs.svelte @@ -8,13 +8,13 @@ <div class="flex h-full max-h-full flex-col"> <nav> - <ul class="me-3 flex border-b-2 border-slate-700 text-sm"> + <ul class="me-3 ms-1 flex border-b-2 border-slate-700 text-sm"> {#each Object.entries($context.tabs) as [id, { title, badge }]} <li class="-mb-0.5"> <button type="button" class:active={$context.current === id} - class="relative flex gap-1 p-1 px-3 hover:border-b-2 hover:border-slate-200" + class="focus-background relative flex gap-1 p-1 px-3 hover:border-b-2 hover:border-slate-200" on:click={() => ($context.current = id)} > {#if badge} |