angular/aio/src/styles/0-base/_typography.scss
2017-03-29 23:55:43 -07:00

130 lines
2.1 KiB
SCSS
Executable File

// @mixin docs-site-typography() {
// .docs-component-viewer-tabbed-content .docs-component-view-text-content,
// .docs-guide-content {
body {
font-family: $main-font;
margin: 0;
color: $darkgray;
font-size: 14px;
}
h1 {
display:inline-block;
font-size: 36px;
font-weight: 400;
margin: 12px 0px;
}
h1:after {
content: "";
display: block;
height: 1px;
width: 40%;
margin: 30px 0px 10px;
background: $lightgray;
}
h2 {
font-size: 30px;
font-weight: 500;
margin: 48px 0px 32px;
}
h3 {
font-size: 24px;
font-weight: 500;
margin: 12px 0px;
text-transform: uppercase;
}
h4 {
font-size: 24px;
font-weight: 400;
margin: 8px 0px;
}
h5 {
font-size: 18px;
font-weight: 500;
margin: 8px 0px;
text-transform: uppercase;
}
.mat-tab-body-wrapper h2 {
margin-top: 0px;
}
p, ol, ul, ol, li, input, a {
font-size: 14px;
line-height: 24px;
letter-spacing: 0.30px;
}
ol li {
margin: 14px 0px;
}
a {
text-decoration: none;
}
.mat-toolbar-row a {
font-size: 18px;
font-weight: 300;
color: white;
font-family: $main-font;
text-transform: uppercase;
}
table {
border-collapse: collapse;
border-radius: 2px;
border-spacing: 0;
margin: 0 0 32px 0;
width: 100%;
}
table tbody th {
max-width: 100px;
padding: 13px 32px;
text-align: left;
}
td {
font-weight: 400;
padding: 8px 30px;
p {
margin: 0;
}
}
th {
font-size: 16px;
font-weight: 500;
padding: 13px 32px;
text-align: left;
}
p > code {
font-family: $code-font;
font-size: 90%;
color: $blue;
letter-spacing: 0;
line-height: 1;
padding: 2px 4px;
background-color: $backgroundgray;
border-radius: 4px;
}
.sidenav-content a {
color: $blue;
&:hover {
color: $mediumgray;
}
}
// }
// }