feat(shared): Consolidate icons, simple spinner
This commit is contained in:
parent
a90e2a8a7d
commit
37f7833983
88 changed files with 878 additions and 1116 deletions
|
@ -1,13 +1,14 @@
|
|||
import { useState } from 'react'
|
||||
import ClearIcon from 'shared/components/icons/clear.js'
|
||||
import { ClearIcon } from 'shared/components/icons.mjs'
|
||||
import { useTranslation } from 'next-i18next'
|
||||
|
||||
const DesignOptionList = props => {
|
||||
const DesignOptionList = (props) => {
|
||||
const { t } = useTranslation([`o_${props.design.designConfig.data.name}`])
|
||||
const { dflt, list, doNotTranslate=false } = props.design.patternConfig.options[props.option]
|
||||
const val = (typeof props.gist?.options?.[props.option] === 'undefined')
|
||||
? dflt
|
||||
: props.gist.options[props.option]
|
||||
const { dflt, list, doNotTranslate = false } = props.design.patternConfig.options[props.option]
|
||||
const val =
|
||||
typeof props.gist?.options?.[props.option] === 'undefined'
|
||||
? dflt
|
||||
: props.gist.options[props.option]
|
||||
|
||||
const [value, setValue] = useState(val)
|
||||
|
||||
|
@ -27,39 +28,39 @@ const DesignOptionList = props => {
|
|||
<div className="py-4 mx-6 border-l-2 pl-2">
|
||||
<div className="flex flex-row">
|
||||
<div className="grow">
|
||||
{list.map(choice => (
|
||||
<button key={choice}
|
||||
{list.map((choice) => (
|
||||
<button
|
||||
key={choice}
|
||||
onClick={() => handleChange(choice)}
|
||||
className={`
|
||||
mr-1 mb-1 text-left text-lg w-full
|
||||
${choice === value
|
||||
? choice === dflt
|
||||
? 'text-secondary'
|
||||
: 'text-accent'
|
||||
: 'text-base-content'
|
||||
${
|
||||
choice === value
|
||||
? choice === dflt
|
||||
? 'text-secondary'
|
||||
: 'text-accent'
|
||||
: 'text-base-content'
|
||||
}
|
||||
`}
|
||||
>
|
||||
<span className={`
|
||||
<span
|
||||
className={`
|
||||
text-3xl mr-2 inline-block p-0 leading-3
|
||||
translate-y-3
|
||||
`}>
|
||||
`}
|
||||
>
|
||||
<>°</>
|
||||
</span>
|
||||
{doNotTranslate
|
||||
? choice
|
||||
: props.ot(`o_${props.design.designConfig.data.name}:${props.option}.o.${choice}`)
|
||||
}
|
||||
: props.ot(`o_${props.design.designConfig.data.name}:${props.option}.o.${choice}`)}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
<button
|
||||
title={t('reset')}
|
||||
className=""
|
||||
disabled={val === dflt}
|
||||
onClick={reset}
|
||||
>
|
||||
<span className={val===dflt ? 'text-base' : 'text-accent'}><ClearIcon /></span>
|
||||
<button title={t('reset')} className="" disabled={val === dflt} onClick={reset}>
|
||||
<span className={val === dflt ? 'text-base' : 'text-accent'}>
|
||||
<ClearIcon />
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue