feat: implement reference/cheatsheet pages
- Add reference page container to index.html with tab navigation
- Create comprehensive cheatsheets for CSS properties, selectors,
flexbox, grid, and HTML elements
- Add showReferencePage function with CodeMirror syntax highlighting
- Add reference_view analytics tracking
- Style reference tables, lists, and navigation with responsive design
Routes: #reference/css, #reference/selectors, #reference/flexbox,
#reference/grid, #reference/html
🤖 Generated with [Claude Code](https://claude.com/claude-code)
This commit is contained in:
@@ -135,6 +135,22 @@
|
||||
</article>
|
||||
</div>
|
||||
|
||||
<!-- Reference/Cheatsheet Pages -->
|
||||
<div class="reference-page hidden" id="reference-page">
|
||||
<article class="reference-content">
|
||||
<nav class="reference-nav" id="reference-nav">
|
||||
<a href="#reference/css" class="ref-nav-link" data-ref="css">CSS Properties</a>
|
||||
<a href="#reference/selectors" class="ref-nav-link" data-ref="selectors">Selectors</a>
|
||||
<a href="#reference/flexbox" class="ref-nav-link" data-ref="flexbox">Flexbox</a>
|
||||
<a href="#reference/grid" class="ref-nav-link" data-ref="grid">Grid</a>
|
||||
<a href="#reference/html" class="ref-nav-link" data-ref="html">HTML Elements</a>
|
||||
</nav>
|
||||
<div class="reference-body" id="reference-body">
|
||||
<!-- Reference content injected by JS -->
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
<main class="game-layout" id="main-content">
|
||||
<!-- Left Panel: Instructions + Editor -->
|
||||
<div class="left-panel">
|
||||
|
||||
Reference in New Issue
Block a user