// @flow
/**
* CSS to style the selection psuedo-element.
*
* @example
* // Styles as object usage
* const styles = {
* ...selection({
* 'background': 'blue'
* }, 'section')
* }
*
* // styled-components usage
* const div = styled.div`
* ${selection({'background': 'blue'}, 'section')}
* `
*
* // CSS as JS Output
*
* 'div': {
* 'section::-moz-selection': {
* 'background-color':'blue',
* },
* 'section::selection': {
* 'background-color': 'blue',
* }
* }
*/
function selection(styles: Object, parent: string = '') {
return {
[`${parent}::-moz-selection`]: {
...styles,
},
[`${parent}::selection`]: {
...styles,
},
}
}
export default selection
|