ParzivalTD/Brain
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
aa24759ac0668c7aa1f5124fc3e105f8a331b4b9
Brain/TekDek-Implementation-Checklist.md

9.0 KiB
Raw Blame History

TekDek Documentation Website - Implementation Checklist

For: Talos (PHP) & Icarus (CSS)
Project: Documentation Website Build
Status: Ready for Implementation

TALOS - PHP IMPLEMENTATION CHECKLIST

Phase 1: Foundation Setup

  • Create folder structure:

    /web.tekdek.dev/
├── /includes/
├── /pages/
├── /css/
├── /js/
├── /assets/
└── index.php

  • Create /includes/config.php

    • Define color constants
    • Define font constants
    • Define site meta (name, URL, description)
    • Define $MENU array (navigation structure)
    • Define $PAGE_META array (page titles & breadcrumbs)

  • Create /includes/helpers.php

    • getCurrentPage()
    • getPageMeta()
    • renderMarkdown()
    • Other utility functions

  • Install Markdown Parser

    • Download Parsedown or equivalent to /includes/
    • Test markdown rendering

Phase 2: Templates

  • Create /includes/top.php

    • DOCTYPE and head section
    • Google Fonts import
    • CSS includes
    • Header with logo
    • Navigation toggle button (mobile)
    • Include menu.php
    • Breadcrumb section (conditional)
    • Open main tag

  • Create /includes/menu.php

    • Recursive menu builder function
    • Multi-level dropdown support
    • Active page detection
    • Mobile-friendly structure

  • Create /includes/bottom.php

    • Close main tag
    • Footer with links
    • Script includes (menu.js)
    • Close HTML

Phase 3: Pages - Landing

  • Create /pages/landing.php
    • Page meta setup
    • Hero section with title, subtitle, description
    • CTA buttons to Vision & Projects
    • Quick links grid (4 cards)
    • Test: All links work, responsive

Phase 4: Pages - About Section

  • Create /pages/about/vision.php

    • Load TekDek-Strategy.md via renderMarkdown()
    • Set page title and breadcrumb
    • Sidebar with section links
    • Test: Markdown renders correctly

  • Create /pages/about/model.php

    • Load TekDek-Brainstorm-Reference.md
    • Set page title and breadcrumb
    • Sidebar with section links
    • Test: Markdown renders correctly

Phase 5: Pages - Projects Section

  • Create /pages/projects/master-plan.php

    • Load TekDek-Master-Project-Plan.md
    • Set breadcrumb: Projects > Master Plan
    • Test: Renders correctly

  • Create /pages/projects/status.php

    • Load PROJECT-STATUS.md
    • Set breadcrumb: Projects > Status
    • Test: Renders correctly

  • Create /pages/projects/overview.php

    • Load PROJECT-OVERVIEW.md
    • Set breadcrumb: Projects > Overview
    • Test: Renders correctly

Phase 6: Pages - Tools Section

  • Create /pages/tools/index.php

    • Load Tool-Requirements.md
    • Set page title: Tools & Tech
    • Create sidebar with links to tech-stack
    • Test: Renders correctly

  • Create /pages/tools/tech-stack.php

    • Custom content or additional markdown
    • Set breadcrumb: Tools & Tech > Tech Stack
    • Test: Renders correctly

Phase 7: Pages - Other Sections

  • Create /pages/team.php

    • Redirect to /team.html (existing employees page)
    • Or embed /team.html via iframe if simpler

  • Create /pages/decisions/checklist.php

    • Load Master-Plan-Quick-Checklist.md
    • Set breadcrumb: Decisions > Checklist
    • Test: Renders correctly

  • Create /pages/404.php

    • 404 error page with link back to home
    • Use consistent styling

Phase 8: Routing

  • Create /index.php (main router)

    • Parse request URI
    • Match to routes array
    • Include appropriate page file
    • Handle 404s

  • Create /assets/docs/ folder

    • Verify all markdown files exist:
      • TekDek-Strategy.md
      • TekDek-Brainstorm-Reference.md
      • TekDek-Master-Project-Plan.md
      • PROJECT-STATUS.md
      • PROJECT-OVERVIEW.md
      • Tool-Requirements.md
      • Master-Plan-Quick-Checklist.md

  • Configure .htaccess (if using Apache)

    • Enable mod_rewrite
    • Set up clean URL rewriting
    • Test: /about/vision loads vision.php

Phase 9: JavaScript

  • Create /js/menu.js
    • Menu toggle function
    • Close menu on link click
    • Close menu on outside click
    • Test: Mobile menu toggle works

