george/bibdle
1
0
Fork 0
mirror of https://github.com/pupperpowell/bibdle.git synced 2026-04-05 17:33:31 -04:00
Code Issues Packages Projects Releases Wiki Activity

feat: add about page, sitemap, social links component, Apple sign-in

Browse Source 
prompt on win screen, and layout/theme improvements

  ## New features

  - **About page** (`src/routes/about/`): New static about page rendered
    from `static/about.md` using the `marked` library (added as a
    dependency). Includes the project backstory content.

  - **XML sitemap** (`src/routes/sitemap.xml/`): Dynamic sitemap
    endpoint for SEO, registered in `static/robots.txt` via `Sitemap:`
    directive.

  - **Apple Sign In prompt on win screen** (`WinScreen.svelte`): When
    the game is won and the user is not logged in, a "Sign in to save
    your streak & see your stats" prompt with an Apple Sign In button is
    shown below the share card. Passes `anonymousId` so stats migrate on
    sign-up. Driven by new `isLoggedIn` and `anonymousId` props, passed
    from `+page.svelte`.

  ## Refactoring

  - **`SocialLinks` component**
    (`src/lib/components/SocialLinks.svelte`): Extracted the Bluesky,
    Twitter/X, and email social link icons from `Credits.svelte` into a
    reusable component. `Credits.svelte` now imports and renders
    `<SocialLinks />`.

  - **`ThemeToggle` component**
    (`src/lib/components/ThemeToggle.svelte`): New component for
    toggling light/dark mode, persisted to `localStorage`. Currently
    rendered but hidden (`hidden` class) in `+page.svelte` —
    infrastructure is in place for future use.

  ## Layout changes

  - **`+layout.svelte`**: Moved the page title/header (`<h1>` with
    `TitleAnimation`) and the gradient background wrapper from
    `+page.svelte` into the root layout, so it applies across all
    routes. Also removed the `browser` guard around the analytics script
    injection (it's
    already inside `onMount` which is client-only). Added `<meta
    name="description">`.

  - **`+page.svelte`**: Removed the title/header and gradient wrapper
    (now in layout). Minor formatting cleanup (reformatted `SearchInput`
    props, moved `currentDate` derived state earlier). `ThemeToggle`
    import swapped in place of `TitleAnimation` (which moved to layout).

  ## Styling

  - **`layout.css`**: Added `@custom-variant dark` for class-based dark
    mode toggling (supports `.dark` class on `<html>`). Added explicit
    `html.dark` / `html.light` rules alongside the existing
    `prefers-color-scheme` media query, so the `ThemeToggle` component
    can
    override the system preference. Added background transition
    animation.
This commit is contained in:
George Powell
2026-03-12 18:22:59 -04:00
parent 3de55ba216
commit 884bbe65c7
16 changed files with 444 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
static/about.md Normal file
View File

@@ -0,0 +1,15 @@
# About Bibdle
Bibdle is a daily Bible guessing game. Every day, a random verse is posted to the website. Try to figure out which book of the Bible it comes from, in as few guesses as possible. That's it!
---
The game was built with the hope that it would be a small, delightful thing people can make part of their day. It's not a Bible study course. You don't need to know the Bible inside and out to enjoy it or to learn something from it.
If you're someone who grew up in church and can name all 66 books in order, great. If you're someone who can barely tell the Old Testament from the New, that's great too. The game meets you where you are.
It is completely free. If you'd like to support the developer (who works solely on small projects like this one) or express your thanks, you can become a Bibdle patron.
If you use Bibdle, I would love to hear from you! I can be reached via email or through Bluesky.
<!-- social -->

47
static/how-to-play.md Normal file
View File

@@ -0,0 +1,47 @@
# How to Play
Each day, Bibdle gives you a verse from the Bible. Your job is to guess which book it comes from. (Genesis, John, Corinthians, etc.)
You have unlimited guesses.
---
## The Basics
1. **Read the verse.** It appears at the top of the page.
2. **Make a guess.** Type or select a book of the Bible from the list.
3. **Read the feedback.** After each guess, you'll get clues telling you how close you were.
4. **Keep guessing** until you get it right.
---
## Feedback Hints
After each wrong guess, you'll see the following hints:
| Hint | What it means |
|---|---|
| **Testament** | If your guess was in the correct Testament (Old or New) |
| **Section** | If your guess was in the correct section of the Bible (e.g. Gospels, Epistles, Major Prophets) |
| **First Letter** | If your guess has the same first letter as the correct guess |
Use the hints to narrow down your search.
---
## A Few Things to Know
- **Everyone plays the same verse each day.** The daily verse resets at midnight.
- **Your progress is saved automatically.** You can close the tab and come back later.
---
## Tips
- Pay attention to writing style: the voice of Psalms is very different from Paul's letters.
- Historical narrative (battles, kings, genealogies) tends to be Old Testament.
- Short, poetic, or wisdom-focused verses could be Proverbs, Ecclesiastes, or Psalms.
- If a verse mentions Jesus by name, it's in the New Testament.
Good luck!

2
static/robots.txt
View File

@@ -1,3 +1,5 @@
# allow crawling everything by default
User-agent: *
Disallow:
Sitemap: https://bibdle.com/sitemap.xml