From 3c936ea792df75ac5b3d1b1e47ddcfde0e89432d Mon Sep 17 00:00:00 2001 From: Wouter Groeneveld Date: Tue, 10 Jul 2018 11:43:09 +0200 Subject: [PATCH] typografie volledig gewijzigd --- config.toml | 2 +- layouts/index.html | 4 +-- static/css/brainbaking.css | 72 +++++++++++++++++++++++++++++++++----- 3 files changed, 67 insertions(+), 11 deletions(-) diff --git a/config.toml b/config.toml index cf5f77c8..2afa18e1 100644 --- a/config.toml +++ b/config.toml @@ -22,7 +22,7 @@ enableEmoji = true highlight = true highlightStyle = "paraiso-dark" highlightLanguages = ["cs", "c", "scheme", "python", "java", "scala", "javascript"] - font = "Open Sans" + font = "Cambria" copyright = "No reserved - sharing is caring. Hack away! Brain Baking" [Author] diff --git a/layouts/index.html b/layouts/index.html index aa02122f..bf8b5a98 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -41,9 +41,9 @@
-

+

 {{ markdownify .Site.Params.Description }}: -

+ {{ range (.Paginator 1).Pages.ByDate.Reverse }} {{ .Date.Format (.Site.Params.dateFormat | default "2 January 2006") | $.Scratch.Set "subtitle" }} diff --git a/static/css/brainbaking.css b/static/css/brainbaking.css index 5d2ea6a5..bbe34262 100644 --- a/static/css/brainbaking.css +++ b/static/css/brainbaking.css @@ -60,9 +60,64 @@ img.bordered { /** general **/ -/* voor 20'+ breedbeeldschermen de main content verhogen */ -@media only screen and (min-width: 1600px) { +/* -- Typography overrides bootstrap. + -- default CSS included, can't override less settings from https://getbootstrap.com/docs/3.3/customize/ */ +main { + font-size: 14pt !important; + line-height: 1.7; +} +nav { + font-family: 'Open Sans', sans-serif !important; + font-size: 14px !important; + line-height: 1.4 !important; +} + +h1, h2, h3, h4, h5, h6 { + line-height: 1.8 !important; + font-weight: bold !important; +} + +h2 { + font-size: 26pt !important; +} + +h3 { + font-size: 22pt !important; +} + +h4 { + font-size: 16pt !important; +} + +pre { + font-size: 12pt !important; +} + +@media (max-width: 767px) { + main { + font-size: 12pt !important; + } + h2 { + font-size: 24pt !important; + } + + h3 { + font-size: 20pt !important; + } + + h4 { + font-size: 14pt !important; + } + + pre { + font-size: 10pt !important; + } +} + +/* -- voor 20'+ breedbeeldschermen */ +@media only screen and (min-width: 1600px) { + /* de main content verhogen */ main { max-width: 930px !important; } @@ -70,7 +125,14 @@ img.bordered { .big-img .container { height: 250px !important; } +} +/* -- voor fatsoenlijke schermen */ +@media only screen and (min-width: 768px) { + /* indien header image, hoogte vergroten */ + .big-img .container { + height: 150px; + } } blockquote { @@ -102,12 +164,6 @@ main .text-justify blockquote p { border-bottom: 1px solid var(--accent); } -@media only screen and (min-width: 768px) { - .big-img .container { - height: 150px; - } -} - /* --- goodreads widget styles --- */ .gr_grid_container { }