commit d45a6a564470183194cc19b7559373da51572fb2
parent b0289cacd6c1ca173ac08fbf8f96a3e5d02d8a3d
Author: Oscar Benedito <oscar@oscarbenedito.com>
Date: Mon, 2 Nov 2020 23:14:20 +0100
Change logo SVG for text with font
Now the logo is just text formatted with the LibreBaskerville bold font.
This makes it readable for screen readers and makes the text selectable.
The font file only includes the letters needed for the logo
"BOacdeinorst" so the size is very small (smaller than the previous
SVG!).
Diffstat:
5 files changed, 32 insertions(+), 9 deletions(-)
diff --git a/README.md b/README.md
@@ -11,7 +11,19 @@ with `pip3 install markdown`).
## Other notes
-The font used for the logo is "Libre Baskerville" in bold.
+The font used for the logo is "Libre Baskerville" in bold. The `woff2` file used
+for the font only includes the needed letters for the logo ("BOacdeinorst") to
+keep the file size small (2.5 KiB). To create such file, you can use the
+following command:
+
+```sh
+pyftsubset LibreBaskerville-Bold.ttf \
+ --unicodes=U+004F,U+0073,U+0063,U+0061,U+0072,U+0042,U+0065,U+006E,U+0064,U+0069,U+0074,U+006F \
+ --output-file=<output-font-file>.woff2 --flavor=woff2
+```
+
+You might need to run `pip3 install fonttools brotli` to install the
+dependencies.
## License
diff --git a/assets/css/style.css b/assets/css/style.css
@@ -15,7 +15,7 @@ You should have received a copy of the GNU General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
-/* variables {{{ */
+/* declarations {{{ */
:root {
--gap: 1.5rem;
@@ -53,7 +53,15 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
}
}
-/* variables }}} */
+/* Only imports the letters needed for the logo ("BOacdeinorst") */
+@font-face {
+ font-family: 'Libre Baskerville';
+ font-weight: 700;
+ src: local('Libre Baskerville Bold'), local('LibreBaskerville-Bold'), url(/fonts/LibreBaskerville-Bold.8b127675.woff2) format('woff2');
+ unicode-range: U+0042,U+004F,U+0061,U+0063,U+0064,U+0065,U+0069,U+006E,U+006F,U+0072,U+0073,U+0074;
+}
+
+/* declarations }}} */
/* defaults {{{ */
@@ -165,13 +173,17 @@ header#page-header .content {
}
header#page-header .content .logo {
- height: 1.6em;
- fill: var(--primary-logo);
- stroke: none;
+ font-size: 1.9em;
+ font-weight: bold;
+ font-family: 'Libre Baskerville', serif;
+ color: var(--primary-logo);
+ line-height: 1;
+ text-decoration: none;
}
header#page-header .content .logo:hover {
- fill: var(--primary-dark);
+ color: var(--primary-dark);
+ text-decoration: none;
}
header#page-header .content nav {
diff --git a/assets/img/logo.svg b/assets/img/logo.svg
@@ -1 +0,0 @@
-<svg viewBox="0 0 84.665 8.89" xmlns="http://www.w3.org/2000/svg"><g id="l" transform="translate(162.05 -103.76)" stroke-width=".26458"><path d="m-157.53 104.29q0.9525 0 1.778 0.32809 0.8255 0.32808 1.4288 0.89958 0.61383 0.5715 0.96308 1.3441 0.34925 0.77259 0.34925 1.6722 0 0.85725-0.35983 1.6087-0.34925 0.75141-0.96308 1.3123-0.60325 0.55033-1.4288 0.87842-0.8255 0.3175-1.7674 0.3175t-1.7674-0.3175q-0.8255-0.32809-1.4393-0.87842-0.61383-0.56092-0.96308-1.3123-0.34925-0.75142-0.34925-1.6087 0-0.89958 0.34925-1.6722 0.34925-0.77258 0.9525-1.3441 0.61383-0.5715 1.4393-0.89958 0.8255-0.32809 1.778-0.32809zm0 7.6729q0.61383 0 1.1112-0.23283 0.49742-0.24342 0.84667-0.67734 0.34925-0.4445 0.52916-1.0689 0.1905-0.635 0.1905-1.4182 0-0.8255-0.1905-1.4817-0.17991-0.66675-0.52916-1.1324-0.34925-0.47625-0.84667-0.71967-0.49742-0.254-1.1112-0.254-0.62442 0-1.1218 0.254-0.48684 0.24342-0.83609 0.71967-0.34925 0.46566-0.53975 1.1324-0.17991 0.65617-0.17991 1.4817 0 0.78317 0.17991 1.4182 0.1905 0.62441 0.53975 1.0689 0.34925 0.43392 0.83609 0.67734 0.49741 0.23283 1.1218 0.23283z"/><path d="m-151.71 112.55h-0.32808v-1.9262h0.4445q0.17992 0.762 0.51858 1.1112 0.33867 0.34925 0.87842 0.34925 0.39158 0 0.60325-0.15875 0.22225-0.16934 0.22225-0.45509 0-0.29633-0.26458-0.5715-0.26459-0.28575-0.85725-0.60325-0.80434-0.43391-1.1536-0.85725-0.34925-0.43391-0.34925-0.97366 0-0.34925 0.127-0.64559 0.13759-0.30691 0.35984-0.52916 0.23283-0.22225 0.55033-0.33867 0.3175-0.127 0.68792-0.127 0.32808 0 0.64558 0.0952 0.32808 0.0953 0.5715 0.26458l0.1905-0.254h0.27517v1.5981h-0.41275q-0.24342-0.60325-0.508-0.86784-0.254-0.26458-0.62442-0.26458-0.29633 0-0.47625 0.15875-0.16933 0.15875-0.16933 0.42333 0 0.29634 0.254 0.56092 0.26458 0.26458 0.86783 0.58208 0.42333 0.23284 0.73025 0.45509t0.49742 0.45508q0.1905 0.22225 0.27516 0.47625 0.0952 0.24342 0.0952 0.52917 0 0.37041-0.13758 0.66675-0.13758 0.29633-0.39158 0.508-0.254 0.21166-0.61384 0.32808-0.34925 0.11642-0.78316 0.11642-0.45509 0-0.84667-0.11642-0.39158-0.127-0.64558-0.35983z"/><path d="m-142.08 111.67q-0.40217 0.4445-1.0054 0.68791-0.59267 0.24342-1.2912 0.24342-0.64558 0-1.1748-0.20108-0.52916-0.21167-0.91016-0.58209-0.381-0.37041-0.59267-0.889-0.20108-0.52916-0.20108-1.1642 0-0.65617 0.22225-1.1959t0.62441-0.92075q0.40217-0.39158 0.96309-0.60325 0.56091-0.21167 1.2382-0.21167 0.47625 0 0.87841 0.0952 0.41275 0.0953 0.6985 0.26459 0.29634 0.16933 0.46567 0.40216 0.16933 0.22225 0.16933 0.48684 0 0.30691-0.17991 0.48683-0.16934 0.17992-0.46567 0.17992-0.24342 0-0.43392-0.127-0.17991-0.127-0.35983-0.41275-0.15875-0.254-0.27517-0.40217-0.10583-0.14817-0.20108-0.22225-0.0952-0.0847-0.1905-0.10583-0.0952-0.0318-0.23283-0.0318-0.61384 0-0.9525 0.5715-0.33867 0.5715-0.33867 1.5981 0 1.1007 0.40217 1.6933 0.41275 0.59267 1.1748 0.59267 0.43391 0 0.86783-0.15875 0.43392-0.16933 0.8255-0.47625z"/><path d="m-138.05 109.53q-0.889 0.40217-1.3441 0.75142-0.4445 0.33867-0.4445 0.70908 0 0.30692 0.16933 0.48684 0.16933 0.17991 0.42333 0.17991t0.47625-0.0847q0.22225-0.0952 0.381-0.24342 0.15875-0.14817 0.24342-0.34925 0.0953-0.21167 0.0953-0.4445zm0-0.56091v-0.4445q0-0.61384-0.22225-0.889-0.21167-0.28575-0.66675-0.28575-0.30692 0-0.46567 0.16933-0.15875 0.15875-0.29633 0.53975-0.0952 0.26458-0.27517 0.41275-0.16933 0.14817-0.47625 0.14817-0.29633 0-0.45508-0.17992t-0.15875-0.508q0-0.508 0.55033-0.80433 0.56092-0.29634 1.6828-0.29634 1.1853 0 1.6933 0.43392 0.508 0.42333 0.508 1.4288v2.3178q0 0.89958 0.35983 0.89958 0.20108 0 0.37042-0.13758l0.15875 0.30692q-0.14817 0.26458-0.46567 0.42333-0.30692 0.14817-0.6985 0.14817-0.48683 0-0.74083-0.29634-0.254-0.29633-0.254-0.83608h-0.0529q-0.30692 0.55033-0.79375 0.83608t-1.1112 0.28575q-0.66675 0-1.0689-0.37041-0.40216-0.381-0.40216-0.98425 0-0.46567 0.41275-0.86784 0.41275-0.41275 1.3758-0.80433z"/><path d="m-132.89 110.91q0 0.41275 0.0317 0.65616 0.0423 0.23284 0.15875 0.35984 0.11642 0.127 0.33867 0.16933 0.22225 0.0318 0.59266 0.0318v0.42333h-3.5348v-0.42333q0.3175-0.0212 0.508-0.0635t0.28575-0.16933q0.0952-0.127 0.11642-0.35984 0.0318-0.24341 0.0318-0.64558v-1.2912q0-0.65616-0.0318-1.0478-0.0317-0.39158-0.13759-0.60325-0.10583-0.21166-0.30691-0.27516-0.1905-0.0741-0.508-0.0741v-0.37041l2.1167-0.39159 0.16934 1.2171h0.0423q0.28575-0.56092 0.75142-0.889 0.46566-0.32809 0.98425-0.32809 0.40216 0 0.65616 0.20109 0.254 0.20108 0.254 0.508 0 0.33866-0.20108 0.5715-0.1905 0.23283-0.52917 0.23283-0.15875 0-0.28575-0.0635t-0.23283-0.13758q-0.0952-0.0847-0.20108-0.14817-0.0952-0.0741-0.20109-0.0741-0.20108 0-0.381 0.26458-0.17991 0.26458-0.29633 0.70908-0.0847 0.3175-0.13758 0.71967-0.0529 0.39158-0.0529 0.78317z"/><path d="m-127.37 112.55v-0.42333q0.35983-0.0106 0.5715-0.0635 0.22225-0.0529 0.33866-0.17992 0.127-0.127 0.16934-0.35983 0.0423-0.23283 0.0423-0.60325v-4.8895q0-0.37042-0.0318-0.59267-0.0317-0.23283-0.13758-0.35983-0.0952-0.13758-0.27517-0.17992-0.16933-0.0529-0.45508-0.0741v-0.42333h3.3972q1.5981 0 2.4553 0.51858 0.86783 0.508 0.86783 1.4605 0 1.2594-1.8098 1.778v0.0423q0.58209 0 1.0478 0.16934 0.47625 0.15875 0.80434 0.45508 0.32808 0.29633 0.508 0.6985 0.17991 0.40217 0.17991 0.87842 0 0.53975-0.26458 0.94191-0.254 0.40217-0.74083 0.67734-0.94192 0.52916-2.5929 0.52916zm4.1487-0.64558q1.7039 0 1.7039-1.5346 0-0.94192-0.61383-1.3758-0.3175-0.22225-0.8255-0.3175-0.49742-0.0953-1.2277-0.0953h-0.508v2.1167q0 0.65617 0.33867 0.93133 0.33866 0.27517 1.1324 0.27517zm-0.84666-3.9582q0.47625 0 0.8255-0.0847 0.34925-0.0953 0.59266-0.26459 0.508-0.34925 0.508-1.0901 0-0.77258-0.381-1.1112-0.381-0.34925-1.2277-0.34925h-0.75142q-0.1905 0-0.1905 0.17992v2.7199z"/><path d="m-113.57 111.56q-0.96308 1.0901-2.4024 1.0901-0.65616 0-1.1959-0.20109-0.52917-0.21166-0.91017-0.58208-0.381-0.381-0.59267-0.89958-0.21166-0.51859-0.21166-1.1536 0-0.65616 0.22225-1.1959 0.22225-0.55034 0.62441-0.94192 0.41275-0.40217 0.96309-0.62442 0.56091-0.22225 1.2277-0.22225 1.1218 0 1.7462 0.60325 0.62442 0.60325 0.62442 1.6933 0 0.16933-0.0529 0.21166-0.0529 0.0318-0.29633 0.0318h-3.4078q-0.0423 0.0953-0.0423 0.34925 0 1.0372 0.4445 1.6404 0.45509 0.60325 1.2277 0.60325 0.4445 0 0.87842-0.20108 0.4445-0.20109 0.85725-0.5715zm-2.0532-2.7834q0.42334 0 0.53975-0.0423 0.127-0.0529 0.127-0.23283 0-0.46567-0.26458-0.762t-0.66675-0.29633q-0.45508 0-0.81492 0.381-0.34925 0.37041-0.45508 0.9525z"/><path d="m-110.37 110.82q0 0.43392 0.0212 0.68792 0.0318 0.24341 0.11641 0.381 0.0953 0.127 0.27517 0.16933 0.1905 0.0423 0.508 0.0635v0.42333h-3.3338v-0.42333q0.30692-0.0212 0.48683-0.0635 0.1905-0.0423 0.28575-0.16933 0.10584-0.127 0.13759-0.35984 0.0318-0.23283 0.0318-0.635v-1.3229q0-0.62442-0.0212-1.0054-0.0212-0.39158-0.0529-0.52917-0.0318-0.13758-0.0847-0.22225-0.0529-0.0952-0.15875-0.13758-0.10584-0.0529-0.26459-0.0635-0.15875-0.0212-0.40216-0.0212v-0.35983l2.0426-0.40217 0.13758 0.93134h0.0423q0.34925-0.4445 0.8255-0.68792t1.0478-0.24342q0.67733 0 1.0901 0.1905 0.42333 0.17992 0.75142 0.61384 0.17991 0.24341 0.3175 0.635 0.13758 0.381 0.13758 1.0583v1.4922q0 0.43392 0.0212 0.68792 0.0318 0.24341 0.11641 0.381 0.0953 0.127 0.27517 0.16933 0.17992 0.0423 0.48683 0.0635v0.42333h-3.3126v-0.42333q0.3175-0.0106 0.49742-0.0529 0.1905-0.0529 0.28575-0.17991 0.0953-0.127 0.127-0.35984 0.0317-0.24341 0.0317-0.635v-1.4393q0-0.53975-0.0635-0.91017-0.0635-0.37041-0.21167-0.59266-0.13758-0.23284-0.37042-0.32809-0.23283-0.10583-0.58208-0.10583-0.33867 0-0.58208 0.1905-0.24342 0.1905-0.42334 0.52917-0.0953 0.1905-0.16933 0.49741-0.0635 0.29634-0.0635 0.62442z"/><path d="m-99.681 111.56q-0.96309 1.0901-2.4024 1.0901-0.65617 0-1.1959-0.20109-0.52916-0.21166-0.91016-0.58208-0.381-0.381-0.59267-0.89958-0.21167-0.51859-0.21167-1.1536 0-0.65616 0.22225-1.1959 0.22225-0.55034 0.62442-0.94192 0.41275-0.40217 0.96308-0.62442 0.56092-0.22225 1.2277-0.22225 1.1218 0 1.7462 0.60325 0.62442 0.60325 0.62442 1.6933 0 0.16933-0.05292 0.21166-0.05292 0.0318-0.29633 0.0318h-3.4078q-0.0423 0.0953-0.0423 0.34925 0 1.0372 0.4445 1.6404 0.45508 0.60325 1.2277 0.60325 0.4445 0 0.87841-0.20108 0.4445-0.20109 0.85725-0.5715zm-2.0532-2.7834q0.42333 0 0.53975-0.0423 0.127-0.0529 0.127-0.23283 0-0.46567-0.26458-0.762-0.26459-0.29633-0.66675-0.29633-0.45509 0-0.81492 0.381-0.34925 0.37041-0.45508 0.9525z"/><path d="m-94.105 111.87h-0.04233q-0.73025 0.78317-1.8944 0.78317-0.60325 0-1.1112-0.21167-0.49742-0.21167-0.86783-0.59267-0.35983-0.381-0.56092-0.89958-0.20108-0.52917-0.20108-1.1642t0.20108-1.1748q0.21167-0.53975 0.56092-0.93133 0.35983-0.40217 0.84667-0.62442 0.49742-0.22225 1.0689-0.22225 0.52917 0 0.93133 0.15875 0.41275 0.15875 0.71967 0.53975h0.04233v-0.89958q0-0.62442-0.02117-1.0689-0.01058-0.45508-0.04233-0.59266-0.05292-0.22225-0.32808-0.3175-0.26458-0.10584-0.8255-0.10584v-0.35983l2.6776-0.42333v6.0537q0 0.79375 0.01058 1.2277 0.02117 0.42333 0.0635 0.64558 0.02117 0.13759 0.0635 0.22225 0.04233 0.0847 0.127 0.13759 0.08467 0.0423 0.22225 0.0635 0.14817 0.0106 0.37042 0.0106v0.41275l-2.0108 0.11642zm-0.32808-2.3601q0-0.40217-0.08467-0.74084-0.08467-0.34925-0.254-0.61383-0.1905-0.30692-0.48683-0.46567t-0.635-0.15875q-0.62442 0-0.9525 0.5715t-0.32808 1.6616q0 1.1007 0.32808 1.6933t0.94192 0.59267q0.34925 0 0.66675-0.17992t0.51858-0.48683q0.14817-0.23284 0.21167-0.5715 0.07408-0.34925 0.07408-0.889z"/><path d="m-89.137 110.81q0 0.42333 0.03175 0.67733t0.127 0.39158q0.09525 0.13759 0.27517 0.1905 0.17992 0.0423 0.48683 0.0529v0.42333h-3.3338v-0.42333q0.29633-0.0106 0.47625-0.0635 0.1905-0.0635 0.28575-0.1905 0.10583-0.13758 0.13758-0.37042 0.04233-0.24341 0.04233-0.61383v-1.3018q0-0.61383-0.02117-1.0054-0.02117-0.40216-0.05292-0.55033-0.05292-0.26458-0.24342-0.34925-0.17992-0.0847-0.66675-0.0847v-0.35983l2.4553-0.40217zm-1.5558-6.223q0-0.34925 0.23283-0.58209 0.24342-0.24341 0.58208-0.24341 0.34925 0 0.58208 0.24341 0.24342 0.23284 0.24342 0.58209 0 0.33866-0.24342 0.58208-0.23283 0.23283-0.58208 0.23283-0.33867 0-0.58208-0.23283-0.23283-0.24342-0.23283-0.58208z"/><path d="m-87.768 107.52v-0.47625q0.635-0.17992 1.0583-0.53975 0.43392-0.37042 0.64558-0.84667h0.53975v1.2806h1.2171v0.58208h-1.2171v3.2491q0 0.65617 0.13758 0.93134 0.14817 0.27516 0.48683 0.27516 0.41275 0 0.62442-0.381l0.22225 0.30692q-0.29633 0.75142-1.397 0.75142-0.73025 0-1.143-0.33867-0.40217-0.33867-0.40217-0.9525v-3.8418z"/><path d="m-80.51 106.83q0.635 0 1.1959 0.22225 0.5715 0.21167 0.99483 0.59267 0.43392 0.381 0.67733 0.91017 0.254 0.51858 0.254 1.143 0 0.64558-0.254 1.1853-0.24342 0.53975-0.67733 0.93133-0.42333 0.39159-0.99483 0.61384-0.56092 0.22225-1.1959 0.22225-0.62442 0-1.1853-0.21167-0.56092-0.22225-0.98425-0.61383-0.42333-0.39159-0.66675-0.93134-0.24342-0.55033-0.24342-1.1959 0-0.62442 0.24342-1.1536 0.24342-0.52916 0.66675-0.91016t0.98425-0.59267 1.1853-0.21167zm0 0.61384q-0.3175 0-0.58208 0.16933-0.26458 0.15875-0.45508 0.45508-0.17992 0.29634-0.28575 0.71967-0.09525 0.41275-0.09525 0.92075 0 0.52917 0.09525 0.9525 0.10583 0.42333 0.28575 0.71967 0.1905 0.29633 0.4445 0.46566 0.26458 0.15875 0.59267 0.15875 0.32808 0 0.59267-0.15875 0.27517-0.16933 0.46567-0.46566 0.1905-0.30692 0.29633-0.73025 0.10583-0.42334 0.10583-0.94192 0-0.508-0.10583-0.92075t-0.29633-0.70908q-0.1905-0.30692-0.46567-0.46567-0.26458-0.16933-0.59267-0.16933z"/></g></svg>
diff --git a/layouts/base.html b/layouts/base.html
@@ -15,7 +15,7 @@
<body>
<header id="page-header">
<div class="content">
- <a href="/" title="Home"><svg class="logo" style="height: 1.6em;" viewBox="0 0 84.665 8.89"><use xlink:href="/{{ _asset_img/logo.svg }}#l"></use></svg></a>
+ <a href="/" class="logo" title="Home">Oscar Benedito</a>
<nav><a href="/blog/">Blog</a> · <a href="/contact/">Contact</a> · <a href="https://git.oscarbenedito.com">Git</a></nav>
</div>
</header>
diff --git a/static/fonts/LibreBaskerville-Bold.8b127675.woff2 b/static/fonts/LibreBaskerville-Bold.8b127675.woff2
Binary files differ.
