Add postcss, theme-color metas, and Space Grotesk for headers

cafour · Jan 7, 2024 · e3dc6ea · e3dc6ea
1 parent 3710aa6
commit e3dc6ea
Show file tree

Hide file tree

Showing 6 changed files with 209 additions and 5 deletions.
diff --git a/_config.ts b/_config.ts
@@ -2,6 +2,7 @@ import lume from "lume/mod.ts";
 import markdown from "lume/plugins/markdown.ts";
 import jsx from "lume/plugins/jsx_preact.ts";
 import sass from "lume/plugins/sass.ts";
+import postcss from "lume/plugins/postcss.ts";
 import transformImages from "lume/plugins/transform_images.ts";
 import picture from "lume/plugins/picture.ts";
 import katex from "./katex.ts";
@@ -11,6 +12,7 @@ import codeHighlight from "./shiki.ts";
 import sitemap from "lume/plugins/sitemap.ts";
 import inline from "lume/plugins/inline.ts";
 import admonition from "npm:markdown-it-admonition";
+import pagefind from "lume/plugins/pagefind.ts";
 
 import { AsciidoctorEngine, asciidocLoader } from "./asciidoc.ts";
 
@@ -25,6 +27,7 @@ site
     }))
     .use(jsx())
     .use(sass())
+    .use(postcss())
     .use(metas())
     .use(resolveUrls())
     .use(sitemap({
@@ -79,8 +82,13 @@ site
     .copy([".svg"])
     .copy("fonts")
     .copy("icons")
-    .copy("fi/pv255")
-    .copy("fi/pa216")
-    .copy("fi/pv259");
+    .use(pagefind({
+        indexing: {
+            rootSelector: "main"
+        },
+        ui: {
+            showSubResults: true
+        }
+    }));;
 
 export default site;
diff --git a/_data.yml b/_data.yml
@@ -3,3 +3,4 @@ styles: [ essay ]
 metas:
   lang: cs
 showtitle: true
+indexable: true
diff --git a/_includes/layouts/base.tsx b/_includes/layouts/base.tsx
@@ -8,8 +8,10 @@ export default ({ title, children, styles, math }: FrontPageData) => {
     <html>
       <head>
         <meta charSet="utf-8" />
-        <link rel="icon" href="/icons/fi_16.ico" />
+        <link rel="icon" sizes="16x16" href="/icons/fi_16.ico" />
         <meta name="viewport" content="width=device-width,initial-scale=1.0" />
+        <meta name="theme-color" media="(prefers-color-scheme: light)" content="#faf2eb" />
+        <meta name="theme-color" media="(prefers-color-scheme: dark)" content="#3a322b" />
         <title>{title ? `${title} | FI Notes` : "FI Notes"}</title>
         {(styles ?? []).map((style) => (
           <link href={`/styles/${style}.css`} rel="stylesheet" />

diff --git a/_includes/styles/base/_config.scss b/_includes/styles/base/_config.scss
@@ -1,6 +1,6 @@
 @use "./fonts";
 
-$font-header: "Lato", sans-serif !default;
+$font-header: "Space Grotesk", sans-serif !default;
 $font-navigation: "Bitter", serif !default;
 $font-text: "Bitter", serif !default;
 $font-code: "Cascadia Mono", monospace !default;

diff --git a/_includes/styles/base/_fonts.scss b/_includes/styles/base/_fonts.scss
@@ -7,3 +7,4 @@
 @import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap');
 @import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@400;700&display=swap');
 @import url('https://fonts.googleapis.com/css2?family=Bitter:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');