aboutsummaryrefslogtreecommitdiffstats
path: root/packages/forms/src/input/styles.ts
diff options
context:
space:
mode:
authorLibravatar Vijay Aravamudhan <vraravam@users.noreply.github.com>2021-10-15 16:22:25 +0530
committerLibravatar GitHub <noreply@github.com>2021-10-15 16:22:25 +0530
commitec15f83b947fb2daf4ca1a72e3af527dc89512a3 (patch)
treeea049cee5184a58b5bc09505e723cd19a736c4bd /packages/forms/src/input/styles.ts
parentchore: move 'packages/ui' into 'src' (no longer an injected package) (#2077) (diff)
downloadferdium-app-ec15f83b947fb2daf4ca1a72e3af527dc89512a3.tar.gz
ferdium-app-ec15f83b947fb2daf4ca1a72e3af527dc89512a3.tar.zst
ferdium-app-ec15f83b947fb2daf4ca1a72e3af527dc89512a3.zip
chore: move 'packages/forms' into 'src' (no longer an injected package) (#2079)
Diffstat (limited to 'packages/forms/src/input/styles.ts')
-rw-r--r--packages/forms/src/input/styles.ts102
1 files changed, 0 insertions, 102 deletions
diff --git a/packages/forms/src/input/styles.ts b/packages/forms/src/input/styles.ts
deleted file mode 100644
index 6d56e93b3..000000000
--- a/packages/forms/src/input/styles.ts
+++ /dev/null
@@ -1,102 +0,0 @@
1import { Property } from 'csstype';
2
3import { Theme } from '../../../theme';
4
5const prefixStyles = (theme: Theme) => ({
6 background: theme.inputPrefixBackground,
7 color: theme.inputPrefixColor,
8 lineHeight: `${theme.inputHeight}px`,
9 padding: '0 10px',
10 fontSize: theme.uiFontSize,
11});
12
13export default (theme: Theme) => ({
14 label: {
15 '& > div': {
16 marginTop: 5,
17 },
18 },
19 disabled: {
20 opacity: theme.inputDisabledOpacity,
21 },
22 formModifier: {
23 background: 'none',
24 border: 0,
25 borderLeft: theme.inputBorder,
26 padding: '4px 20px 0',
27 outline: 'none',
28
29 '&:active': {
30 opacity: 0.5,
31 },
32
33 '& svg': {
34 fill: theme.inputModifierColor,
35 },
36 },
37 input: {
38 background: 'none',
39 border: 0,
40 fontSize: theme.uiFontSize,
41 outline: 'none',
42 padding: 8,
43 width: '100%',
44 color: theme.inputColor,
45
46 '&::placeholder': {
47 color: theme.inputPlaceholderColor,
48 },
49 },
50 passwordScore: {
51 background: theme.inputScorePasswordBackground,
52 border: theme.inputBorder,
53 borderTopWidth: 0,
54 borderBottomLeftRadius: theme.borderRadiusSmall,
55 borderBottomRightRadius: theme.borderRadiusSmall,
56 display: 'block',
57 flexBasis: '100%',
58 height: 5,
59 overflow: 'hidden',
60
61 '& meter': {
62 display: 'block',
63 height: '100%',
64 width: '100%',
65
66 '&::-webkit-meter-bar': {
67 background: 'none',
68 },
69
70 '&::-webkit-meter-even-less-good-value': {
71 background: theme.brandDanger,
72 },
73
74 '&::-webkit-meter-suboptimum-value': {
75 background: theme.brandWarning,
76 },
77
78 '&::-webkit-meter-optimum-value': {
79 background: theme.brandSuccess,
80 },
81 },
82 },
83 prefix: prefixStyles(theme),
84 suffix: prefixStyles(theme),
85 wrapper: {
86 background: theme.inputBackground,
87 border: theme.inputBorder,
88 borderRadius: theme.borderRadiusSmall,
89 boxSizing: 'border-box' as Property.BoxSizing,
90 display: 'flex',
91 height: theme.inputHeight,
92 order: 1,
93 width: '100%',
94 },
95 hasPasswordScore: {
96 borderBottomLeftRadius: 0,
97 borderBottomRightRadius: 0,
98 },
99 hasError: {
100 borderColor: theme.brandDanger,
101 },
102});