1
0
Fork 0

feat(shared): Consolidate icons, simple spinner

This commit is contained in:
joostdecock 2023-01-28 19:27:11 +01:00
parent a90e2a8a7d
commit 37f7833983
88 changed files with 878 additions and 1116 deletions

View file

@ -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
`}>
`}
>
<>&deg;</>
</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>