diff options
| author | ManeraKai <manerakai@protonmail.com> | 2024-07-25 15:17:57 +0300 |
|---|---|---|
| committer | ManeraKai <manerakai@protonmail.com> | 2024-07-25 15:17:57 +0300 |
| commit | c6de68c4c4bda3edcf6cf012bd98adea3baf866b (patch) | |
| tree | 419e5cb8cdfe04fd734c5590e78888fa16e58e51 /src/pages/components/Select.svelte | |
| parent | Made Select Frontend searchable and with icons (diff) | |
| download | libredirect-c6de68c4c4bda3edcf6cf012bd98adea3baf866b.zip | |
Migrating popup to svelte
Diffstat (limited to 'src/pages/components/Select.svelte')
| -rw-r--r-- | src/pages/components/Select.svelte | 34 |
1 files changed, 34 insertions, 0 deletions
diff --git a/src/pages/components/Select.svelte b/src/pages/components/Select.svelte new file mode 100644 index 00000000..7829c53e --- /dev/null +++ b/src/pages/components/Select.svelte @@ -0,0 +1,34 @@ +<script> + export let values + export let value + export let onChange + export let ariaLabel +</script> + +<select bind:value on:change={onChange} aria-label={ariaLabel} on:change on:contextmenu on:input> + {#each values as option} + <option value={option.value}>{option.name}</option> + {/each} +</select> + +<style> + select { + font-weight: bold; + box-sizing: border-box; + border-style: solid; + border-color: #767676; + color: var(--text); + font-size: 16px; + padding: 8px; + background-color: var(--bg-secondary); + border: none; + margin: 0; + max-width: 500px; + border-radius: 3px; + } + + select:disabled { + opacity: 0.6; + cursor: not-allowed; + } +</style> |