UNPKG

@formant/ava-react

Version:

React components of AVA.

84 lines 2.51 kB
import styled from 'styled-components'; import { getThemeColor } from "../theme"; export var H1 = styled.h1.withConfig({ displayName: "H1", componentId: "ava-react-d63f__sc-1b0jp9x-0" })(["font-size:28px;line-height:36px;margin:26px 0 10px 0;color:", ";"], function (_ref) { var theme = _ref.theme, palette = _ref.palette; return getThemeColor({ colorToken: 'colorBase', theme: theme, palette: palette, type: 'text' }); }); export var Headline = styled(H1).withConfig({ displayName: "Headline", componentId: "ava-react-d63f__sc-1b0jp9x-1" })(["border-bottom:1px solid rgb(199,199,199);"]); export var H2 = styled.h2.withConfig({ displayName: "H2", componentId: "ava-react-d63f__sc-1b0jp9x-2" })(["font-size:24px;line-height:32px;margin:21px 0 5px 0;color:", ";"], function (_ref2) { var theme = _ref2.theme, palette = _ref2.palette; return getThemeColor({ colorToken: 'colorBase', theme: theme, palette: palette, type: 'text' }); }); export var H3 = styled.h3.withConfig({ displayName: "H3", componentId: "ava-react-d63f__sc-1b0jp9x-3" })(["font-size:20px;line-height:28px;margin:16px 0 5px 0;color:", ";"], function (_ref3) { var theme = _ref3.theme, palette = _ref3.palette; return getThemeColor({ colorToken: 'colorBase', theme: theme, palette: palette, type: 'text' }); }); export var H4 = styled.h4.withConfig({ displayName: "H4", componentId: "ava-react-d63f__sc-1b0jp9x-4" })(["font-size:16px;line-height:24px;margin:10px 0 5px 0;color:", ";"], function (_ref4) { var theme = _ref4.theme, palette = _ref4.palette; return getThemeColor({ colorToken: 'colorBase', theme: theme, palette: palette, type: 'text' }); }); export var H5 = styled.h5.withConfig({ displayName: "H5", componentId: "ava-react-d63f__sc-1b0jp9x-5" })(["line-height:24px;font-size:15px;margin:8px 0 5px 0;color:", ";"], function (_ref5) { var theme = _ref5.theme, palette = _ref5.palette; return getThemeColor({ colorToken: 'colorBase', theme: theme, palette: palette, type: 'text' }); }); export var H6 = styled.h6.withConfig({ displayName: "H6", componentId: "ava-react-d63f__sc-1b0jp9x-6" })(["min-height:24px;line-height:24px;letter-spacing:0.008em;font-size:15px;color:", ";"], function (_ref6) { var theme = _ref6.theme, palette = _ref6.palette; return getThemeColor({ colorToken: 'colorBase', theme: theme, palette: palette, type: 'text' }); });