1
0
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:
slowbackspace 2018-12-13 14:16:14 +01:00
parent 462205650d
commit d5d59b32b8
5 changed files with 13 additions and 8 deletions

View File

@ -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);
`;

View File

@ -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);
`;

View File

@ -64,6 +64,6 @@ export const TRANSITION = {
};
export const LINE_HEIGHT = {
SMALL: '1.4',
SMALL: '1.42857143',
BASE: '1.8',
};

View File

@ -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};

View File

@ -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};
`;