Skip to content

Commit

Permalink
feat #114 - Update input border radius, refac
Browse files Browse the repository at this point in the history
  • Loading branch information
sam-dassana committed Oct 14, 2020
1 parent bdc39eb commit 01cf065
Show file tree
Hide file tree
Showing 4 changed files with 14 additions and 6 deletions.
11 changes: 9 additions & 2 deletions src/components/Input/utils.ts
Original file line number Diff line number Diff line change
@@ -1,9 +1,15 @@
import {
border,
borderRadius,
fieldErrorStyles
} from 'components/assets/styles/styleguide'
import { themedStyles, ThemeType } from 'components/assets/styles/themes'

const borderStyles = {
border,
borderRadius
}

export const generateInputStyles = (themeType: ThemeType) => {
const { base, disabled, error, focus, hover, placeholder } = themedStyles[
themeType
Expand All @@ -22,6 +28,7 @@ export const generateInputStyles = (themeType: ThemeType) => {
borderColor: hover.borderColor
},
backgroundColor: base.backgroundColor,
...borderStyles,
borderColor: base.borderColor,
color: base.color
},
Expand All @@ -42,8 +49,8 @@ export const generateInputSkeletonStyles = (themeType: ThemeType) => {
const { loading } = themedStyles[themeType]

return {
border: loading.border,
borderRadius: borderRadius,
...borderStyles,
borderColor: loading.border,
padding: '6px 14px'
}
}
5 changes: 3 additions & 2 deletions src/components/RadioGroup/utils.ts
Original file line number Diff line number Diff line change
@@ -1,11 +1,12 @@
import { borderRadius } from 'components/assets/styles/styleguide'
import { border, borderRadius } from 'components/assets/styles/styleguide'
import { themedStyles, ThemeType } from 'components/assets/styles/themes'

export const generateRadioSkeletonStyles = (themeType: ThemeType) => {
const { loading } = themedStyles[themeType]

return {
border: loading.border,
border,
borderColor: loading.border,
borderRadius: borderRadius,
display: 'flex',
margin: '0 1px'
Expand Down
1 change: 1 addition & 0 deletions src/components/assets/styles/styleguide.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import colors from './colors'

export const border = '1px solid'
export const borderRadius = 4
export const defaultFieldWidth = '300px'
export const fieldErrorStyles = {
Expand Down
3 changes: 1 addition & 2 deletions src/components/assets/styles/themes.ts
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,6 @@ const lightPalette: Theme = {
secondary: blacks['lighten-90']
},
border: blacks['lighten-80'],

primary: blues.base,
state: {
active: blacks.base,
Expand Down Expand Up @@ -108,7 +107,7 @@ const generateThemedStyles = ({ state, background, border, text }: Theme) => {
}

const loading = {
border: `1px solid ${state.loading.primary}`
border: state.loading.primary
}

const placeholder = {
Expand Down

0 comments on commit 01cf065

Please sign in to comment.