msfjarvis.dev/themes/codex/assets/scss/partials/_typography.scss
Harsh Shandilya 9f9fce4b9a Merge remote-tracking branch 'codex/master' into src
* codex/master: (137 commits)
  docs: update .all-contributorsrc [skip ci]
  docs: update README.md [skip ci]
  Fix nav display error when expanding window with open burger.
  fix icon sizes
  docs: update .all-contributorsrc [skip ci]
  docs: update README.md [skip ci]
  Conform icons to Google's mobile usability reqs
  fix relative icon issue + add title
  docs: Clean up README and config.toml (#65)
  update screenshot and add to README
  v1.5.0
  added resources folder back
  refactor: revert md/js files
  refactor: use semicolon in js
  refactor: ignore exampleSite/content dir
  change bottom padding of pages to 1rem
  update CONTRIBUTING.md
  add prettier
  v1.4.0
  fix script block
  ...

Signed-off-by: Harsh Shandilya <me@msfjarvis.dev>
2020-07-12 03:09:52 +05:30

152 lines
2.2 KiB
SCSS

@import "vars";
$baseFontSize: 16;
$fontSizeMobile: 14;
$baseLineHeight: 1.5;
$scale: 1.414;
$leading: $baseLineHeight * 1rem;
html {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
-webkit-font-smoothing: antialiased;
font-size: 95%;
@media screen and (min-width: $medium) {
font-size: 100%;
}
@media screen and (min-width: $large) {
font-size: 115%;
}
}
h1,
h2,
h3,
h4,
h5,
h6 {
margin-top: $leading;
margin-bottom: 0;
line-height: $leading;
}
h1 {
font-size: 1.5 * $scale * 1rem;
line-height: 1.5 * $leading;
margin-top: 1.5 * $leading;
}
h2 {
font-size: $scale * 1rem;
}
h3 {
font-size: ($scale / 1.2) * 1rem;
}
h4 {
font-size: ($scale / 1.44) * 1rem;
}
h5 {
font-size: ($scale / 1.728) * 1rem;
}
p {
margin-top: $leading;
margin-bottom: 0;
line-height: $leading;
}
ul,
ol {
padding-left: $leading;
margin-top: $leading;
margin-bottom: $leading;
li {
line-height: $leading;
}
ul,
ol {
margin-top: 0;
margin-bottom: 0;
}
}
blockquote {
&::before {
position: absolute;
content: "\201C";
font-size: 6em;
font-family: "Roboto", serif;
margin-top: 0.1em;
margin-left: -0.2em;
z-index: -1;
color: darken($white, 7%);
}
margin-top: $leading;
margin-bottom: $leading;
line-height: $leading;
color: $black;
cite {
&::before {
content: "";
}
font-style: italic;
font-size: 0.95em;
color: $darkGrey;
}
}
pre {
line-height: 1.45;
margin-top: $leading;
padding: 16px;
word-wrap: normal;
overflow: auto;
background-color: #f6f8fa;
border-radius: 3px;
}
code {
font-size: 85%;
font-family: "SFMono-Regular", Consolas, Menlo, monospace;
padding: 0.2em 0.4em;
margin: 0;
background-color: rgba(27, 31, 35, 0.05);
border-radius: 3px;
}
pre > code {
word-break: normal;
white-space: pre;
}
pre code {
display: inline;
padding: 0;
margin: 0;
overflow: visible;
line-height: inherit;
word-wrap: normal;
background-color: transparent;
border: 0;
}
.lead {
font-size: $scale * 1rem;
}
abbr[title] {
text-decoration: underline double;
}