Add random “Tip of the Week” widget to homepage

[adulau]

Motivation

• Surface community-maintained tips on the homepage by loading a random entry from the public JSON feed to provide timely, helpful guidance.
• Keep the widget accessible and resilient with loading text, an aria-live region, and a graceful fallback when the feed is unavailable.
• Allow visitors to request another tip and ensure external links are validated for safety before rendering.

Description

• Inserted a homepage partial layouts/partials/tip-of-the-week.html and included it in layouts/index.html to render the tip card and a deferred script.
• Added client-side logic in static/js/tip-of-the-week.js to fetch the JSON feed, flexibly normalize entries, validate/whitelist HTTP(S) links, choose a non-repeating random tip, and expose a refresh control.
• Added responsive widget styles to static/css/custom.css to match the site design and adapt to mobile layouts.
• Implemented an offline/failed-fetch fallback that displays a friendly message and a link to the tips repository.

Testing

• Ran a static syntax check node --check static/js/tip-of-the-week.js, which completed successfully.
• Exercised the widget in a Node VM unit test that mocked fetch and DOM elements and validated expected rendering and refresh behavior, which passed.
• A Hugo build (hugo --minify) could not be executed in the environment because Hugo is not installed, so the final site build and visual screenshot were not generated.

---

Codex Task

[chatgpt-codex-connector]

Codex Review Summary

This comment shows the latest Codex review activity on this pull request.

Review	Status	Commit	Review trigger
📝 Code Review	✅ Completed 2026-09-29T13:14:34.834171Z	6927db7	PR opened
🔒 Security Review	✅ Completed 2026-09-29T13:15:04.959599Z	6927db7	PR opened

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review" or "@codex security review".

Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings.

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 6927db7984

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

[chatgpt-codex-connector]

Guard the Fetch API before invoking it

In browsers or embedded webviews without the Fetch API, this call throws a synchronous ReferenceError, so the promise .catch() is never reached and the widget remains stuck on “Loading a tip…” rather than displaying its graceful fallback. Feature-detect window.fetch and invoke the same fallback path when it is unavailable.

Useful? React with 👍 / 👎.