View index.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8" /> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> | |
<link rel="stylesheet" href="//rsms.me/inter/inter.css" /> | |
<style> | |
html, | |
body { | |
width: 100%; |
View block3.css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
html, | |
body { | |
line-height: 1.5; // <- this will depend on your font | |
} | |
main { | |
width: 50%; | |
margin: 6% 25%; | |
} |
View block2.css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* ↓ This one is for smaller phones ↓ */ | |
@media (max-width: 350px) { | |
html { | |
font-size: 0.9rem; | |
} | |
} | |
/* ↓ These are for high-res displays ↓ */ | |
@media (min-width: 1900px) { | |
html { |
View block1.css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
html, | |
body { | |
font-size: 1rem; | |
} | |
h1 { | |
font-size: 2.25rem; | |
} | |
h2 { |
View starter.css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@import url("https://fonts.xz.style/serve/inter.css"); | |
* { | |
margin: 0; | |
padding: 0; | |
-webkit-box-sizing: border-box; | |
box-sizing: border-box; | |
} | |
html { |
View fonts.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@font-face { | |
font-family: lyon; | |
src: url("../fonts/LyonDisplay-Bold.otf"); | |
font-weight: 800; | |
} | |
@import url("https://fonts.googleapis.com/css2?family=EB+Garamond:wght@500&display=swap"); | |
$font-fam-main: "EB Garamond", serif; | |
$font-fam-headings: lyon, serif; |
View grotesk-vars.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$bg: #1e3b5a; | |
$fg-body: #99b7c3; | |
$fg-headings: #c1d6df; | |
$hr-color: rgba(153, 183, 195, 0.2); | |
$a-color: #d8e9f0; | |
$pre-bg: rgba(153, 183, 195, 0.07); | |
$pre-color: $fg-body; |
View initial-main.css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
:root { | |
font-size: calc(0.75rem + 0.5vw); | |
} | |
.grotesk { | |
width: 60%; | |
margin: 5% 20% 0 20%; | |
} | |
@media (max-width: 500px) { |
View final-index.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const fs = require("fs"); | |
const postMethods = require("./posts"); | |
const config = require("./config"); | |
const addHomePage = require("./homepage"); | |
const posts = fs | |
.readdirSync(config.dev.postsdir) | |
.map(post => post.slice(0, -3)) | |
.map(post => postMethods.createPost(post)) | |
.sort(function(a, b) { |
NewerOlder