Phase 10: Testing & Optimization

  • Test all pages load without errors
  • Test navigation works (desktop & mobile)
  • Test responsive design at breakpoints
  • Test markdown rendering quality
  • Test 404 page displays
  • Test performance (page load time < 2s)
  • Check for PHP errors in logs
  • Verify file permissions (755 dirs, 644 files)

Phase 11: Deployment

  • Set correct file permissions
  • Copy files to web.tekdek.dev
  • Test on live server
  • Verify SSL/HTTPS working
  • Check analytics (if configured)

ICARUS - CSS IMPLEMENTATION CHECKLIST

Phase 1: Color & Variables

  • Create /css/base.css
  • Define CSS variables:
    • --color-bg: #0d0d0f
    • --color-fg: #e0e0e0
    • --color-gold: #C4A24E
    • --color-steel: #7B8794
    • --color-amber: #E07A2F
    • --color-border: #2a2a2d
    • All spacing variables
    • All typography variables
    • Z-index hierarchy

Phase 2: Typography & Reset

  • Implement CSS reset (*, body, html)
  • Set base font: Inter
  • Configure heading hierarchy (h1-h6)
  • Style links, code, blockquotes
  • Import Google Fonts (Cinzel, Inter, JetBrains Mono)
  • Test: Fonts load and display correctly

Phase 3: Layout Components

  • Create /css/base.css (continued)
  • Style header (sticky, gradient, dark)
  • Style navigation menu
  • Style dropdown menus
  • Style main content area
  • Style footer
  • Style breadcrumb

Phase 4: Components

  • Create /css/components.css
  • Button styles (primary, secondary, hover states)
  • Card styles (hover, shadow, border)
  • Hero section (gradient, typography hierarchy)
  • Quick links grid
  • Content layout (2-column with sidebar)
  • Sidebar sections
  • Tables (header, rows, hover)
  • Blockquotes

Phase 5: Responsive Design

  • Create /css/responsive.css

  • Tablet (768px breakpoint)

    • Stack menu vertically
    • Hide dropdown menus (show on click)
    • Adjust hero font sizes
    • Single-column content layout
    • Adjust spacing/padding

  • Mobile (480px breakpoint)

    • Reduce all font sizes (h1-h6)
    • Adjust button sizes
    • Stack everything single column
    • Reduce spacing
    • Ensure touch targets are 44px minimum

  • Print styles

    • Hide header, footer, sidebar
    • Black text on white
    • Show URLs for links

Phase 6: Transitions & Effects

  • Add smooth transitions (0.2s-0.3s)

  • Hover effects:

    • Links change color
    • Buttons scale slightly (translateY)
    • Cards lift on hover (shadow + transform)

  • Menu animations:

    • Dropdown slide-down effect
    • Mobile menu expand/collapse smoothly

Phase 7: Color Testing

  • Test contrast ratios (WCAG AA minimum)

    • Gold (#C4A24E) on dark background OK?
    • Steel (#7B8794) text readable?
    • Amber (#E07A2F) sufficient contrast?

  • Test in light mode (if browser requests it)

  • Test print mode

Phase 8: Cross-Browser Testing

  • Chrome/Edge (latest)
  • Firefox (latest)
  • Safari (latest, if Mac available)
  • Mobile Chrome
  • Mobile Safari

Phase 9: Accessibility

  • Color contrast meets WCAG AA
  • Focus states visible (for keyboard navigation)
  • Button sizes adequate (44px minimum)
  • No reliance on color alone
  • Semantic HTML (h1, nav, main, footer)

Phase 10: Optimization

  • Minify CSS (optional, for production)
  • Remove unused styles
  • Optimize font loading (font-display: swap)
  • Test page load time
  • Check CSS file sizes

INTEGRATION CHECKLIST (Both)

  • All pages load without errors
  • Navigation works top to bottom
  • Markdown renders with proper styling
  • Responsive design works at all breakpoints
  • Mobile menu toggle works
  • Hero section looks beautiful
  • Cards have proper hover effects
  • Footer is sticky (or naturally positioned)
  • 404 page displays correctly
  • Links don't have broken references
  • All team page link works
  • Page load time acceptable (< 2s)

KNOWN DEPENDENCIES

  • Google Fonts: Cinzel, Inter, JetBrains Mono
  • Markdown Parser: Parsedown (or similar)
  • PHP Version: 7.4+
  • Web Server: Apache (mod_rewrite) or Nginx

HANDOFF SIGNALS

Signal Meaning
✅ Task complete and tested
🔄 In progress
⏳ Blocked, waiting on other task
❌ Not started
🐛 Bug found, needs fixing

Document Created: 2026-04-12
For: Talos & Icarus
Next Step: Start Phase 1 in order

Reference in New Issue View Git Blame Copy Permalink