mirror of
https://github.com/trezor/trezor-wallet
synced 2024-12-30 19:00:53 +00:00
line-height refactoring
This commit is contained in:
parent
462205650d
commit
d5d59b32b8
@ -3,7 +3,12 @@ import Textarea from 'react-textarea-autosize';
|
||||
import PropTypes from 'prop-types';
|
||||
import styled, { css } from 'styled-components';
|
||||
import colors from 'config/colors';
|
||||
import { FONT_SIZE, FONT_WEIGHT, FONT_FAMILY } from 'config/variables';
|
||||
import {
|
||||
FONT_SIZE,
|
||||
FONT_WEIGHT,
|
||||
LINE_HEIGHT,
|
||||
FONT_FAMILY,
|
||||
} from 'config/variables';
|
||||
|
||||
const Wrapper = styled.div`
|
||||
width: 100%;
|
||||
@ -130,7 +135,7 @@ const TrezorAction = styled.div`
|
||||
bottom: -25px;
|
||||
color: ${colors.WHITE};
|
||||
border-radius: 5px;
|
||||
line-height: 37px;
|
||||
line-height: ${LINE_HEIGHT.TREZOR_ACTION};
|
||||
z-index: 10002;
|
||||
transform: translate(-1px, -1px);
|
||||
`;
|
||||
|
@ -7,6 +7,7 @@ import Icon from 'components/Icon';
|
||||
import {
|
||||
FONT_SIZE,
|
||||
FONT_WEIGHT,
|
||||
LINE_HEIGHT,
|
||||
TRANSITION,
|
||||
} from 'config/variables';
|
||||
|
||||
@ -38,7 +39,7 @@ const StyledInput = styled.input`
|
||||
height: ${props => (props.height ? `${props.height}px` : '40px')};
|
||||
padding: 5px ${props => (props.hasIcon ? '40px' : '12px')} 6px 12px;
|
||||
|
||||
line-height: 1.42857143;
|
||||
line-height: ${LINE_HEIGHT.SMALL};
|
||||
font-size: ${props => (props.isSmallText ? `${FONT_SIZE.SMALL}` : `${FONT_SIZE.BASE}`)};
|
||||
font-weight: ${FONT_WEIGHT.MEDIUM};
|
||||
color: ${props => (props.color ? props.color : colors.TEXT)};
|
||||
@ -116,7 +117,7 @@ const TrezorAction = styled.div`
|
||||
background: black;
|
||||
color: ${colors.WHITE};
|
||||
border-radius: 5px;
|
||||
line-height: 37px;
|
||||
line-height: ${LINE_HEIGHT.TREZOR_ACTION};
|
||||
z-index: 10002;
|
||||
transform: translate(-1px, -1px);
|
||||
`;
|
||||
|
@ -64,6 +64,6 @@ export const TRANSITION = {
|
||||
};
|
||||
|
||||
export const LINE_HEIGHT = {
|
||||
SMALL: '1.4',
|
||||
SMALL: '1.42857143',
|
||||
BASE: '1.8',
|
||||
};
|
||||
|
@ -1,6 +1,6 @@
|
||||
import { css } from 'styled-components';
|
||||
import colors from 'config/colors';
|
||||
import { FONT_SIZE } from 'config/variables';
|
||||
import { FONT_SIZE, LINE_HEIGHT } from 'config/variables';
|
||||
|
||||
const tooltipStyles = css`
|
||||
.rc-tooltip {
|
||||
@ -20,7 +20,7 @@ const tooltipStyles = css`
|
||||
padding: 8px 10px;
|
||||
color: ${colors.WHITE};
|
||||
font-size: ${FONT_SIZE.SMALL};
|
||||
line-height: 1.5;
|
||||
line-height: ${LINE_HEIGHT.SMALL};
|
||||
text-align: left;
|
||||
text-decoration: none;
|
||||
background-color: ${colors.TOOLTIP_BACKGROUND};
|
||||
|
@ -18,7 +18,6 @@ const Item = styled.div`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: ${FONT_SIZE.BASE};
|
||||
line-height: 24px;
|
||||
cursor: pointer;
|
||||
color: ${colors.TEXT_SECONDARY};
|
||||
`;
|
||||
|
Loading…
Reference in New Issue
Block a user