From a3c03c25cffbeb61e311a11fb283229a8abcb0c6 Mon Sep 17 00:00:00 2001 From: Daniel Schadt Date: Sun, 3 Jul 2022 11:59:27 +0200 Subject: fix element The main issue was this: Our body has a slightly lower font weight of 300, so "bolder" works out to be 400 - which is a barely noticable increase. The reason for this is that "bolder" (and "lighter") are relative font weights, but they only work relative to certain "breakpoints" - and 300 was just a notch below the next breakpoint of 400 [1]. By setting the font-weight of "strong" to 700 directly, we get a noticable boldness increase instead, though we might tone it down just a notch in the future. In order to prevent font issues in the future, we've now also included all proper variants of OpenSans, so that all font styles are available to us, using the webfonts helper tool [2]. [1]: https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight#meaning_of_relative_weights [2]: https://google-webfonts-helper.herokuapp.com/fonts --- fietsboek/static/fonts.css | 121 +++++++++++++++++++++ fietsboek/static/fonts/OpenSans-Regular.ttf | Bin 129796 -> 0 bytes .../static/fonts/open-sans-v29-latin-300.woff | Bin 0 -> 20748 bytes .../static/fonts/open-sans-v29-latin-300.woff2 | Bin 0 -> 16812 bytes .../fonts/open-sans-v29-latin-300italic.woff | Bin 0 -> 21928 bytes .../fonts/open-sans-v29-latin-300italic.woff2 | Bin 0 -> 17828 bytes .../static/fonts/open-sans-v29-latin-500.woff | Bin 0 -> 20772 bytes .../static/fonts/open-sans-v29-latin-500.woff2 | Bin 0 -> 16812 bytes .../fonts/open-sans-v29-latin-500italic.woff | Bin 0 -> 21868 bytes .../fonts/open-sans-v29-latin-500italic.woff2 | Bin 0 -> 17896 bytes .../static/fonts/open-sans-v29-latin-600.woff | Bin 0 -> 20664 bytes .../static/fonts/open-sans-v29-latin-600.woff2 | Bin 0 -> 16796 bytes .../fonts/open-sans-v29-latin-600italic.woff | Bin 0 -> 21812 bytes .../fonts/open-sans-v29-latin-600italic.woff2 | Bin 0 -> 17836 bytes .../static/fonts/open-sans-v29-latin-700.woff | Bin 0 -> 20164 bytes .../static/fonts/open-sans-v29-latin-700.woff2 | Bin 0 -> 16360 bytes .../fonts/open-sans-v29-latin-700italic.woff | Bin 0 -> 21244 bytes .../fonts/open-sans-v29-latin-700italic.woff2 | Bin 0 -> 17396 bytes .../static/fonts/open-sans-v29-latin-800.woff | Bin 0 -> 20656 bytes .../static/fonts/open-sans-v29-latin-800.woff2 | Bin 0 -> 16724 bytes .../fonts/open-sans-v29-latin-800italic.woff | Bin 0 -> 21520 bytes .../fonts/open-sans-v29-latin-800italic.woff2 | Bin 0 -> 17704 bytes .../static/fonts/open-sans-v29-latin-italic.woff | Bin 0 -> 21848 bytes .../static/fonts/open-sans-v29-latin-italic.woff2 | Bin 0 -> 17816 bytes .../static/fonts/open-sans-v29-latin-regular.woff | Bin 0 -> 20704 bytes .../static/fonts/open-sans-v29-latin-regular.woff2 | Bin 0 -> 16720 bytes fietsboek/static/theme.css | 4 + fietsboek/templates/layout.jinja2 | 8 +- 28 files changed, 126 insertions(+), 7 deletions(-) create mode 100644 fietsboek/static/fonts.css delete mode 100644 fietsboek/static/fonts/OpenSans-Regular.ttf create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-300.woff create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-300.woff2 create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-300italic.woff create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-300italic.woff2 create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-500.woff create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-500.woff2 create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-500italic.woff create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-500italic.woff2 create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-600.woff create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-600.woff2 create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-600italic.woff create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-600italic.woff2 create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-700.woff create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-700.woff2 create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-700italic.woff create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-700italic.woff2 create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-800.woff create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-800.woff2 create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-800italic.woff create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-800italic.woff2 create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-italic.woff create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-italic.woff2 create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-regular.woff create mode 100644 fietsboek/static/fonts/open-sans-v29-latin-regular.woff2 diff --git a/fietsboek/static/fonts.css b/fietsboek/static/fonts.css new file mode 100644 index 0000000..7bedcda --- /dev/null +++ b/fietsboek/static/fonts.css @@ -0,0 +1,121 @@ +/* Snippet generated by https://google-webfonts-helper.herokuapp.com/fonts/open-sans?subsets=latin */ + +/* open-sans-300 - latin */ +@font-face { + font-family: 'Open Sans'; + font-style: normal; + font-weight: 300; + src: local(''), + url('fonts/open-sans-v29-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('fonts/open-sans-v29-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ +} + +/* open-sans-regular - latin */ +@font-face { + font-family: 'Open Sans'; + font-style: normal; + font-weight: 400; + src: local(''), + url('fonts/open-sans-v29-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('fonts/open-sans-v29-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ +} + +/* open-sans-500 - latin */ +@font-face { + font-family: 'Open Sans'; + font-style: normal; + font-weight: 500; + src: local(''), + url('fonts/open-sans-v29-latin-500.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('fonts/open-sans-v29-latin-500.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ +} + +/* open-sans-600 - latin */ +@font-face { + font-family: 'Open Sans'; + font-style: normal; + font-weight: 600; + src: local(''), + url('fonts/open-sans-v29-latin-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('fonts/open-sans-v29-latin-600.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ +} + +/* open-sans-700 - latin */ +@font-face { + font-family: 'Open Sans'; + font-style: normal; + font-weight: 700; + src: local(''), + url('fonts/open-sans-v29-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('fonts/open-sans-v29-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ +} + +/* open-sans-800 - latin */ +@font-face { + font-family: 'Open Sans'; + font-style: normal; + font-weight: 800; + src: local(''), + url('fonts/open-sans-v29-latin-800.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('fonts/open-sans-v29-latin-800.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ +} + +/* open-sans-300italic - latin */ +@font-face { + font-family: 'Open Sans'; + font-style: italic; + font-weight: 300; + src: local(''), + url('fonts/open-sans-v29-latin-300italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('fonts/open-sans-v29-latin-300italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ +} + +/* open-sans-italic - latin */ +@font-face { + font-family: 'Open Sans'; + font-style: italic; + font-weight: 400; + src: local(''), + url('fonts/open-sans-v29-latin-italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('fonts/open-sans-v29-latin-italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ +} + +/* open-sans-500italic - latin */ +@font-face { + font-family: 'Open Sans'; + font-style: italic; + font-weight: 500; + src: local(''), + url('fonts/open-sans-v29-latin-500italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('fonts/open-sans-v29-latin-500italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ +} + +/* open-sans-600italic - latin */ +@font-face { + font-family: 'Open Sans'; + font-style: italic; + font-weight: 600; + src: local(''), + url('fonts/open-sans-v29-latin-600italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('fonts/open-sans-v29-latin-600italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ +} + +/* open-sans-700italic - latin */ +@font-face { + font-family: 'Open Sans'; + font-style: italic; + font-weight: 700; + src: local(''), + url('fonts/open-sans-v29-latin-700italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('fonts/open-sans-v29-latin-700italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ +} + +/* open-sans-800italic - latin */ +@font-face { + font-family: 'Open Sans'; + font-style: italic; + font-weight: 800; + src: local(''), + url('fonts/open-sans-v29-latin-800italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('fonts/open-sans-v29-latin-800italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ +} diff --git a/fietsboek/static/fonts/OpenSans-Regular.ttf b/fietsboek/static/fonts/OpenSans-Regular.ttf deleted file mode 100644 index e21ff5f..0000000 Binary files a/fietsboek/static/fonts/OpenSans-Regular.ttf and /dev/null differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-300.woff b/fietsboek/static/fonts/open-sans-v29-latin-300.woff new file mode 100644 index 0000000..fd25416 Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-300.woff differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-300.woff2 b/fietsboek/static/fonts/open-sans-v29-latin-300.woff2 new file mode 100644 index 0000000..e7341dc Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-300.woff2 differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-300italic.woff b/fietsboek/static/fonts/open-sans-v29-latin-300italic.woff new file mode 100644 index 0000000..8468acd Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-300italic.woff differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-300italic.woff2 b/fietsboek/static/fonts/open-sans-v29-latin-300italic.woff2 new file mode 100644 index 0000000..ad29be4 Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-300italic.woff2 differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-500.woff b/fietsboek/static/fonts/open-sans-v29-latin-500.woff new file mode 100644 index 0000000..ce838eb Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-500.woff differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-500.woff2 b/fietsboek/static/fonts/open-sans-v29-latin-500.woff2 new file mode 100644 index 0000000..b9bc72c Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-500.woff2 differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-500italic.woff b/fietsboek/static/fonts/open-sans-v29-latin-500italic.woff new file mode 100644 index 0000000..ec9cddd Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-500italic.woff differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-500italic.woff2 b/fietsboek/static/fonts/open-sans-v29-latin-500italic.woff2 new file mode 100644 index 0000000..761a848 Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-500italic.woff2 differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-600.woff b/fietsboek/static/fonts/open-sans-v29-latin-600.woff new file mode 100644 index 0000000..9150b0c Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-600.woff differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-600.woff2 b/fietsboek/static/fonts/open-sans-v29-latin-600.woff2 new file mode 100644 index 0000000..7015f7d Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-600.woff2 differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-600italic.woff b/fietsboek/static/fonts/open-sans-v29-latin-600italic.woff new file mode 100644 index 0000000..10e4924 Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-600italic.woff differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-600italic.woff2 b/fietsboek/static/fonts/open-sans-v29-latin-600italic.woff2 new file mode 100644 index 0000000..5e1476c Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-600italic.woff2 differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-700.woff b/fietsboek/static/fonts/open-sans-v29-latin-700.woff new file mode 100644 index 0000000..1b546f6 Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-700.woff differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-700.woff2 b/fietsboek/static/fonts/open-sans-v29-latin-700.woff2 new file mode 100644 index 0000000..00582c6 Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-700.woff2 differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-700italic.woff b/fietsboek/static/fonts/open-sans-v29-latin-700italic.woff new file mode 100644 index 0000000..59eead9 Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-700italic.woff differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-700italic.woff2 b/fietsboek/static/fonts/open-sans-v29-latin-700italic.woff2 new file mode 100644 index 0000000..5657d9e Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-700italic.woff2 differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-800.woff b/fietsboek/static/fonts/open-sans-v29-latin-800.woff new file mode 100644 index 0000000..a27ea13 Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-800.woff differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-800.woff2 b/fietsboek/static/fonts/open-sans-v29-latin-800.woff2 new file mode 100644 index 0000000..7fc8d86 Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-800.woff2 differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-800italic.woff b/fietsboek/static/fonts/open-sans-v29-latin-800italic.woff new file mode 100644 index 0000000..44f9748 Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-800italic.woff differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-800italic.woff2 b/fietsboek/static/fonts/open-sans-v29-latin-800italic.woff2 new file mode 100644 index 0000000..27c37d5 Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-800italic.woff2 differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-italic.woff b/fietsboek/static/fonts/open-sans-v29-latin-italic.woff new file mode 100644 index 0000000..d354f13 Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-italic.woff differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-italic.woff2 b/fietsboek/static/fonts/open-sans-v29-latin-italic.woff2 new file mode 100644 index 0000000..b323b27 Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-italic.woff2 differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-regular.woff b/fietsboek/static/fonts/open-sans-v29-latin-regular.woff new file mode 100644 index 0000000..b9f6e3e Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-regular.woff differ diff --git a/fietsboek/static/fonts/open-sans-v29-latin-regular.woff2 b/fietsboek/static/fonts/open-sans-v29-latin-regular.woff2 new file mode 100644 index 0000000..f143cd4 Binary files /dev/null and b/fietsboek/static/fonts/open-sans-v29-latin-regular.woff2 differ diff --git a/fietsboek/static/theme.css b/fietsboek/static/theme.css index fbb9c89..32ef02b 100644 --- a/fietsboek/static/theme.css +++ b/fietsboek/static/theme.css @@ -5,6 +5,10 @@ body { background: #efefef; } +strong { + font-weight: 700; +} + .badge-container { width: 50px; height: 50px; diff --git a/fietsboek/templates/layout.jinja2 b/fietsboek/templates/layout.jinja2 index c60723f..3e0b3ea 100644 --- a/fietsboek/templates/layout.jinja2 +++ b/fietsboek/templates/layout.jinja2 @@ -9,19 +9,13 @@ {% block title %}Fietsboek{% endblock %} - - +