N2CON TECHNOLOGY
Open menu

Theme Lab

Internal verification page for dark and light mode stability. This route intentionally reuses classes and patterns from home, about, services, contact, resources, and notes.

Root class
-
Data theme
-
Stored theme
-

Accent and CTA samples

These classes are heavily used throughout the site and are sensitive to dark and light transitions.

Service link sample Resource link sample About link sample
Lime CTA Lime CTA variant
  • ✓ Lime CTA text remains readable in both themes
  • ✓ Navy accent links do not disappear after dark to light
  • ✓ Prose links and paragraphs remain visible on notes style blocks
  • ✓ Project tags remain readable through rapid toggle cycles
  • ✓ Form controls and dropdown text remain readable
  • ✓ Header toggle state stays in sync with root and localStorage

Project tag strip sample

This mirrors the homepage tile treatment near "More than just monthly management".

Telecom sourcing
A/V install
Migrations
Automation
Disaster recovery planning
Incident response tabletop exercises
Security gap analysis
IT relocation services

Prose and note-detail sample

A note-detail style content block

This uses the same prose utility pattern as note detail pages. It includes inline links, mixed emphasis, and list rendering.

  • Paragraph readability should remain consistent after rapid toggles.
  • Links should remain visible in both themes.
  • Heading contrast should meet WCAG expectations.
const theme = document.documentElement.dataset.theme;
window.ThemeController?.toggleTheme();

Form controls sample