blog/themes/classic/sass/default/core/_typography.scss

125 lines
2.8 KiB
SCSS
Raw Normal View History

$type-border: #ddd;
$type-color-light: #555;
$type-color: #000;
$blockquote: $type-border !default; //darken($type-border, 20) !default;
$mono: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace;
// Fonts
//@include font-face("Adelle", font-files("adellebasic_bold-webfont.woff", woff, "adellebasic_bold-webfont.ttf", truetype, "adellebasic_bold-webfont.svg#webfontKykxqSyz", svg), $eot: "adellebasic_bold-webfont.eot" );
.heading {
font-family: "PT Serif", "Georgia", "Helvetica Neue", Arial, sans-serif;
}
.sans { font-family: "PT Sans", "Helvetica Neue", Arial, sans-serif; }
.serif { font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; }
.mono { font-family: $mono; }
body > header h1 {
font-size: 2em;
@extend .heading;
font-weight: normal;
line-height: 1.2em;
margin-bottom: 0.6667em;
}
body {
line-height: 1.5em;
color: $type-color;
@extend .serif;
}
#{headings()}{
@extend .heading;
text-rendering: optimizelegibility;
margin-bottom: 1em;
font-weight: normal;
}
h1 {
font-size: 2.4em;
line-height: 1.2em
}
h2, section h1 {
font-size: 1.5em;
}
h3, section h2, section section h1 {
font-size: 1.3em;
}
h4, section h3, section section h2, section section section h1 {
font-size: 1em;
}
h5, section h4, section section h3 {
font-size: .9em;
}
h6, section h5, section section h4, section section section h3 {
font-size: .8em;
}
p, blockquote, ul, ol { margin-bottom: 1.5em; }
ul{ list-style-type: disc; }
ol{ list-style-type: decimal; ol { list-style-type: lower-alpha; } }
ul ul, ol ol { margin-left: 1.75em; }
li { margin-bottom: .5em; }
strong { font-weight: bold; }
em { font-style: italic; }
sup, sub { font-size: 0.8em; position: relative; display: inline-block; }
sup { top: -.5em; }
sub { bottom: -.5em; }
q { font-style: italic;
&:before { content: "\201C"; }
&:after { content: "\201D"; }
}
em, dfn { font-style: italic; }
strong, dfn { font-weight: bold; }
del, s { text-decoration: line-through; }
abbr, acronym { border-bottom: 1px dotted; cursor: help; }
pre, code, tt { @extend .mono-font; }
sub, sup { line-height: 0; }
hr { margin-bottom: 0.2em; }
small { font-size: .8em; }
big { font-size: 1.2em; }
blockquote {
$bq-margin: 1.2em;
font-style: italic;
position: relative;
margin-left: $bq-margin;
> p {
&:first-child:before {
content: "\201C";
position: absolute;
top: 0.1em;
left: -.5em;
font-size: 3em;
color: $blockquote;
}
&:last-child:after {
content: "\201D";
position: relative;
top: 0.3em;
line-height: 0;
font-size: 2em;
color: $blockquote;
}
}
+ p > cite {
margin-left: $bq-margin;
text-align: right;
&:before { content: ' '; color: $type-color-light; }
a { font-style: italic; }
}
}