Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
'&::-moz-focus-inner': {
border: 0,
padding: 0
}
}
export default {
'.psds-starrating__star': {
...resetButton,
lineHeight: 0
},
[`.psds-starrating__star--theme-${themeNames.dark}`]: {
color: core.colors.gray04
},
[`.psds-starrating__star--theme-${themeNames.light}`]: {
color: core.colors.gray01
},
[`.psds-starrating__star__half__secondary--theme-${themeNames.dark}`]: {
color: core.colors.gray04,
fill: core.colors.gray04 // safari needs this
},
[`.psds-starrating__star__half__secondary--theme-${themeNames.light}`]: {
color: core.colors.gray01,
fill: core.colors.gray01 // safari needs this
},
'.psds-starrating__star--active': {
color: core.colors.yellow
},
'.psds-starrating__star--bright': {
[subtleThemeWithColor(themeNames.dark, colors.yellow)]: {
color: core.colors.yellow,
borderColor: core.colors.yellow
},
[subtleThemeWithColor(themeNames.dark, colors.red)]: {
color: core.colors.red,
borderColor: core.colors.red
},
[subtleThemeWithColor(themeNames.dark, colors.blue)]: {
color: core.colors.blue,
borderColor: core.colors.blue
},
[subtleThemeWithColor(themeNames.light, colors.gray)]: {
color: core.colors.gray04,
backgroundColor: transparentize(0.85, core.colors.gray03)
},
[subtleThemeWithColor(themeNames.light, colors.green)]: {
color: core.colors.gray04,
backgroundColor: transparentize(0.85, core.colors.green)
},
[subtleThemeWithColor(themeNames.light, colors.yellow)]: {
color: core.colors.gray04,
backgroundColor: transparentize(0.85, core.colors.yellow)
},
[subtleThemeWithColor(themeNames.light, colors.red)]: {
color: core.colors.gray04,
backgroundColor: transparentize(0.85, core.colors.red)
},
[subtleThemeWithColor(themeNames.light, colors.blue)]: {
margin: '2px',
borderRadius: '50%',
background: core.colors.blue
},
'.psds-radio-button__input': {
display: 'none'
},
'.psds-radio-button__label': {
color: core.colors.bone,
fontSize: core.type.fontSizeSmall,
lineHeight: core.type.lineHeightStandard,
fontWeight: core.type.fontWeightMedium
},
[`.psds-radio-button__label.psds-theme--${themeNames.light}`]: {
color: core.colors.gray04
}
}
height: '36px',
justifyContent: 'center',
position: 'absolute',
top: '50%',
transition: `transform ${core.motion.speedFast} ease-in-out`,
width: '36px',
'&:hover': { cursor: 'pointer' }
},
[`.psds-carousel__controls__control.psds-theme--${themeNames.dark}`]: {
background: core.colors.gray03,
color: core.colors.white,
'&:hover, &:focus': { background: core.colors.gray04 }
},
[`.psds-carousel__controls__control.psds-theme--${themeNames.light}`]: {
background: core.colors.white,
color: core.colors.gray04,
'&:hover, &:focus': { background: core.colors.bone }
},
[`.psds-carousel__controls__control--${directions.prev}`]: {
left: 0,
transform: 'translate(-50%, -50%)',
'&[hidden]': { transform: 'translate(-50%, -50%) scale(0)' }
},
[`.psds-carousel__controls__control--${directions.next}`]: {
right: 0,
transform: 'translate(50%, -50%)',
'&[hidden]': { transform: 'translate(50%, -50%) scale(0)' }
[`.psds-button--size-${vars.sizes.large}`]: {
fontSize: core.type.fontSizeMedium,
padding: `${core.layout.spacingXXSmall} ${core.layout.spacingMedium}`,
height: '48px'
},
[`.psds-button--appearance-${vars.appearances.secondary}`]: {
color: core.colors.gray01,
background: transparentize(0.75, core.colors.gray02),
'&:not([disabled]):hover': {
color: core.colors.white,
background: transparentize(0.65, core.colors.gray02)
}
},
[`.psds-button--appearance-${vars.appearances.secondary}.psds-theme--${themeNames.light}`]: {
color: core.colors.gray03,
background: transparentize(0.65, core.colors.gray01),
'&:not([disabled]):hover': {
color: core.colors.gray06,
background: transparentize(0.35, core.colors.gray01)
}
},
[`.psds-button--appearance-${vars.appearances.stroke}`]: {
border: `1px solid ${core.colors.orange}`,
color: core.colors.orange,
background: 'none',
'&:not([disabled]):hover': {
border: `1px solid ${core.colors.orangeLight}`,
color: core.colors.orangeLight,
[`.psds-form-button-row--align-${vars.aligns.right}`]: {
justifyContent: 'flex-end'
},
'.psds-form-button-row__button': {
marginRight: core.layout.spacingLarge,
'&:last-child': {
marginRight: 0
}
},
'.psds-form-divider': {
height: '1px',
width: '100%',
backgroundColor: core.colors.gray04
},
[`.psds-form-divider.psds-theme--${themeNames.light}`]: {
backgroundColor: core.colors.gray01
},
'.psds-form-vertical-layout': {
...newStackingContextForFocusRingVisibility,
width: '100%'
},
'.psds-form-vertical-layout__child': {
marginBottom: core.layout.spacingLarge,
'&:last-child': {
marginBottom: 0
}
}
}
[subtleThemeWithColor(themeNames.dark, colors.red)]: {
color: core.colors.red,
borderColor: core.colors.red
},
[subtleThemeWithColor(themeNames.dark, colors.blue)]: {
color: core.colors.blue,
borderColor: core.colors.blue
},
[subtleThemeWithColor(themeNames.light, colors.gray)]: {
color: core.colors.gray04,
backgroundColor: transparentize(0.85, core.colors.gray03)
},
[subtleThemeWithColor(themeNames.light, colors.green)]: {
color: core.colors.gray04,
backgroundColor: transparentize(0.85, core.colors.green)
},
[subtleThemeWithColor(themeNames.light, colors.yellow)]: {
color: core.colors.gray04,
backgroundColor: transparentize(0.85, core.colors.yellow)
},
[subtleThemeWithColor(themeNames.light, colors.red)]: {
color: core.colors.gray04,
backgroundColor: transparentize(0.85, core.colors.red)
},
[subtleThemeWithColor(themeNames.light, colors.blue)]: {
color: core.colors.gray04,
backgroundColor: transparentize(0.85, core.colors.blue)
}
}
opacity: 1
},
'.psds-note__action-bar--meta-sibling': {
marginLeft: core.layout.spacingMedium
},
'.psds-note__action': {
...resetButton,
cursor: 'pointer',
fontSize: core.type.fontSizeXSmall,
transition: `all ${core.motion.speedNormal}`,
'&:hover, &:active': { color: core.colors.white },
'& + &': { marginLeft: core.layout.spacingSmall }
},
[`.psds-note__action.psds-theme--${themeNames.light}`]: {
'&:hover, &:active': { color: core.colors.gray03 }
},
'.psds-note__aside': {
marginRight: core.layout.spacingMedium
},
'.psds-note__contents': {
flex: 1,
paddingTop: core.layout.spacingXXSmall,
maxWidth: '100%',
minWidth: 0,
'& :first-child': { marginTop: 0 },
'& :last-child': { marginBottom: 0 }
},