diff --git a/README.md b/README.md index 537d1c5..906892e 100644 --- a/README.md +++ b/README.md @@ -73,8 +73,18 @@ GitHub Actions already runs these commands automatically during deployments. # ToDo +~~Have a consistency in the font and font sizes (ideally you want to use 2 fonts. One for the header/subtitle and one for the text. You can use this kind of website https://fontjoy.com/ which allow you to pair fonts).~~ + Choose a few main colours for your site (I would suggest black/white/grey but not in solid. You can also use this kind of site: https://coolors.co/palettes/popular/2a4849). +~~Reduce then size of the homepage top image (ideally you want your first articles to be visible on load and not hidden below the fold).~~ + +~~Restyle your links (ideally the link should be back with no underline and you add a css style on hover)~~ + +~~Center pagination~~ + +~~Restyle your article detail page breadcrumbs. You want them to be less visible (I would suggest a light grey colour here)~~ + Right now at the top of the detail page, you have your site breadcrumbs, a title then another title and the font sizes are a bit off and it is hard to understand the role of the second title. I would reorganise this to provide a better understanding to the reader On the detail page, I would suggest you put the `You may also enjoy` straight at the end of the article. Right now it is after comments and you can lose engagement on your site. I would suggest you remove your description from the detail page. I think having it on the home page is enough. You can have a smaller introduction if needed with a read more button or link that will take the reader to a full page description of yourself and your skillset. That will allow you to tell more about yourself and why you do what you do diff --git a/_includes/head.html b/_includes/head.html index d903fb9..c34f5b8 100644 --- a/_includes/head.html +++ b/_includes/head.html @@ -20,7 +20,8 @@ - + + {% if site.head_scripts %} {% for script in site.head_scripts %} diff --git a/_sass/minimal-mistakes/_variables.scss b/_sass/minimal-mistakes/_variables.scss index cb76015..6eb19c7 100644 --- a/_sass/minimal-mistakes/_variables.scss +++ b/_sass/minimal-mistakes/_variables.scss @@ -6,7 +6,7 @@ Typography ========================================================================== */ -// Cardo font is loaded via a tag in the site head +// Cardo and custom web fonts are loaded via tags in the site head $doc-font-size: 16 !default; @@ -32,9 +32,9 @@ $calisto: "Calisto MT", serif !default; $garamond: Garamond, serif !default; // Setting the fonts -$global-font-family: "Open Sans", sans-serif; -$header-font-family: "Montserrat", sans-serif; -$caption-font-family: "Open Sans", sans-serif; +$global-font-family: "Open Sans", Helvetica, Arial, sans-serif; +$header-font-family: "Merriweather", "Times New Roman", serif; +$caption-font-family: "Cardo, serif"; /* type scale */ $type-size-1: 2.441em !default; // ~39.056px diff --git a/assets/css/main.scss b/assets/css/main.scss index 8a01b04..27ef998 100644 --- a/assets/css/main.scss +++ b/assets/css/main.scss @@ -103,3 +103,34 @@ a:hover { .page__hero-button { margin-top: 1px; /* Add some space between the content and the button */ } + +/* Breadcrumbs in light grey */ +.breadcrumbs, +.breadcrumbs a { + color: $light-gray; +} + +/* Center pagination controls */ +.pagination { + text-align: center; +} + +.pagination ul { + display: inline-block; + padding-left: 0; +} + +.pagination li { + float: none; + display: inline-block; +} + +/* Smaller hero section on homepage */ +.layout--home .page__hero--overlay { + padding: 2em 0; +} + +.layout--home .page__hero-image img { + max-height: 40vh; + object-fit: cover; +}