Generate fonts and styles from nix build
parent
829f26441a
commit
8b0ad26d66
|
|
@ -1,5 +1,9 @@
|
|||
.nvimlog
|
||||
.direnv/
|
||||
themes/
|
||||
public/
|
||||
result
|
||||
|
||||
# ignore folders where we link in files from the nix store
|
||||
themes/
|
||||
static/font/
|
||||
static/style/fonts.css
|
||||
|
|
@ -24,7 +24,7 @@ external_links_no_referrer = true
|
|||
favicon = "/image/favicon.svg"
|
||||
stylesheets = []
|
||||
|
||||
use_cdn = true
|
||||
use_cdn = false
|
||||
# include hashes for SRI
|
||||
cdns = [
|
||||
{ url = "https://cdn.jsdelivr.net/npm/firacode@6.2.0/distr/fira_code.min.css", hash = "sWIpcFPnJFfPqQU7FWn8H9+Xax/h5ihI8hVjQTBa5WmUde6CZZLw9DUAaIyA6j5u" },
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 73 KiB After Width: | Height: | Size: 48 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 94 KiB After Width: | Height: | Size: 61 KiB |
|
|
@ -168,11 +168,17 @@ error: failed to push some refs to 'git.mat.services:mat/fly-apps.git'
|
|||
|
||||
Uh. Hm. I just got an email saying a Fly.io instance ran out of memory and crashed. Let's peek at our Fly.io dashboards:
|
||||
|
||||
|
||||
<figure>
|
||||
<img alt="Fly.io memory dashboard" src=fly-io-memory-dashboard.png />
|
||||
<figcaption class=meta>Fly.io memory dashboard</figcaption>
|
||||
</figure>
|
||||
|
||||
That doesn't look so great. It seems like Gitea idles just under the amount of memory we have with a default instance size, and operations like `git push` can bump it over the threshold to an out-of-memory error. Let's check out the "Scale" section of the dashboard, and increase the memory allotment for this VM:
|
||||
|
||||
|
||||
<figure>
|
||||
<img alt="Fly.io VM scaling interface" src=fly-io-scale-vm.png />
|
||||
<figcaption class=meta>Fly.io VM scaling interface</figcaption>
|
||||
</figure>
|
||||
|
||||
I have been running my Gitea install on a 512MB instance since the first day I started using it, which seems to be plenty of headroom for personal use. If you open up your Gitea installation to the public and it starts to get popular, you might end up needing to scale up further.
|
||||
|
||||
|
|
|
|||
41
flake.nix
41
flake.nix
|
|
@ -6,6 +6,7 @@
|
|||
flake-parts.url = "github:hercules-ci/flake-parts";
|
||||
flake-parts.inputs.nixpkgs.follows = "nixpkgs";
|
||||
|
||||
# theme
|
||||
apollo.url = "github:not-matthias/apollo";
|
||||
apollo.flake = false;
|
||||
};
|
||||
|
|
@ -26,30 +27,52 @@
|
|||
for image in content/**/_*.png static/image/**/_*.png; do
|
||||
path=$(dirname $image)
|
||||
file=$(basename $image)
|
||||
${pkgs.pngquant}/bin/pngquant --quality 90-99 -f -o "$path/''${file:1}" $image
|
||||
newimage=$path/''${file:1}
|
||||
echo "optimizing $image"
|
||||
${pkgs.pngquant}/bin/pngquant --quality 80-90 -f -o $newimage $image
|
||||
oldsize=$(stat --format=%s $image)
|
||||
newsize=$(stat --format=%s $newimage)
|
||||
pct=$(${pkgs.bc}/bin/bc <<< "scale=1; $newsize * 100 / $oldsize")
|
||||
echo "size went from "$(($oldsize / 1024))"KB to "$(($newsize / 1024))"KB ("$pct"% as large as original)"
|
||||
done
|
||||
'';
|
||||
inherit (pkgs.callPackage ./fonts.nix { }) copyFonts linkFonts;
|
||||
in
|
||||
{
|
||||
packages.default = pkgs.stdenv.mkDerivation {
|
||||
packages.default = with pkgs; stdenv.mkDerivation {
|
||||
pname = "personal-site";
|
||||
version = "2022-08-13";
|
||||
version = "2022-08-21";
|
||||
src = ./.;
|
||||
nativeBuildInputs = with pkgs; [ optimize-images zola ];
|
||||
nativeBuildInputs = [ optimize-images zola ];
|
||||
configurePhase = ''
|
||||
mkdir -p "themes/${themeName}"
|
||||
cp -r ${theme}/* "themes/${themeName}"
|
||||
mkdir -p themes/${themeName}
|
||||
cp -r ${theme}/* themes/${themeName}
|
||||
'' + copyFonts;
|
||||
buildPhase = ''
|
||||
optimize-images
|
||||
zola build
|
||||
'';
|
||||
buildPhase = "zola build";
|
||||
installPhase = "cp -r public $out";
|
||||
};
|
||||
devShells.default = with pkgs; mkShell {
|
||||
packages = [ optimize-images flyctl zola ];
|
||||
packages = [ flyctl optimize-images zola ];
|
||||
shellHook = ''
|
||||
mkdir -p themes
|
||||
ln -snf "${theme}" "themes/${themeName}"
|
||||
'';
|
||||
'' + linkFonts;
|
||||
};
|
||||
packages.docker =
|
||||
let
|
||||
site = self'.packages.default;
|
||||
in
|
||||
pkgs.dockerTools.buildLayeredImage {
|
||||
name = site.pname;
|
||||
tag = site.version;
|
||||
contents = [ site pkgs.caddy ];
|
||||
|
||||
config = {
|
||||
Cmd = [ "caddy" ];
|
||||
};
|
||||
};
|
||||
};
|
||||
};
|
||||
|
|
|
|||
|
|
@ -0,0 +1,122 @@
|
|||
{ fetchFromGitHub
|
||||
, lib
|
||||
, stdenv
|
||||
, woff2
|
||||
, writeShellScriptBin
|
||||
, writeText
|
||||
}:
|
||||
let
|
||||
pathName = name: with lib; replaceStrings [ " " ] [ "-" ] (toLower name);
|
||||
in
|
||||
rec {
|
||||
fontSrcs = [
|
||||
{
|
||||
name = "Inria Sans";
|
||||
fileName = "InriaSans";
|
||||
owner = "BlackFoundryCom";
|
||||
repo = "InriaFonts";
|
||||
rev = "v1.200";
|
||||
path = "fonts/InriaSans/Web";
|
||||
sha256 = "+YK03VnMXytTtHHgGYe2uARaTThaqrhpnhxPASBV9k0=";
|
||||
cssVar = "header-font";
|
||||
}
|
||||
{
|
||||
name = "iA Writer Quattro";
|
||||
fileName = "iAWriterQuattroS";
|
||||
owner = "iaolo";
|
||||
repo = "iA-Fonts";
|
||||
rev = "ba31f88a1e71f413f97bbd23a99e21b29d4c3a28";
|
||||
path = "iA\ Writer\ Quattro/Webfonts";
|
||||
sha256 = "8r06oRA+XA8mPjG3DJxzIVpaqptSqzraOWVvebbnMWE=";
|
||||
cssVar = "text-font";
|
||||
}
|
||||
{
|
||||
name = "IBM Plex Mono";
|
||||
fileName = "IBMPlexMono";
|
||||
owner = "IBM";
|
||||
repo = "plex";
|
||||
rev = "v6.1.0";
|
||||
path = "IBM-Plex-Mono/fonts/complete/woff2";
|
||||
sha256 = "SpH4+ldQJl58w5onxr7faDS6uVJKT8ZeLmE6712GFhw=";
|
||||
cssVar = "code-font";
|
||||
}
|
||||
];
|
||||
fontDerivation = { name, owner, repo, rev, sha256, path, ... }: stdenv.mkDerivation {
|
||||
name = "font-${pathName name}";
|
||||
src = fetchFromGitHub {
|
||||
inherit owner repo rev sha256;
|
||||
sparseCheckout = path;
|
||||
};
|
||||
nativeBuildInputs = [ woff2 ];
|
||||
buildPhase = ''
|
||||
find . -name '*.ttf' -exec woff2_compress {} \;
|
||||
'';
|
||||
installPhase = ''
|
||||
mkdir -p $out
|
||||
find . -name '*.woff2' -exec cp {} $out \;
|
||||
'';
|
||||
};
|
||||
fetchFont = fontSrc: {
|
||||
inherit (fontSrc) name fileName cssVar;
|
||||
font = fontDerivation fontSrc;
|
||||
};
|
||||
fonts = map fetchFont fontSrcs;
|
||||
copyFont = { font, name, ... }: ''
|
||||
mkdir -p static/font/${name}
|
||||
cp -r ${font}/* static/font/${pathName name}
|
||||
'';
|
||||
linkFont = { font, name, ... }: ''
|
||||
ln -snf "${font}" static/font/${pathName name}
|
||||
'';
|
||||
mkFontCss = { font, name, fileName, cssVar }:
|
||||
let path = pathName name; in ''
|
||||
@font-face {
|
||||
font-family: '${name}';
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
src: url('../font/${path}/${fileName}-Regular.woff2'), local('woff2');
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: '${name}';
|
||||
font-style: normal;
|
||||
font-weight: bold;
|
||||
src: url('../font/${path}/${fileName}-Bold.woff2'), local('woff2');
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: '${name}';
|
||||
font-style: italic;
|
||||
font-weight: normal;
|
||||
src: url('../font/${path}/${fileName}-Italic.woff2'), local('woff2');
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: '${name}';
|
||||
font-style: italic;
|
||||
font-weight: bold;
|
||||
src: url('../font/${path}/${fileName}-BoldItalic.woff2'), local('woff2');
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
:root {
|
||||
--${cssVar}: '${name}'
|
||||
}
|
||||
|
||||
'';
|
||||
fontCss = lib.concatMapStrings mkFontCss fonts;
|
||||
fontCssFile = writeText "fonts.css" fontCss;
|
||||
copyFonts = (lib.concatMapStrings copyFont fonts) + ''
|
||||
mkdir -p static/style
|
||||
cp ${fontCssFile} static/style/fonts.css
|
||||
'';
|
||||
linkFonts = ''
|
||||
mkdir -p static/font
|
||||
'' + (lib.concatMapStrings linkFont fonts) + ''
|
||||
mkdir -p static/style
|
||||
ln -sf ${fontCssFile} static/style/fonts.css
|
||||
'';
|
||||
}
|
||||
|
|
@ -9,18 +9,7 @@
|
|||
/* Used for: block comment, hr, ... */
|
||||
--border-color: var(--bg-1);
|
||||
|
||||
/* Fonts */
|
||||
--text-font: 'iA Writer Quattro';
|
||||
--header-font: 'Pretendard Std';
|
||||
--code-font: 'Fira Code';
|
||||
|
||||
// Disabling variable fonts to bring site weight down
|
||||
// @supports(font-variation-settings: normal) {
|
||||
// /* Variable fonts */
|
||||
// --text-font: 'iA Writer Quattro var';
|
||||
// --header-font: 'Pretendard Std Variable';
|
||||
// --code-font: 'Fira Code VF';
|
||||
// }
|
||||
// Fonts defined via fonts.nix
|
||||
}
|
||||
|
||||
html {
|
||||
|
|
|
|||
|
|
@ -1,3 +1,3 @@
|
|||
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://web.resource.org/cc/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" version="1.1" baseProfile="full" width="512px" height="512px" viewBox="0 0 512 512" preserveAspectRatio="xMidYMid meet" id="svg_document" style="zoom: 1;"><!-- Created with macSVG - https://macsvg.org/ - https://github.com/dsward2/macsvg/ --><title id="svg_document_title">Untitled.svg</title><defs id="svg_document_defs"><clipPath id="halfCircle"><rect y="0%" id="rect1" width="50%" height="100%" x="50%"></rect></clipPath><clipPath id="smallHalfCircle"><rect y="50%" id="rect2" width="100%" height="100%" x="0%"></rect></clipPath></defs><g id="main_group"><rect stroke="lightcoral" id="background_rect" stroke-width="16" x="8" rx="64" width="496px" y="8" fill="none" stroke-linejoin="round" ry="64" height="496px"></rect><circle clip-path="url(#halfCircle)" id="circle1" cy="256px" fill="lightcoral" r="40%" cx="256px" visibility="visible"></circle><circle clip-path="url(#smallHalfCircle)" id="circle2" cy="256px" fill="lightcoral" r="40%" cx="256px" visibility="visible"></circle></g></svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://web.resource.org/cc/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" version="1.1" baseProfile="full" width="512px" height="512px" viewBox="0 0 512 512" preserveAspectRatio="xMidYMid meet" id="svg_document" style="zoom: 1;"><!-- Created with macSVG - https://macsvg.org/ - https://github.com/dsward2/macsvg/ --><title id="svg_document_title">Untitled.svg</title><defs id="svg_document_defs"><clipPath id="halfCircle"><rect y="0%" id="rect1" width="50%" height="100%" x="50%"></rect></clipPath><clipPath id="smallHalfCircle"><rect y="50%" id="rect2" width="100%" height="100%" x="0%"></rect></clipPath></defs><g id="main_group"><rect stroke="lightcoral" id="background_rect" stroke-width="20" x="10px" rx="64" width="496px" y="10px" fill="none" stroke-linejoin="round" ry="64" height="496px"></rect><circle clip-path="url(#halfCircle)" id="circle1" cy="256px" fill="lightcoral" r="40%" cx="256px" visibility="visible"></circle><circle clip-path="url(#smallHalfCircle)" id="circle2" cy="256px" fill="lightcoral" r="40%" cx="256px" visibility="visible"></circle></g></svg>
|
||||
|
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
|
|
@ -12,7 +12,7 @@
|
|||
</clipPath>
|
||||
</defs>
|
||||
<g id="main_group">
|
||||
<rect id="background_rect" x="8" y="8" width="496px" height="496px" rx="64" ry="64" fill="none" stroke="#f08080" stroke-linejoin="round" stroke-width="16"/>
|
||||
<rect id="background_rect" x="10px" y="10px" width="496px" height="496px" rx="64" ry="64" fill="none" stroke="#f08080" stroke-linejoin="round" stroke-width="20"/>
|
||||
<circle id="circle1" cx="256px" cy="256px" r="40%" clip-path="url(#halfCircle)" fill="#f08080"/>
|
||||
<circle id="circle2" cx="256px" cy="256px" r="40%" clip-path="url(#smallHalfCircle)" fill="#f08080"/>
|
||||
</g>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
|
|
@ -42,7 +42,6 @@
|
|||
|
||||
<link rel="stylesheet" type="text/css" media="screen" href="{{ get_url(path='style/main.css', cachebust=true) }}" />
|
||||
|
||||
|
||||
{% if config.extra.stylesheets %}
|
||||
{% for stylesheet in config.extra.stylesheets %}
|
||||
<link rel="stylesheet" href="{{ get_url(path=stylesheet, cachebust=true) }}">
|
||||
|
|
|
|||
Loading…
Reference in New Issue