Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
color: colors.bone,
fontSize: type.fontSizeSmall,
lineHeight: '16px',
fontWeight: type.fontWeightMedium,
paddingBottom: layout.spacingXSmall
},
[`.psds-text-input__label.psds-theme--${themeNames.light}`]: {
color: colors.gray05
},
// __sub-label
'.psds-text-input__sub-label': {
color: colors.gray02,
fontSize: type.fontSizeXSmall,
lineHeight: '16px',
fontWeight: type.fontWeightMedium,
paddingTop: layout.spacingXSmall
},
[`.psds-text-input__sub-label.psds-theme--${themeNames.light}`]: {
color: colors.gray03
},
// __error
'.psds-text-input__error': {
position: 'absolute',
right: `calc(-1 * (${iconWidths.medium} + ${layout.spacingXSmall}))`,
display: 'flex',
alignItems: 'center',
color: colors.red,
marginLeft: layout.spacingXSmall
}
}
background: 'none',
border: 'none'
},
[`.psds-date-picker__icon.psds-theme--${themeNames.light}`]: {
color: colors.gray02
},
[`.psds-date-picker__icon--appearance-${vars.appearances.subtle}`]: {
color: colors.gray02
},
// __label
'.psds-date-picker__label': {
color: colors.bone,
fontSize: type.fontSizeSmall,
lineHeight: '16px',
fontWeight: type.fontWeightMedium,
paddingBottom: layout.spacingXSmall
},
[`.psds-date-picker__label.psds-theme--${themeNames.light}`]: {
color: colors.gray05
},
// __sub-label
'.psds-date-picker__sub-label': {
color: colors.gray02,
fontSize: type.fontSizeXSmall,
lineHeight: '16px',
fontWeight: type.fontWeightMedium,
paddingTop: layout.spacingXSmall
},
[`.psds-date-picker__sub-label.psds-theme--${themeNames.light}`]: {
color: colors.gray03
color: colors.gray02
},
[`.psds-text-input__icon--icon-align-${vars.iconAligns.right}`]: {
left: 'auto',
right: layout.spacingXSmall
},
[`.psds-text-input__icon--appearance-${vars.appearances.subtle}`]: {
color: colors.gray02
},
// __label
'.psds-text-input__label': {
color: colors.bone,
fontSize: type.fontSizeSmall,
lineHeight: '16px',
fontWeight: type.fontWeightMedium,
paddingBottom: layout.spacingXSmall
},
[`.psds-text-input__label.psds-theme--${themeNames.light}`]: {
color: colors.gray05
},
// __sub-label
'.psds-text-input__sub-label': {
color: colors.gray02,
fontSize: type.fontSizeXSmall,
lineHeight: '16px',
fontWeight: type.fontWeightMedium,
paddingTop: layout.spacingXSmall
},
[`.psds-text-input__sub-label.psds-theme--${themeNames.light}`]: {
color: colors.gray03
'.psds-date-picker__calendar': ({ slide }) => ({
position: 'relative',
zIndex: '0',
width: '286px',
maxHeight: '352px',
background: colors.white,
color: colors.gray03,
borderRadius: '2px',
padding: `${layout.spacingMedium} ${layout.spacingLarge}`,
fontSize: type.fontSizeXSmall,
fontWeight: type.fontWeightMedium,
boxShadow: `0 2px 4px ${transparentize(0.5, colors.black)}`,
opacity: 0,
transform: `translateY(calc(-1 * ${layout.spacingXSmall}))`,
animation: `${slide || 'psds-date-picker__calendar__keyframes__slide'} ${
motion.speedNormal
} forwards`
}),
background: colors.white,
border: `1px solid ${colors.gray02}`
},
'.psds-text-area__field-container': {
position: 'relative',
display: 'flex',
alignItems: 'center'
},
'.psds-text-area__label': {
width: '100%',
color: colors.bone,
fontSize: type.fontSizeSmall,
lineHeight: '16px',
fontWeight: type.fontWeightMedium,
paddingBottom: layout.spacingXSmall
},
[`.psds-text-area__label.psds-theme--${themeNames.light}`]: {
color: colors.gray05
},
'.psds-text-area__sub-label': {
color: colors.gray02,
fontSize: type.fontSizeXSmall,
lineHeight: '16px',
fontWeight: type.fontWeightMedium,
paddingTop: layout.spacingXSmall
},
[`.psds-text-area__sub-label.psds-theme--${themeNames.light}`]: {
color: colors.gray03
},
width: '100%',
color: colors.bone,
fontSize: type.fontSizeSmall,
lineHeight: '16px',
fontWeight: type.fontWeightMedium,
paddingBottom: layout.spacingXSmall
},
[`.psds-text-area__label.psds-theme--${themeNames.light}`]: {
color: colors.gray05
},
'.psds-text-area__sub-label': {
color: colors.gray02,
fontSize: type.fontSizeXSmall,
lineHeight: '16px',
fontWeight: type.fontWeightMedium,
paddingTop: layout.spacingXSmall
},
[`.psds-text-area__sub-label.psds-theme--${themeNames.light}`]: {
color: colors.gray03
},
'.psds-text-area__error': {
position: 'absolute',
right: `calc(-1 * (${iconWidths.medium} + ${layout.spacingXSmall}))`,
display: 'flex',
alignItems: 'flex-start',
height: '100%',
paddingTop: layout.spacingXSmall,
marginLeft: layout.spacingXSmall,
color: colors.red
}