diff options
Diffstat (limited to 'packages/forms/src/textarea/styles.ts')
-rw-r--r-- | packages/forms/src/textarea/styles.ts | 53 |
1 files changed, 53 insertions, 0 deletions
diff --git a/packages/forms/src/textarea/styles.ts b/packages/forms/src/textarea/styles.ts new file mode 100644 index 000000000..c1cbd76a5 --- /dev/null +++ b/packages/forms/src/textarea/styles.ts | |||
@@ -0,0 +1,53 @@ | |||
1 | import { Theme } from '@meetfranz/theme'; | ||
2 | import CSS from 'csstype'; | ||
3 | |||
4 | export default (theme: Theme) => ({ | ||
5 | label: { | ||
6 | '& > div': { | ||
7 | marginTop: 5, | ||
8 | }, | ||
9 | }, | ||
10 | disabled: { | ||
11 | opacity: theme.inputDisabledOpacity, | ||
12 | }, | ||
13 | formModifier: { | ||
14 | background: 'none', | ||
15 | border: 0, | ||
16 | borderLeft: theme.inputBorder, | ||
17 | padding: '4px 20px 0', | ||
18 | outline: 'none', | ||
19 | |||
20 | '&:active': { | ||
21 | opacity: 0.5, | ||
22 | }, | ||
23 | |||
24 | '& svg': { | ||
25 | fill: theme.inputModifierColor, | ||
26 | }, | ||
27 | }, | ||
28 | textarea: { | ||
29 | background: 'none', | ||
30 | border: 0, | ||
31 | fontSize: theme.uiFontSize, | ||
32 | outline: 'none', | ||
33 | padding: 8, | ||
34 | width: '100%', | ||
35 | color: theme.inputColor, | ||
36 | |||
37 | '&::placeholder': { | ||
38 | color: theme.inputPlaceholderColor, | ||
39 | }, | ||
40 | }, | ||
41 | wrapper: { | ||
42 | background: theme.inputBackground, | ||
43 | border: theme.inputBorder, | ||
44 | borderRadius: theme.borderRadiusSmall, | ||
45 | boxSizing: 'border-box' as CSS.BoxSizingProperty, | ||
46 | display: 'flex', | ||
47 | order: 1, | ||
48 | width: '100%', | ||
49 | }, | ||
50 | hasError: { | ||
51 | borderColor: theme.brandDanger, | ||
52 | }, | ||
53 | }); | ||