diff --git a/gitea/custom/README.md b/gitea/custom/README.md index 706488f..baa6d76 100644 --- a/gitea/custom/README.md +++ b/gitea/custom/README.md @@ -6,16 +6,26 @@ when it starts, so a template change needs a restart; files under `public/` are - `templates/home.tmpl`: the signed-out home page, Teahub = Git + Tea + Time beside the cup. - `templates/user/dashboard/dashboard.tmpl`: Gitea 28's dashboard with the repository list and the contribution heatmap moved into the sidebar. -- `templates/custom/header.tmpl`, `templates/custom/footer.tmpl`: load `teahub.css` and `teahub.js`. Bump their - `?v=` when those files change, because browsers keep assets for hours. +- `templates/base/head_opengraph.tmpl`: Gitea 28's link-preview tags. Pages that aren't a repository or a profile + (home, explore, sign-in) point `og:image` at the absolute URL of `og-card.png`, give its size, and ask for the large + card (`twitter:card`), so Discord, WhatsApp, iMessage and Slack show it. Repositories, issues and profiles keep + Gitea's avatars. +- `templates/custom/header.tmpl`, `templates/custom/footer.tmpl`: load `teahub.css` and `teahub.js`, and link the + home-screen icon. Bump their `?v=` when those files change, because browsers keep assets for hours. - `public/assets/css/teahub.css`: green tea colours for Gitea's light, dark and auto themes, the name beside the navbar's cup, the home page and the sidebar. - `public/assets/js/teahub.js`: the home page's title, "Powered by Teahub", and the dashboard's Domains tab, which asks Tea MCP's `GET /domains` (Cloudflare Registrar) and shows exact names and suggestions with their prices. -- `public/assets/img/`: the 🍵 mark. The SVGs draw the emoji in the reader's own emoji font. The PNGs (link previews, - browser tabs, phone home screens) are Noto Emoji's U+1F375 (googlefonts/noto-emoji, Apache License 2.0). +- `public/assets/img/`: the 🍵 mark. The SVGs draw the emoji in the reader's own emoji font. The PNGs are Noto Emoji's + U+1F375 (googlefonts/noto-emoji, Apache License 2.0). `apple-touch-icon.png` is the cup on Teahub green (#2f9e44), + 180×180 and opaque (iOS turns transparency black), for phone home screens. `og-card.png` is the 1200×630 link + preview, the home page's hero; keep it under 300 KB, because WhatsApp drops bigger preview images. +- `src/`: the HTML those two PNGs are rendered from. Not copied to prod. To redo one: headless Chrome at 1× with the + page's size (`--headless=new --force-device-scale-factor=1 --window-size=1200,630 --virtual-time-budget=6000 + --screenshot`), then quantise to 256 colours (Pillow `quantize(256, MEDIANCUT, dither NONE)`) and look at it. -The two page templates are Gitea 28.0.0's with Teahub's changes. After a Gitea upgrade, compare them with the new -release's (`gitea embedded extract --destination x 'templates/**'`) before deploying it. +The three Gitea templates here (home, dashboard, head_opengraph) are Gitea 28.0.0's with Teahub's changes. After a +Gitea upgrade, compare them with the new release's (`gitea embedded extract --destination x 'templates/**'`) before +deploying it. `../sync-custom.sh` puts this directory on prod (it needs flyctl signed in to Teahub's Fly organisation). diff --git a/gitea/custom/public/assets/img/apple-touch-icon.png b/gitea/custom/public/assets/img/apple-touch-icon.png index 16d2137..70eab32 100644 Binary files a/gitea/custom/public/assets/img/apple-touch-icon.png and b/gitea/custom/public/assets/img/apple-touch-icon.png differ diff --git a/gitea/custom/public/assets/img/og-card.png b/gitea/custom/public/assets/img/og-card.png new file mode 100644 index 0000000..041e585 Binary files /dev/null and b/gitea/custom/public/assets/img/og-card.png differ diff --git a/gitea/custom/src/apple-touch-icon.html b/gitea/custom/src/apple-touch-icon.html new file mode 100644 index 0000000..b855750 --- /dev/null +++ b/gitea/custom/src/apple-touch-icon.html @@ -0,0 +1,4 @@ +Teahub home-screen icon, 180x180 diff --git a/gitea/custom/src/og-card.html b/gitea/custom/src/og-card.html new file mode 100644 index 0000000..82b9152 --- /dev/null +++ b/gitea/custom/src/og-card.html @@ -0,0 +1,19 @@ + + +Teahub link preview card, 1200x630 + + +

Teahub

Git+Tea+Time
+
teahub.xyz
+ diff --git a/gitea/custom/templates/base/head_opengraph.tmpl b/gitea/custom/templates/base/head_opengraph.tmpl new file mode 100644 index 0000000..5f41880 --- /dev/null +++ b/gitea/custom/templates/base/head_opengraph.tmpl @@ -0,0 +1,51 @@ +{{- /* og:description - a one to two sentence description of your object, maybe it only needs at most 300 bytes */ -}} +{{if .PageIsUserProfile}} + + + + + {{if .ContextUser.Description}} + + {{end}} +{{else if .Repository}} + {{if .Issue}} + + + {{if .Issue.Content}} + + {{end}} + {{else if or .PageIsDiff .IsViewFile}} + + + {{if and .PageIsDiff .Commit}} + {{- $commitMessageBody := .Commit.MessageBody -}} + {{- if $commitMessageBody -}} + + {{- end -}} + {{end}} + {{else}} + + + {{if .Repository.Description}} + + {{end}} + {{end}} + + {{if (.Repository.AvatarLink ctx)}} + + {{else}} + + {{end}} +{{else}} + {{/* Teahub: the 1200x630 card at an absolute URL (WhatsApp needs one), its size, and the large-card layout. */}} + + + + + + + + + +{{end}} + diff --git a/gitea/custom/templates/custom/header.tmpl b/gitea/custom/templates/custom/header.tmpl index 7135ae1..a407249 100644 --- a/gitea/custom/templates/custom/header.tmpl +++ b/gitea/custom/templates/custom/header.tmpl @@ -1,2 +1,3 @@ +