diff --git a/assets/custom-fonts.scss b/assets/custom-fonts.scss index 30f57217..8596fd08 100644 --- a/assets/custom-fonts.scss +++ b/assets/custom-fonts.scss @@ -1,158 +1,139 @@ -/* fraunces-regular - latin */ +/* bitter-300 - latin */ @font-face { - font-family: 'Fraunces'; + font-family: 'Bitter'; font-style: normal; - font-weight: 400; + font-weight: 300; src: local(''), - url('/fonts/Fraunces9ptSoft-Thin.woff2') format('woff2'); + url('../fonts/bitter-v16-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('../fonts/bitter-v16-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ } -/* fraunces-italic - latin */ +/* bitter-300italic - latin */ @font-face { - font-family: 'Fraunces'; + font-family: 'Bitter'; font-style: italic; - font-weight: 400; + font-weight: 300; src: local(''), - url('/fonts/Fraunces9ptSoft-ThinItalic.woff2') format('woff2'); + url('../fonts/bitter-v16-latin-300italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('../fonts/bitter-v16-latin-300italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ } -/* Metropolis-regular - latin */ +/* fraunces-200 - latin */ @font-face { - font-family: 'Metropolis'; + font-family: 'Fraunces'; font-style: normal; - font-weight: 400; + font-weight: 200; src: local(''), - url('/fonts/Metropolis-Light.woff2') format('woff2'), - url('/fonts/Metropolis-Light.woff') format('woff'); + url('../fonts/fraunces-v3-latin-200.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('../fonts/fraunces-v3-latin-200.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ } -/* Metropolis-italic - latin */ +/* fraunces-200italic - latin */ @font-face { - font-family: 'Metropolis'; + font-family: 'Fraunces'; font-style: italic; - font-weight: 400; + font-weight: 200; src: local(''), - url('/fonts/Metropolis-LightItalic.woff2') format('woff2'), - url('/fonts/Metropolis-LightItalic.woff') format('woff'); + url('../fonts/fraunces-v3-latin-200italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('../fonts/fraunces-v3-latin-200italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ } -/* bitter-300 - latin */ +/* spectral-200 - latin */ @font-face { - font-family: 'Bitter'; + font-family: 'Spectral'; font-style: normal; - font-weight: 300; + font-weight: 200; src: local(''), - url('../fonts/bitter-v16-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ - url('../fonts/bitter-v16-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ + url('../fonts/spectral-v6-latin-200.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('../fonts/spectral-v6-latin-200.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ } -/* bitter-300italic - latin */ +/* spectral-200italic - latin */ @font-face { - font-family: 'Bitter'; + font-family: 'Spectral'; font-style: italic; - font-weight: 300; + font-weight: 200; src: local(''), - url('../fonts/bitter-v16-latin-300italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ - url('../fonts/bitter-v16-latin-300italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ + url('../fonts/spectral-v6-latin-200italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('../fonts/spectral-v6-latin-200italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ } - -/* commissioner-regular - latin */ +/* Metropolis-regular - latin */ @font-face { - font-family: 'Commissioner'; + font-family: 'Metropolis'; font-style: normal; font-weight: 400; src: local(''), - url('/fonts/Commissioner-Light.woff2') format('woff2'); + url('/fonts/Metropolis-Light.woff2') format('woff2'), + url('/fonts/Metropolis-Light.woff') format('woff'); } -/* commissioner-italic - latin */ +/* Metropolis-italic - latin */ @font-face { - font-family: 'Commissioner'; + font-family: 'Metropolis'; font-style: italic; font-weight: 400; src: local(''), - url('/fonts/Commissioner-LightItalic.woff2') format('woff2'); + url('/fonts/Metropolis-LightItalic.woff2') format('woff2'), + url('/fonts/Metropolis-LightItalic.woff') format('woff'); } -/* eb-garamond-regular - latin */ +/* commissioner-regular - latin */ @font-face { - font-family: 'EB Garamond'; + font-family: 'Commissioner'; font-style: normal; font-weight: 400; src: local(''), - url('../fonts/eb-garamond-v14-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ - url('../fonts/eb-garamond-v14-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ -} - -/* eb-garamond-600 - latin */ -@font-face { - font-family: 'EB Garamond'; - font-style: normal; - font-weight: 600; - src: local(''), - url('../fonts/eb-garamond-v14-latin-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ - url('../fonts/eb-garamond-v14-latin-600.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ + url('/fonts/Commissioner-Light.woff2') format('woff2'); } -/* eb-garamond-italic - latin */ +/* commissioner-italic - latin */ @font-face { - font-family: 'EB Garamond'; + font-family: 'Commissioner'; font-style: italic; font-weight: 400; src: local(''), - url('../fonts/eb-garamond-v14-latin-italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ - url('../fonts/eb-garamond-v14-latin-italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ -} - -/* eb-garamond-600italic - latin */ -@font-face { - font-family: 'EB Garamond'; - font-style: italic; - font-weight: 600; - src: local(''), - url('../fonts/eb-garamond-v14-latin-600italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ - url('../fonts/eb-garamond-v14-latin-600italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ + url('/fonts/Commissioner-LightItalic.woff2') format('woff2'); } -/* alegreya-sans-regular - latin */ +/* sarabun-300 - latin */ @font-face { - font-family: 'Alegreya Sans'; + font-family: 'Sarabun'; font-style: normal; font-weight: 400; src: local(''), - url('../fonts/alegreya-sans-v13-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ - url('../fonts/alegreya-sans-v13-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ + url('../fonts/sarabun-v8-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('../fonts/sarabun-v8-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ } -/* alegreya-sans-italic - latin */ +/* sarabun-300italic - latin */ @font-face { - font-family: 'Alegreya Sans'; + font-family: 'Sarabun'; font-style: italic; font-weight: 400; src: local(''), - url('../fonts/alegreya-sans-v13-latin-italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ - url('../fonts/alegreya-sans-v13-latin-italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ + url('../fonts/sarabun-v8-latin-300italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('../fonts/sarabun-v8-latin-300italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ } -/* alegreya-sans-700 - latin */ +/* sarabun-500 - latin */ @font-face { - font-family: 'Alegreya Sans'; + font-family: 'Sarabun'; font-style: normal; - font-weight: 700; + font-weight: 500; src: local(''), - url('../fonts/alegreya-sans-v13-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ - url('../fonts/alegreya-sans-v13-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ + url('../fonts/sarabun-v8-latin-500.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('../fonts/sarabun-v8-latin-500.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ } -/* alegreya-sans-700italic - latin */ +/* sarabun-500italic - latin */ @font-face { - font-family: 'Alegreya Sans'; + font-family: 'Sarabun'; font-style: italic; - font-weight: 700; + font-weight: 500; src: local(''), - url('../fonts/alegreya-sans-v13-latin-700italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ - url('../fonts/alegreya-sans-v13-latin-700italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ + url('../fonts/sarabun-v8-latin-500italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('../fonts/sarabun-v8-latin-500italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ } {{ with $.Site.Params.customtextFontFamily }} diff --git a/assets/scaffold.scss b/assets/scaffold.scss index d50a37b6..2954b5cc 100644 --- a/assets/scaffold.scss +++ b/assets/scaffold.scss @@ -207,7 +207,7 @@ form { @extend .#{$buttonTextColor}; } .action.text { - @extend .db, .mb4, .ttu, .tracked, .b, .link ; + @extend .db, .mb4, .ttu, .tracked, .fw5, .link ; } } diff --git a/config.toml b/config.toml index 82093101..f19363dd 100644 --- a/config.toml +++ b/config.toml @@ -34,7 +34,7 @@ enableEmoji = true logo = "/img/blogophonic-mark-dark.png" mainSections = ["blog", "project", "talk"] show_social_links = true - navallcaps = true + navallcaps = false # Default image for social sharing and search engines. # Place image file in `static` folder and specify image name here. sharing_image = "/img/papillons.jpg" @@ -46,14 +46,14 @@ enableEmoji = true textFontFamily = "sans-serif" headingFontFamily = "sans-serif" # alternatively, use a built-in font-family - # serif options: Fraunces / EB Garamond / Bitter - # sans-serif options: Commissioner / Alegreya Sans / Metropolis + # serif options: Bitter / Fraunces / Spectral + # sans-serif options: Commissioner / Metropolis / Sarabun customtextFontFamily = "Commissioner" - customheadingFontFamily = "Fraunces" + customheadingFontFamily = "Spectral" # use a built-in color theme # one of: forest / grayscale / peach / plum / - # poppy / sky / violet / water + # poppy / violet / water / sky / theme = "sky" # or, leave theme empty & make your own palette diff --git a/content/elements/index.html b/content/elements/index.html index 2ef109ab..a4791db8 100644 --- a/content/elements/index.html +++ b/content/elements/index.html @@ -10,34 +10,34 @@
-
Font Sizes
+

Font Sizes

- - - - - - - - + + + + + + + + - - - - - - - - + + + + + + + +
AAAAAAAAAAAAAAAA
6rem
(96px)
5rem
(80px)
3rem
(48px)
2.25rem
(36px)
1.5rem
(24px)
1.25rem
(20px)
1rem
(16px)
.875rem
(14px)
6rem
(96px)
5rem
(80px)
3rem
(48px)
2.25rem
(36px)
1.5rem
(24px)
1.25rem
(20px)
1rem
(16px)
.875rem
(14px)
-
Type Samples
+

Type Samples

Head­line

Sub­head­line

Level 1 Heading

@@ -49,7 +49,7 @@

Level 3 Heading

Cras mattis consectetur purus sit amet fermentum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Fusce dapibus, tellus ac cursus commodo.

Level 4 Heading

Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam id dolor id nibh ultricies vehicula ut id elit. Aenean lacinia bibendum nulla sed consectetur.

-
More Type Samples
+

More Type Samples

Discipline in typography is a prime virtue. Individuality must be secured by means that are rational. Distinction needs to be won by simplicity and restraint. It is equally true that these qualities need to be infused wiht a certain spirit and vitality, or they degenerate into dullness and mediocrity.

―Stanley Morison @@ -75,7 +75,7 @@
More Type Samples
-
Sample Forms
+

Sample Forms

Sample Form @@ -111,7 +111,7 @@
Sample Forms
-
Sample Table
+

Sample Table

@@ -146,7 +146,7 @@
Sample Table
-
Sample Highlight Shortcode
+

Sample Highlight Shortcode

{{< highlight css >}}.grid-container { display: grid; grid-template-columns: repeat(3, 1fr); @@ -156,7 +156,7 @@
Sample Highlight Shortco margin: 0px auto; max-width: 1440px; }{{< /highlight >}} -
Sample Figure Shortcode
+

Sample Figure Shortcode

{{< figure src="https://via.placeholder.com/1024x768/DDD/EEE?text=4:3" alt="A sample 4:3 ratio image" caption="This is an image caption provided through a figure shortcode using figcaption." >}} diff --git a/layouts/_default/list.html b/layouts/_default/list.html index a5bf1b82..3590aba4 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -2,8 +2,8 @@

{{ .Title | markdownify }}

- {{ with .Description }}

{{ . | markdownify }}

{{ end }} - {{ if .Params.show_author_byline }}

{{ if .Params.author }}Written by {{ .Params.author }}{{ end }}

{{ end }} + {{ with .Description }}

{{ . | markdownify }}

{{ end }} + {{ if .Params.show_author_byline }}

{{ if .Params.author }}Written by {{ .Params.author }}{{ end }}

{{ end }}
{{ $caller := . }} diff --git a/layouts/about/list.html b/layouts/about/list.html index 9fb02e23..5de7ef7d 100644 --- a/layouts/about/list.html +++ b/layouts/about/list.html @@ -8,8 +8,8 @@ {{ $header := printf "/%s/%s" .Section "header/index.md" }} {{ with site.GetPage $header }} - {{ if .Params.excerpt }}

{{ .Params.excerpt | markdownify }}{{ else }}{{ .Summary | markdownify }}

{{ end }} +

{{ if .Params.excerpt }}{{ .Params.excerpt | markdownify }}{{ else }}{{ .Summary | markdownify }}{{ end }}