jobiqo-cl
Version:
[](https://circleci.com/gh/jobiqo/jobiqo-cl)
45 lines (42 loc) • 1.61 kB
JavaScript
import styled from 'styled-components';
const Item = styled.div `
font-size: ${props => props.theme.select.fontSize};
margin: ${props => props.theme.select.margin};
padding: ${props => props.theme.select.padding};
border-radius: ${props => props.theme.select.borderRadius};
border-width: ${props => props.theme.select.borderWidth};
border-style: ${props => props.theme.select.borderStyle};
border-color: ${props => props.theme.select.borderColor};
position: relative;
cursor: pointer;
display: block;
border: none;
height: auto;
border-top: none;
text-transform: none;
box-shadow: none;
white-space: normal;
word-wrap: normal;
${({ isActive, theme }) => isActive && `background: ${theme.select.item.backgroundHover};`}
${({ isOpen }) => isOpen && `font-weight: 700;`};
`;
const Menu = styled.div `
position: absolute;
z-index: 2;
width: 100%;
background: ${props => props.theme.select.dropMenu.background};
max-height: ${props => props.theme.select.dropMenu.maxHeight};
border-right-width: ${props => props.theme.select.dropMenu.borderWidth};
border-bottom-width: ${props => props.theme.select.dropMenu.borderWidth};
border-left-width: ${props => props.theme.select.dropMenu.borderWidth};
border-radius: ${props => props.theme.select.dropMenu.borderRadius};
border-color: ${props => props.theme.select.dropMenu.borderColor};
box-shadow: ${props => props.theme.select.dropMenu.boxShadow};
border-top-width: 0;
overflow-y: auto;
overflow-x: hidden;
outline: 0;
transition: opacity 0.1s ease;
border-style: solid;
`;
export { Item, Menu };