Skip to content

feat: redesign the landing page, footer and fonts - #44

Merged
rizukirr merged 2 commits into
mainfrom
redesign/landing-features-install
Oct 9, 2026
Merged

rizukirr merged 2 commits into
mainfrom
redesign/landing-features-install

Conversation

@rizukirr

@rizukirr rizukirr commented Oct 9, 2026 •

Copy link
Copy Markdown
Member

Summary

Maintainer PR. Redesigns the landing page below the hero, rewrites the hero's WebGL scene, flattens the footer and replaces the site fonts. No content under docs/ or blog/ changes.

What changes?

Features section

  • The six icon cards are replaced by a sun curve for one day with the five prayers placed on it at their times. The times are the sample day already shown in docs/command.md, and the caption says it is sample output of muslimtify show.
  • A four-stop strip shows the default reminders before Maghrib (30, 15 and 5 minutes), then the prayer.
  • The features are a plain two-column list. "No internet" became "The only network request is an optional location lookup", matching docs/get-started.md.
  • On phones the curve drops its labels and the five times appear as a list.

Install section

  • The fake terminal window is gone. Each distro tab shows numbered steps with one command and one copy button per step, ending with muslimtify show.
  • The commands are the same ones as in docs/get-started.md, split at &&.

Community section and footer

  • The community band is left-aligned with three link rows: Discord, Contribute, Sponsor.
  • The footer is one row of links plus the copyright line, in the night palette in both light and dark mode. The link list moved from three titled columns to a flat list in docusaurus.config.ts.
  • The eyebrow labels above section headings are removed.

Hero scene (NightSky)

  • The fragment shader is rewritten. The sea is a plane in perspective shaded from wave slopes, moonlight falls in a single glitter path, and the horizon is straight.
  • The moon is smaller and its glow sits on the lit edge. The boat is a sloop with hull, cabin, mast, sails, stays, lit windows and a reflection.
  • The moon and boat stay on screen on narrow viewports.
  • getContext now passes failIfMajorPerformanceCaveat: true, so a browser that can only emulate WebGL on the CPU gets the CSS gradient fallback.

Fonts

  • Headings use Montserrat, body and UI use Open Sans, code uses IBM Plex Mono. All are self-hosted Latin subsets in static/fonts/, so no request goes to Google.
  • fraunces.woff2 is removed.

Checklist

  • npm run typecheck passes locally.
  • npm run build passes locally.
  • Hero animation checked in a real browser on a machine with a GPU. Only still frames of the shader were verified, in headless Firefox.
  • WebGL fallback checked on a software-rendered machine.
  • Install steps re-tested against the real Muslimtify CLI. They were copied from the existing docs, not re-run.

Known follow-ups

  • static/img/features/*.png (the six old card icons) are no longer referenced and can be deleted.
  • The OFL license texts for the three fonts are not included in the repo yet.
  • The CSS fallback gradient on the canvas still puts its glow near the old moon position.
  • The new shader does more work per pixel than the old one. Watch for stutter on weak integrated graphics.

AI disclosure

Claude Code wrote all of the code and copy in this PR, directed and reviewed by the maintainer on a local dev server. The sun curve is drawn in code as an illustration fitted to the sample day. It is not output from libmuslim.

Replace the feature card grid with a sun-curve figure of a sample day,
a reminder strip and a plain fact list. Split the install commands into
numbered steps per distro. Rework the community section into link rows
and flatten the footer into one row in the night palette.

Rewrite the NightSky shader: the sea is a plane in perspective shaded
from wave slopes, moonlight falls in one glitter path, the horizon is
straight, the moon is smaller and the boat is a sloop with lit windows.
The canvas now refuses a CPU-emulated WebGL context and falls back to
the CSS gradient.

Switch to self-hosted Montserrat, Open Sans and IBM Plex Mono and drop
Fraunces.
@vercel

vercel Bot commented Oct 9, 2026 •

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
muslimtify Ready Ready Preview Oct 9, 2026 5:54am UTC

@rizukirr
rizukirr merged commit 39704ca into main Oct 9, 2026
3 checks passed
@rizukirr
rizukirr deleted the redesign/landing-features-install branch October 9, 2026 05:57

This branch was successfully deployed

1 active deployment
Preview — aa4c501e Deployed Oct 9, 2026 by vercel[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant