From 90ffc675fa6ba2d4cc03879518a5bff7b542dddb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?tr=C3=A9meur?= Date: Sat, 27 Apr 2024 23:21:13 +0100 Subject: [PATCH] Replace google fonts with fonts hosted on the server --- README.org | 2 ++ build/archive.css | 51 +++++++++++++++++++++++++++++++++++++++++++++++ build/fic4.css | 42 ++++++++++++++++++++++++++++++++++++++ build/tufte.css | 35 +++++++++++++++++++++++++++++++- headerfooter.py | 2 +- 5 files changed, 130 insertions(+), 2 deletions(-) diff --git a/README.org b/README.org index 273c062..71b3be6 100644 --- a/README.org +++ b/README.org @@ -14,6 +14,8 @@ On the server my =secret/= folder is protected using =.htpasswd=. In the current Requisites: =rclone= (just for uploading files to the server), Python 3. +I am now storing fonts locally instead of loading them from Google, so the fonts (Hubballi, Merriweather, Noto Color Emoji) have to be downloaded and put in the =/fonts/= directory (see [[https://gwfh.mranftl.com/fonts][google-webfonts-helper]]). + ** My use case - most of my current fandoms are numbered parts of a bigger franchise diff --git a/build/archive.css b/build/archive.css index fa3b985..b499777 100644 --- a/build/archive.css +++ b/build/archive.css @@ -1,5 +1,56 @@ @charset "UTF-8"; +/* hubballi-regular - latin */ +@font-face { + font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ + font-family: 'Hubballi'; + font-style: normal; + font-weight: 400; + src: url('/fonts/hubballi-v7-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ +} + +/* merriweather-regular - latin */ +@font-face { + font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ + font-family: 'Merriweather'; + font-style: normal; + font-weight: 400; + src: url('/fonts/merriweather-v30-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ +} +/* merriweather-italic - latin */ +@font-face { + font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ + font-family: 'Merriweather'; + font-style: italic; + font-weight: 400; + src: url('/fonts/merriweather-v30-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ +} +/* merriweather-700 - latin */ +@font-face { + font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ + font-family: 'Merriweather'; + font-style: normal; + font-weight: 700; + src: url('/fonts/merriweather-v30-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ +} +/* merriweather-700italic - latin */ +@font-face { + font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ + font-family: 'Merriweather'; + font-style: italic; + font-weight: 700; + src: url('/fonts/merriweather-v30-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ +} + +/* noto-color-emoji-regular - emoji */ +@font-face { + font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ + font-family: 'Noto Color Emoji'; + font-style: normal; + font-weight: 400; + src: url('/fonts/noto-color-emoji-v30-emoji-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ +} + html { height: 100%; } diff --git a/build/fic4.css b/build/fic4.css index 3f1fb86..b6c0e42 100644 --- a/build/fic4.css +++ b/build/fic4.css @@ -1,3 +1,45 @@ +/* lato-regular - latin */ +@font-face { + font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ + font-family: 'Lato'; + font-style: normal; + font-weight: 400; + src: url('/fonts/lato-v24-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ +} +/* lato-italic - latin */ +@font-face { + font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ + font-family: 'Lato'; + font-style: italic; + font-weight: 400; + src: url('/fonts/lato-v24-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ +} +/* lato-700 - latin */ +@font-face { + font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ + font-family: 'Lato'; + font-style: normal; + font-weight: 700; + src: url('/fonts/lato-v24-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ +} +/* lato-700italic - latin */ +@font-face { + font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ + font-family: 'Lato'; + font-style: italic; + font-weight: 700; + src: url('/fonts/lato-v24-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ +} + +/* inconsolata-regular - latin */ +@font-face { + font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ + font-family: 'Inconsolata'; + font-style: normal; + font-weight: 400; + src: url('/fonts/inconsolata-v32-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ +} + /* ----- COLOURS ----- */ body, details > summary::marker { diff --git a/build/tufte.css b/build/tufte.css index 85377a1..1a07e6f 100644 --- a/build/tufte.css +++ b/build/tufte.css @@ -1,8 +1,41 @@ @charset "UTF-8"; +/* eb-garamond-regular - latin */ +@font-face { + font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ + font-family: 'EB Garamond'; + font-style: normal; + font-weight: 400; + src: url('/fonts/eb-garamond-v27-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ +} +/* eb-garamond-italic - latin */ +@font-face { + font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ + font-family: 'EB Garamond'; + font-style: italic; + font-weight: 400; + src: url('/fonts/eb-garamond-v27-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ +} +/* eb-garamond-700 - latin */ +@font-face { + font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ + font-family: 'EB Garamond'; + font-style: normal; + font-weight: 700; + src: url('/fonts/eb-garamond-v27-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ +} +/* eb-garamond-700italic - latin */ +@font-face { + font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ + font-family: 'EB Garamond'; + font-style: italic; + font-weight: 700; + src: url('/fonts/eb-garamond-v27-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ +} + /* Tufte CSS styles */ html { - font-size: 15px; + font-size: 15px; } body { diff --git a/headerfooter.py b/headerfooter.py index 5aad5ae..85caf0a 100644 --- a/headerfooter.py +++ b/headerfooter.py @@ -5,7 +5,7 @@ def headerwrite(output,title,headerone,desc,main=False,local=False): header.write("/home/mdd/Documents/drive/proj/fic-archive/build/") else: header.write("/fic/") - header.write("archive.css\">\n\n\n\n\n\n\n" + title + "\n\n\n\n
\n
\n\n

" + headerone + "

\n" + desc + "\n") + header.write("archive.css\">\n\n\n\n" + title + "\n\n\n\n
\n
\n\n

" + headerone + "

\n" + desc + "\n") if not main: header.write("

\n