CheckboxList, Modal, Select, & .link-group fixes

This commit is contained in:
venashial
2022-07-01 17:20:08 -07:00
parent c8a2fb92d2
commit 4c7fc79843
6 changed files with 20 additions and 7 deletions

View File

@@ -5,7 +5,7 @@
import IconCircle from 'virtual:icons/lucide/circle'
import IconTriangle from 'virtual:icons/lucide/triangle'
let selected = []
let selected = ['TRI']
</script>
<CheckboxList

View File

@@ -20,7 +20,9 @@
<div class="checkbox-list" class:wrap>
{#each options as option}
<Checkbox on:change={(e) => handleChange(e, option.value)}>
<Checkbox
on:change={(e) => handleChange(e, option.value)}
checked={value && value.includes(option.value)}>
{#if option.icon && typeof option.icon === 'string'}
{@html option.icon}
{:else if option.icon}

View File

@@ -17,9 +17,18 @@
export let defaultData: Record<string, any> = {}
export let data: Record<string, any> = defaultData
$: if (open === true && typeof window !== 'undefined') {
setTimeout(() => {
window.dispatchEvent(new Event('resize'))
}, 300)
}
$: if (open === false) {
data = defaultData
}
function close() {
open = false
data = defaultData
}
function trigger() {

View File

@@ -12,11 +12,11 @@
export let options: Option[] = []
export let value: string | number
export let selected: Option | undefined
export let color = ''
export let label = ''
export let icon = null
let selected: Option | undefined
let open = false
let direction = 'down'
let checkingDirection = false

View File

@@ -23,7 +23,9 @@
color: var(--color-link);
}
&:last-child {
&:last-child:nth-child(2),
&:last-child:nth-child(5),
&:last-child:nth-child(8) {
margin-right: auto;
}
}

View File

@@ -37,7 +37,7 @@ input:focus-visible,
input,
button,
a,
textarea {
.text-input textarea {
transition: outline 0.1s ease-in-out;
}
@@ -49,7 +49,7 @@ a,
}
input[type='text']:focus-visible,
textarea:focus-visible {
.text-input textarea:focus-visible {
outline: 0.25rem solid hsla(155, 58%, 44%, 0.7);
}