diff options
| author | Henry Jameson <me@hjkos.com> | 2024-05-22 15:20:42 +0300 |
|---|---|---|
| committer | Henry Jameson <me@hjkos.com> | 2024-05-22 15:20:42 +0300 |
| commit | eb27f1205b7bf077b81d698d24c2be656cc59023 (patch) | |
| tree | 4e7f9d7c7651c20371cdd60fdaa50a5a0a0de1c7 /src/components/input.style.js | |
| parent | daa39b6e8fd0a940615064436c510bedb205dbad (diff) | |
| parent | 51709ad31893714d98bf7c05cd37d1d07fde65ca (diff) | |
Merge branch 'scrobbles-age' of ssh://git.pleroma.social:2222/pleroma/pleroma-fe into scrobbles-age
Diffstat (limited to 'src/components/input.style.js')
| -rw-r--r-- | src/components/input.style.js | 60 |
1 files changed, 60 insertions, 0 deletions
diff --git a/src/components/input.style.js b/src/components/input.style.js new file mode 100644 index 00000000..139a0034 --- /dev/null +++ b/src/components/input.style.js @@ -0,0 +1,60 @@ +const hoverGlow = { + x: 0, + y: 0, + blur: 4, + spread: 0, + color: '--text', + alpha: 1 +} + +export default { + name: 'Input', + selector: '.input', + variant: { + checkbox: '.-checkbox', + radio: '.-radio' + }, + states: { + disabled: ':disabled', + hover: ':hover:not(:disabled)', + focused: ':focus-within' + }, + validInnerComponents: [ + 'Text' + ], + defaultRules: [ + { + component: 'Root', + directives: { + '--defaultInputBevel': 'shadow | $borderSide(#FFFFFF, bottom, 0.2)| $borderSide(#000000, top, 0.2)' + } + }, + { + variant: 'checkbox', + directives: { + roundness: 1 + } + }, + { + directives: { + '--font': 'generic | inherit', + background: '--fg, -5', + roundness: 3, + shadow: [{ + x: 0, + y: 0, + blur: 2, + spread: 0, + color: '#000000', + alpha: 1 + }, '--defaultInputBevel'] + } + }, + { + state: ['hover'], + directives: { + shadow: [hoverGlow, '--defaultInputBevel'] + } + } + ] +} |
