flashlang/src/frontend/popup/LanguageSelection.svelte

33 lines
808 B
Svelte

<script lang="ts">
import Select from "svelte-select/src/Select.svelte";
export let langs: Array<Language>;
export let selectedValue: Language;
$: console.log(selectedValue);
const getLabel = (o: Language) => o.name;
</script>
<div class="select-styling">
<Select
items={langs}
getOptionLabel={getLabel}
getSelectionLabel={getLabel}
optionIdentifier="code"
isClearable={false}
bind:value={selectedValue}
/>
</div>
<style lang="scss">
@use "../color_scheme.scss";
.select-styling {
--background: var(--background-color-3);
--itemIsActiveBG: var(--background-color-4);
--itemHoverBG: var(--background-color-3);
--listBackground: var(--background-color-2);
--inputColor: var(--text-color-4) !important;
--itemIsActiveColor: var(--text-color-3);
--border: none;
}
</style>