Public notes

How this site is built

For anyone who wants to borrow, steal, remix, or learn from tektinkers.com. This is the public site: HTML, CSS, JavaScript, and the small JSON endpoints the front-end already calls. No login credentials, crypto, network information, internal topography, databases, or other private infrastructure.

Download Markdown style.css script.js Back to home

You may save, scrape, print, or mirror this page. Techniques here are meant to be reused. Brand logos and character art still belong to their projects. Reuse the methods. Ask before republishing those images as your own brand. The portal has its own notes at portal.tektinkers.com/built.html.

What this includes

Polar palette, type, sticky header, footer
Homepage sections (hero, education, experience, volunteer, projects)
Theme switcher (Default / Spooky / Holiday)
Public subpages: Gaming, Gamer Garage, AI Arcade Games, 404 mini-game
Live TinkersCraft status badge (public JSON only)
Optional page-view ping (public JSON only)

Left out on purpose: login credentials, crypto, network information, internal topography/topology, databases, CMS ingest, server OS, and anything behind auth.

If a file is already served to browsers (HTML, CSS, JS, images), you can fetch it directly. That is the intended public source.

Stack

Most pages are static HTML plus shared CSS and JS. No framework, no bundler. Cache-bust with ?v= on CSS after changes.

Piece	Role
`index.html`	Homepage
`css/style.css`	Polar palette, header, footer, homepage layout
`js/script.js`	Year, themes, optional track ping, Minecraft status
`gaming/index.html`	Gaming directory
`gamergarage/`	Gallery page + public image-list JSON
`ai-arcade-games/`	Browser mini-games
`404/`	Custom 404 with a tiny paddle game
PHP under `/api/`	Small public JSON the front-end already calls

Public files you can fetch

JSON the front-end already calls:

GET /api/mc_server_status.php — { "online": true, "players": 3 }
POST /api/track.php — { "path": "/" } (skipped if Do Not Track is on)
GET /gamergarage/php/list_gallery.php — albums with full / thumb image URLs

Those endpoints are read-only (or a tiny path ping). They do not expose accounts or admin surfaces.

Palette

CSS variables live in css/style.css.

Token	Hex	Use
Polar deep	`#065758`	Page background
Polar ice	`#E2F0EF`	Body text
Polar mist	`#A9D4D6`	Muted text
Polar sea	`#82C3C5`	Secondary accent
Polar coral	`#C46960`	Accent, footer “How it's built”

:root {
  --bg: #065758;
  --text: #E2F0EF;
  --muted: #A9D4D6;
  --accent: #C46960;
  --accent-2: #82C3C5;
}

Page chrome

Sticky header with .nav and the brand mark. The homepage also has a Themes menu. Footer .foot is centered: copyright plus a coral, undecorated How it's built link to /built.html.

Holiday mode can show an extra footer line and string lights on the header. That is CSS (body.holiday-on), not a second site.

Theme switcher

js/script.js adds spooky-on or holiday-on on body.

Default — polar teal
Spooky — October by calendar; some images swap from /images/themes/spooky/
Holiday — day after Thanksgiving through 15 January; /images/themes/holiday/

A saved pick in localStorage only sticks for the current season. A new October or holiday window falls back to the calendar default.

Homepage and subpages

The homepage is ordinary HTML sections with fragment ids (#education, #experience, #volunteer, #projects, #ai-disclaimer). The hero is a two-column grid that stacks on small screens.

Gaming (/gaming/) uses the same header/footer chrome with page-specific sections for Discord, games, bots, and Twitch links.

Gamer Garage (/gamergarage/) is a gallery grid. JS asks the public list endpoint, then shows thumbs and a lightbox.

AI Arcade Games (/ai-arcade-games/) are canvas games in the browser. Game code is in /ai-arcade-games/games/.

404 (/404/) is a short message plus a paddle mini-game.

Borrowing recipes

Polar page: CSS variables on :root, sticky header, max-width container, coral accent buttons.
Seasonal theme: calendar check + body class + optional image swap from /images/themes/{name}/.
Footer credit line: one coral link, no underline, pointing at your own /built.html.

Copy CSS/JS from the live URLs. Change art, names, and URLs to yours.

Last updated: 26 August 2026. These notes are updated when the public tektinkers.com pages change. Plain-text twin: /built.md.