mirror of
https://github.com/pbakaus/impeccable.git
synced 2026-09-18 00:56:30 +03:00
Paul BakausandClaude Opus 4.6
03a4433dcc
Major site restructure reflecting Impeccable's expanded value prop: - 01 The Foundation: 7 design dimensions, 212 guidelines grid - 02 The Language: merged periodic table + Commands in Action - 03 The Antidote: moved from position 1, anti-patterns + gallery - 04 Visual Mode: live iframe embed of detection overlay demo - Composite demo page combining purple gradients + side-tab cards - Updated hero copy (212 guidelines, 22 commands) - 7-item sticky nav, backward-compat anchor aliases Detection overlay improvements: - Staggered entrance animation (80ms per element) - Banner slides in from top - Skip body/html from overlay targeting (fixes scrollbar bug) - Banner overflow: hidden + maxWidth: 100vw - CLAUDE.md: document that browser script is generated, never edit directly Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
20 lines
638 B
JavaScript
20 lines
638 B
JavaScript
import { skillFocusAreas, dimensionGuidelineCounts } from '../data.js';
|
|
|
|
export function initFoundationGrid() {
|
|
const container = document.querySelector('.foundation-grid');
|
|
if (!container) return;
|
|
|
|
const dimensions = skillFocusAreas['impeccable'];
|
|
if (!dimensions) return;
|
|
|
|
container.innerHTML = dimensions.map(dim => `
|
|
<div class="foundation-card">
|
|
<div class="foundation-card-header">
|
|
<span class="foundation-card-label">${dim.area}</span>
|
|
<span class="foundation-card-count">${dimensionGuidelineCounts[dim.area] || ''}</span>
|
|
</div>
|
|
<p class="foundation-card-detail">${dim.detail}</p>
|
|
</div>
|
|
`).join('');
|
|
}
|