fix: make response schema details selectable

This commit is contained in:
Anya Stasiuk 2020-08-03 09:15:40 +03:00
parent 8b5fc66763
commit 887136db38

View File

@ -1,9 +1,8 @@
import styled from '../styled-components'; import styled from '../styled-components';
import { darken } from 'polished';
export const OneOfList = styled.ul` export const OneOfList = styled.div`
margin: 0 0 3px 0; margin: 0 0 3px 0;
padding: 0;
list-style: none;
display: inline-block; display: inline-block;
`; `;
@ -15,7 +14,7 @@ export const OneOfLabel = styled.span`
} }
`; `;
export const OneOfButton = styled.li<{ active: boolean }>` export const OneOfButton = styled.button<{ active: boolean }>`
display: inline-block; display: inline-block;
margin-right: 10px; margin-right: 10px;
margin-bottom: 5px; margin-bottom: 5px;
@ -23,12 +22,21 @@ export const OneOfButton = styled.li<{ active: boolean }>`
cursor: pointer; cursor: pointer;
border: 1px solid ${props => props.theme.colors.primary.main}; border: 1px solid ${props => props.theme.colors.primary.main};
padding: 2px 10px; padding: 2px 10px;
line-height: 1.5em;
outline: none;
&:focus {
box-shadow: 0 0 0 1px ${props => props.theme.colors.primary.main};
}
${props => { ${props => {
if (props.active) { if (props.active) {
return ` return `
color: white; color: white;
background-color: ${props.theme.colors.primary.main}; background-color: ${props.theme.colors.primary.main};
&:focus {
box-shadow: none;
background-color: ${darken(0.15, props.theme.colors.primary.main)};
}
`; `;
} else { } else {
return ` return `