Fixes mobile button layout for Definition component
This commit is contained in:
@@ -62,6 +62,7 @@ const ButtonBase = styled.button<ButtonInterface>`
|
||||
border-color: ${props => (props.isTransparent && !props.isWithArrow) && 'rgba(255, 255, 255, .4)'};
|
||||
color: ${props => props.isAccentColor ? props.theme.linkColor : (props.color || props.theme.textColor)};
|
||||
padding: ${props => (!props.isNoPadding && !props.isWithArrow) && '18px 30px'};
|
||||
white-space: ${props => props.isWithArrow && 'nowrap'};
|
||||
text-align: center;
|
||||
font-size: ${props => props.isWithArrow ? '20px' : '18px'};
|
||||
text-decoration: none;
|
||||
|
@@ -116,10 +116,21 @@ const TextWrap = styled.div<Props>`
|
||||
`;
|
||||
|
||||
const LinkWrap = styled.div`
|
||||
display: inline-flex;
|
||||
margin-top: 60px;
|
||||
|
||||
a + a {
|
||||
margin-left: 60px;
|
||||
@media (min-width: 768px) {
|
||||
display: inline-flex;
|
||||
|
||||
a + a {
|
||||
margin-left: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
max-width: 250px;
|
||||
|
||||
a + a {
|
||||
margin-top: 15px;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
Reference in New Issue
Block a user