GGG Website

Static website for GGG — "A safe space where you matter" — served by nginx in a Docker container.

Run it

docker compose up -d --build

Then open http://localhost:8080. Stop with docker compose down.

After editing anything in site/, rebuild: docker compose up -d --build.

Structure

site/
├── index.html       Home (hero, featured videos, quick links, newsletter)
├── about.html       About & Mission
├── community.html   Community Updates (schedule, announcements, LoL queue)
├── resources.html   Resources (Saprea, crisis lines, parent resources)
├── blog.html        Blog (sample posts, categories, search)
├── stories.html     Testimonials & community stories (+ submission form)
├── faq.html         FAQ (collapsible Q&A by topic)
├── store.html       Merch store (placeholder grid, ready to populate)
├── contact.html     Contact form, social links, newsletter
├── css/style.css    Brand palette, all shared styles
└── js/main.js       Mobile nav, footer year, placeholder-form handling

Clean URLs work too — /about, /faq, etc. resolve to the .html files.

League of Legends game queue link

The placeholder lives in site/community.html in the block marked LEAGUE OF LEGENDS LIVE GAME QUEUE (id game-queue). When the queue link exists, replace the disabled span with:

<a class="btn btn--primary" href="YOUR_QUEUE_LINK_HERE">Join the Queue</a>

The homepage "Streaming Schedule" quick-link and the FAQ both point to community.html#game-queue, so they'll work automatically.

Before launch — fill in the TODOs

Search the HTML for TODO comments. The big ones:

• Links — YouTube channel/playlists, Discord invite, Patreon, Twitch, social links (currently # placeholders).
• Videos — replace VIDEO_ID in the YouTube embeds on index.html.
• Photos — Garnet's photo in the hero and About page.
• Email — replace hello@example.com on the contact page.
• Forms — newsletter/contact/story forms are marked data-placeholder and show a friendly notice on submit. Wire them to a service (Formspree, Mailchimp/Buttondown embed, etc.) by setting the form action and removing the data-placeholder attribute.
• Content — mission statement, Garnet's intro/story, real schedule, real testimonials, blog posts, FAQ perks list, legal pages (privacy/terms/accessibility links in the footer).