Use Heading sizes
parent
ffe3a7bfa7
commit
10c34a7072
|
@ -55,7 +55,7 @@ export default React.createClass({
|
|||
return (
|
||||
<figure className={style.figure} style={styleFigure}>
|
||||
{ this.props.subtitle ? <small>{this.props.subtitle}</small> : null }
|
||||
{ this.props.title ? <h2>{this.props.title}</h2> : null }
|
||||
{ this.props.title ? <h5>{this.props.title}</h5> : null }
|
||||
{ this.props.color ? <div className={style.overflow} style={styleOverflow}></div> : null }
|
||||
</figure>
|
||||
);
|
||||
|
|
|
@ -98,7 +98,7 @@ $card-text-overlay: unquote("rgba(#{$color-black}, 0.2)");
|
|||
}
|
||||
.figure {
|
||||
padding: 0;
|
||||
> h2 {
|
||||
> h5 {
|
||||
padding: $offset;
|
||||
font-size: $font-size-small;
|
||||
font-weight: $font-weight-bold;
|
||||
|
|
|
@ -61,7 +61,7 @@ input:not([type="checkbox"]):not([type="radio"]), button {
|
|||
}
|
||||
|
||||
//-- App wrapper to allow overlays to block scroll
|
||||
[data-toolbox-app] {
|
||||
[data-react-toolbox-app] {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
@ -70,6 +70,32 @@ input:not([type="checkbox"]):not([type="radio"]), button {
|
|||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
// -- Font sizes
|
||||
h1 {
|
||||
font-size: 112px;
|
||||
font-weight: 300;
|
||||
}
|
||||
h2 {
|
||||
font-size: 56px;
|
||||
font-weight: 400;
|
||||
}
|
||||
h3 {
|
||||
font-size: 45px;
|
||||
font-weight: 400;
|
||||
}
|
||||
h4 {
|
||||
font-size: 34px;
|
||||
font-weight: 400;
|
||||
}
|
||||
h5 {
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
}
|
||||
h6 {
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
//-- Flex
|
||||
[data-flex] {
|
||||
display: flex;
|
||||
|
|
Loading…
Reference in New Issue