Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
background: 'none',
color: colors.gray05,
'&:focus': { outline: 'none' }
},
[`.psds-date-picker__sub-field--appearance-${vars.appearances.subtle}`]: {
color: colors.gray01
},
// __sub-field-divider
'.psds-date-picker__sub-field-divider': {
border: 'none',
color: colors.gray05
},
[`.psds-date-picker__sub-field-divider--appearance-${vars.appearances.subtle}`]: {
color: colors.gray01
},
// __field-container
'.psds-date-picker__field-container': {
position: 'relative',
display: 'flex',
borderRadius: '2px',
alignItems: 'center',
width: '100%',
height: '40px',
minWidth: `calc(192px + ${iconWidths.medium} + ${layout.spacingXSmall})`,
padding: `0 calc(${layout.spacingXSmall} + ${iconWidths.medium} + ${layout.spacingXSmall}) 0 ${layout.spacingMedium}`,
background: colors.bone
},
[`.psds-date-picker__field-container.psds-theme--${themeNames.light}`]: {
background: colors.white,
// __field
'.psds-date-picker__field': {
display: 'none'
},
// __sub-field
'.psds-date-picker__sub-field': {
border: 'none',
display: 'inline-block',
background: 'none',
color: colors.gray05,
'&:focus': { outline: 'none' }
},
[`.psds-date-picker__sub-field--appearance-${vars.appearances.subtle}`]: {
color: colors.gray01
},
// __sub-field-divider
'.psds-date-picker__sub-field-divider': {
border: 'none',
color: colors.gray05
},
[`.psds-date-picker__sub-field-divider--appearance-${vars.appearances.subtle}`]: {
color: colors.gray01
},
// __field-container
'.psds-date-picker__field-container': {
position: 'relative',
display: 'flex',
borderRadius: '2px',
}
},
[`.psds-text-input__field.psds-theme--${themeNames.light}`]: {
background: colors.white,
border: `1px solid ${colors.gray02}`,
'&:focus': {
border: '1px solid transparent'
}
},
[`.psds-text-input__field--error.psds-theme--${themeNames.light}`]: {
border: '1px solid transparent'
},
[`.psds-text-input__field--appearance-${vars.appearances.subtle}`]: {
color: colors.gray01,
background: colors.gray06,
border: `1px solid ${colors.gray03}`
},
[`.psds-text-input__field--appearance-${vars.appearances.subtle}.psds-theme--${themeNames.light}`]: {
color: colors.gray05
},
[`.psds-text-input__field--icon-align-${vars.iconAligns.left}`]: {
padding: `0 ${layout.spacingMedium} 0 calc(${layout.spacingXSmall} + ${iconWidths.medium} + ${layout.spacingXSmall})`
},
[`.psds-text-input__field--icon-align-${vars.iconAligns.right}`]: {
padding: `0 calc(${layout.spacingXSmall} + ${iconWidths.medium} + ${layout.spacingXSmall}) 0 ${layout.spacingMedium}`
},
[`.psds-text-input__field--icon-align-${vars.iconAligns.left}.psds-text-input--small`]: {
padding: `0 ${layout.spacingXSmall} 0 ${parseInt(
layout.spacingMedium,
10