diff options
author | Vijay A <avijayr@protonmail.com> | 2021-07-28 19:24:47 +0530 |
---|---|---|
committer | Vijay Raghavan Aravamudhan <vraravam@users.noreply.github.com> | 2021-07-28 15:46:43 +0000 |
commit | d671afec794992d052f6f6b7ea73a571e67db7c1 (patch) | |
tree | 940f97875da81b34465e1981461ec7152c2b08a5 /packages/forms | |
parent | - updated classnames to 2.3.1 to use added type definitions (diff) | |
download | ferdium-app-d671afec794992d052f6f6b7ea73a571e67db7c1.tar.gz ferdium-app-d671afec794992d052f6f6b7ea73a571e67db7c1.tar.zst ferdium-app-d671afec794992d052f6f6b7ea73a571e67db7c1.zip |
Minor refactoring to use the destructured code pattern while importing from other modules.
Diffstat (limited to 'packages/forms')
-rw-r--r-- | packages/forms/src/button/index.tsx | 12 | ||||
-rw-r--r-- | packages/forms/src/input/styles.ts | 4 | ||||
-rw-r--r-- | packages/forms/src/textarea/styles.ts | 4 | ||||
-rw-r--r-- | packages/forms/src/toggle/index.tsx | 6 |
4 files changed, 13 insertions, 13 deletions
diff --git a/packages/forms/src/button/index.tsx b/packages/forms/src/button/index.tsx index 8eba17415..0d036293a 100644 --- a/packages/forms/src/button/index.tsx +++ b/packages/forms/src/button/index.tsx | |||
@@ -1,7 +1,7 @@ | |||
1 | import Icon from '@mdi/react'; | 1 | import Icon from '@mdi/react'; |
2 | import { Theme } from '@meetfranz/theme'; | 2 | import { Theme } from '@meetfranz/theme'; |
3 | import classnames from 'classnames'; | 3 | import classnames from 'classnames'; |
4 | import * as CSS from 'csstype'; | 4 | import { Property } from 'csstype'; |
5 | import React, { Component } from 'react'; | 5 | import React, { Component } from 'react'; |
6 | import injectStyle, { withTheme } from 'react-jss'; | 6 | import injectStyle, { withTheme } from 'react-jss'; |
7 | import Loader from 'react-loader'; | 7 | import Loader from 'react-loader'; |
@@ -34,13 +34,13 @@ const styles = (theme: Theme) => ({ | |||
34 | borderRadius: theme.borderRadiusSmall, | 34 | borderRadius: theme.borderRadiusSmall, |
35 | border: 'none', | 35 | border: 'none', |
36 | display: 'inline-flex', | 36 | display: 'inline-flex', |
37 | position: 'relative' as CSS.Property.Position, | 37 | position: 'relative' as Property.Position, |
38 | transition: 'background .5s, opacity 0.3s', | 38 | transition: 'background .5s, opacity 0.3s', |
39 | textAlign: 'center' as CSS.Property.TextAlign, | 39 | textAlign: 'center' as Property.TextAlign, |
40 | outline: 'none', | 40 | outline: 'none', |
41 | alignItems: 'center', | 41 | alignItems: 'center', |
42 | padding: 0, | 42 | padding: 0, |
43 | width: (props: IProps) => (props.stretch ? '100%' : 'auto') as CSS.Property.Width<string>, | 43 | width: (props: IProps) => (props.stretch ? '100%' : 'auto') as Property.Width<string>, |
44 | fontSize: theme.uiFontSize, | 44 | fontSize: theme.uiFontSize, |
45 | textDecoration: 'none', | 45 | textDecoration: 'none', |
46 | // height: theme.buttonHeight, | 46 | // height: theme.buttonHeight, |
@@ -113,7 +113,7 @@ const styles = (theme: Theme) => ({ | |||
113 | opacity: theme.inputDisabledOpacity, | 113 | opacity: theme.inputDisabledOpacity, |
114 | }, | 114 | }, |
115 | loader: { | 115 | loader: { |
116 | position: 'relative' as CSS.Property.Position, | 116 | position: 'relative' as Property.Position, |
117 | width: 20, | 117 | width: 20, |
118 | height: 18, | 118 | height: 18, |
119 | zIndex: 9999, | 119 | zIndex: 9999, |
@@ -125,7 +125,7 @@ const styles = (theme: Theme) => ({ | |||
125 | transition: 'all 0.3s', | 125 | transition: 'all 0.3s', |
126 | marginLeft: (props: IProps): number => (!props.busy ? 10 : 20), | 126 | marginLeft: (props: IProps): number => (!props.busy ? 10 : 20), |
127 | marginRight: (props: IProps): number => (!props.busy ? -10 : -20), | 127 | marginRight: (props: IProps): number => (!props.busy ? -10 : -20), |
128 | position: (props: IProps): CSS.Property.Position => props.stretch ? 'absolute' : 'inherit', | 128 | position: (props: IProps): Property.Position => props.stretch ? 'absolute' : 'inherit', |
129 | }, | 129 | }, |
130 | icon: { | 130 | icon: { |
131 | margin: [1, 10, 0, -5], | 131 | margin: [1, 10, 0, -5], |
diff --git a/packages/forms/src/input/styles.ts b/packages/forms/src/input/styles.ts index 99b0685a8..1fe6a03cd 100644 --- a/packages/forms/src/input/styles.ts +++ b/packages/forms/src/input/styles.ts | |||
@@ -1,5 +1,5 @@ | |||
1 | import { Theme } from '@meetfranz/theme'; | 1 | import { Theme } from '@meetfranz/theme'; |
2 | import * as CSS from 'csstype'; | 2 | import { Property } from 'csstype'; |
3 | 3 | ||
4 | const prefixStyles = (theme: Theme) => ({ | 4 | const prefixStyles = (theme: Theme) => ({ |
5 | background: theme.inputPrefixBackground, | 5 | background: theme.inputPrefixBackground, |
@@ -85,7 +85,7 @@ export default (theme: Theme) => ({ | |||
85 | background: theme.inputBackground, | 85 | background: theme.inputBackground, |
86 | border: theme.inputBorder, | 86 | border: theme.inputBorder, |
87 | borderRadius: theme.borderRadiusSmall, | 87 | borderRadius: theme.borderRadiusSmall, |
88 | boxSizing: 'border-box' as CSS.Property.BoxSizing, | 88 | boxSizing: 'border-box' as Property.BoxSizing, |
89 | display: 'flex', | 89 | display: 'flex', |
90 | height: theme.inputHeight, | 90 | height: theme.inputHeight, |
91 | order: 1, | 91 | order: 1, |
diff --git a/packages/forms/src/textarea/styles.ts b/packages/forms/src/textarea/styles.ts index f1fb09367..15cc6ca1b 100644 --- a/packages/forms/src/textarea/styles.ts +++ b/packages/forms/src/textarea/styles.ts | |||
@@ -1,5 +1,5 @@ | |||
1 | import { Theme } from '@meetfranz/theme'; | 1 | import { Theme } from '@meetfranz/theme'; |
2 | import * as CSS from 'csstype'; | 2 | import { Property } from 'csstype'; |
3 | 3 | ||
4 | export default (theme: Theme) => ({ | 4 | export default (theme: Theme) => ({ |
5 | label: { | 5 | label: { |
@@ -42,7 +42,7 @@ export default (theme: Theme) => ({ | |||
42 | background: theme.inputBackground, | 42 | background: theme.inputBackground, |
43 | border: theme.inputBorder, | 43 | border: theme.inputBorder, |
44 | borderRadius: theme.borderRadiusSmall, | 44 | borderRadius: theme.borderRadiusSmall, |
45 | boxSizing: 'border-box' as CSS.Property.BoxSizing, | 45 | boxSizing: 'border-box' as Property.BoxSizing, |
46 | display: 'flex', | 46 | display: 'flex', |
47 | order: 1, | 47 | order: 1, |
48 | width: '100%', | 48 | width: '100%', |
diff --git a/packages/forms/src/toggle/index.tsx b/packages/forms/src/toggle/index.tsx index 50716450b..d484cd042 100644 --- a/packages/forms/src/toggle/index.tsx +++ b/packages/forms/src/toggle/index.tsx | |||
@@ -1,6 +1,6 @@ | |||
1 | import { Theme } from '@meetfranz/theme'; | 1 | import { Theme } from '@meetfranz/theme'; |
2 | import classnames from 'classnames'; | 2 | import classnames from 'classnames'; |
3 | import * as CSS from 'csstype'; | 3 | import { Property } from 'csstype'; |
4 | import React, { Component } from 'react'; | 4 | import React, { Component } from 'react'; |
5 | import injectStyle from 'react-jss'; | 5 | import injectStyle from 'react-jss'; |
6 | 6 | ||
@@ -22,7 +22,7 @@ const styles = (theme: Theme) => ({ | |||
22 | background: theme.toggleBackground, | 22 | background: theme.toggleBackground, |
23 | borderRadius: theme.borderRadius, | 23 | borderRadius: theme.borderRadius, |
24 | height: theme.toggleHeight, | 24 | height: theme.toggleHeight, |
25 | position: 'relative' as CSS.Property.Position, | 25 | position: 'relative' as Property.Position, |
26 | width: theme.toggleWidth, | 26 | width: theme.toggleWidth, |
27 | }, | 27 | }, |
28 | button: { | 28 | button: { |
@@ -33,7 +33,7 @@ const styles = (theme: Theme) => ({ | |||
33 | height: theme.toggleHeight - 2, | 33 | height: theme.toggleHeight - 2, |
34 | left: 1, | 34 | left: 1, |
35 | top: 1, | 35 | top: 1, |
36 | position: 'absolute' as CSS.Property.Position, | 36 | position: 'absolute' as Property.Position, |
37 | transition: 'all .5s', | 37 | transition: 'all .5s', |
38 | }, | 38 | }, |
39 | buttonActive: { | 39 | buttonActive: { |