puttaalu/photog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Switch English serif from Vollkorn to Crimson Pro

Browse Source 
Vollkorn read as too chunky next to the Malayalam bio in Manjari.
Crimson Pro is a calmer book-face serif that pairs more evenly.

Renames the CSS variable from --vk to --serif to reflect that the
value is no longer Vollkorn-specific, and bumps .ml to 17px/1.5
so the Malayalam subtitle sits at a comfortable reading size.
This commit is contained in:
puttaalu
2026-07-02 02:02:12 +02:00
parent cd19795e9e
commit fcedf7e06a
4 changed files with 18 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/style.css
+11 -9
View File
@@ -9,8 +9,8 @@
--fg4: #a89984;
--aqua: #8ec07c;
--line: #3c3836;
--vk: 'Vollkorn', Georgia, serif;
--mj: 'Manjari', sans-serif;
--serif: 'Crimson Pro', Georgia, serif;
--mj: 'Manjari', sans-serif;
}
*, *::before, *::after {
@@ -22,7 +22,7 @@
body {
background: var(--bg);
color: var(--fg);
font-family: var(--vk);
font-family: var(--serif);
min-height: 100vh;
}
@@ -65,11 +65,11 @@ body {
font-size: 32px;
font-weight: 700;
color: var(--fg3);
font-family: var(--vk);
font-family: var(--serif);
}
.pinfo h1 {
font-family: var(--vk);
font-family: var(--serif);
font-size: 26px;
font-weight: 700;
color: var(--fg);
@@ -108,6 +108,8 @@ body {
font-family: var(--mj);
font-style: normal;
font-weight: 400;
font-size: 17px;
line-height: 1.5;
}
.rss-a {
@@ -174,7 +176,7 @@ body {
text-decoration: none;
padding: 8px 0;
margin-bottom: 16px;
font-family: var(--vk);
font-family: var(--serif);
}
.back-btn:hover {
@@ -240,7 +242,7 @@ body {
font-size: 14px;
font-weight: 600;
color: var(--fg3);
font-family: var(--vk);
font-family: var(--serif);
flex-shrink: 0;
}
@@ -248,11 +250,11 @@ body {
font-size: 14px;
font-weight: 600;
color: var(--fg);
font-family: var(--vk);
font-family: var(--serif);
}
.dcaption {
font-family: var(--vk);
font-family: var(--serif);
font-size: 17px;
font-style: italic;
color: var(--fg);
templates/index.html
+1 -1
View File
@@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Photo Gallery</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Vollkorn:ital,wght@0,400;0,600;0,700;1,400&family=Manjari:wght@100;400;700&display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Crimson+Pro:ital,wght@0,400;0,600;0,700;1,400&family=Manjari:wght@100;400;700&display=swap">
<link rel="stylesheet" href="/static/style.css">
<link rel="alternate" type="application/atom+xml" href="/feed.xml" title="Photo Feed">
</head>
templates/photo.html
+1 -1
View File
@@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{.Photo.Caption}}</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Vollkorn:ital,wght@0,400;0,600;0,700;1,400&family=Manjari:wght@100;400;700&display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Crimson+Pro:ital,wght@0,400;0,600;0,700;1,400&family=Manjari:wght@100;400;700&display=swap">
<link rel="stylesheet" href="/static/style.css">
<link rel="alternate" type="application/atom+xml" href="/feed.xml" title="Photo Feed">
</head>
templates/upload.html
+5 -5
View File
@@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Upload — Photo Gallery</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Vollkorn:ital,wght@0,400;0,600;0,700;1,400&family=Manjari:wght@100;400;700&display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Crimson+Pro:ital,wght@0,400;0,600;0,700;1,400&family=Manjari:wght@100;400;700&display=swap">
<link rel="stylesheet" href="/static/style.css">
<style>
.upload-page {
@@ -13,7 +13,7 @@
padding: 32px 20px;
}
.upload-page h2 {
font-family: var(--vk);
font-family: var(--serif);
font-size: 22px;
font-weight: 600;
color: var(--fg);
@@ -53,7 +53,7 @@
color: var(--fg4);
pointer-events: none;
}
.drop-prompt p { font-size: 14px; font-family: var(--vk); }
.drop-prompt p { font-size: 14px; font-family: var(--serif); }
.drop-prompt small { font-size: 12px; font-family: monospace; }
#preview {
display: none;
@@ -84,7 +84,7 @@
outline: none;
transition: border-color 0.2s;
}
.field input[type="text"] { font-family: var(--vk); }
.field input[type="text"] { font-family: var(--serif); }
.field input[type="date"] { font-family: monospace; font-size: 14px; color-scheme: dark; }
.field input:focus { border-color: var(--fg4); }
.submit-btn {
@@ -92,7 +92,7 @@
background: var(--bg1);
border: 1px solid var(--bg2);
color: var(--fg2);
font-family: var(--vk);
font-family: var(--serif);
font-size: 16px;
font-weight: 600;
padding: 12px;