Add examples page like Processing.org layout

pepc84 · pepc84 · commit 71a2006dfe05 · 2026-06-10T19:26:22.000-07:00
diff --git a/examples.html b/examples.html
@@ -1,53 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Examples - C++ Mode for Processing</title>
-  <style>
-    * { margin: 0; padding: 0; box-sizing: border-box; }
-    body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #111; background: #fff; }
-    a { color: #111; text-decoration: none; }
-    nav { border-bottom: 1px solid #e0e0e0; padding: 0 3rem; display: flex; align-items: center; justify-content: space-between; height: 60px; }
-    .nav-logo { display: flex; align-items: center; gap: 10px; color: #111; }
-    .nav-logo img { width: 28px; height: 28px; }
-    .nav-logo span { font-size: 15px; font-weight: 500; }
-    
-    .layout { display: flex; min-height: calc(100vh - 60px); }
-    .sidebar {
-      width: 180px; min-width: 180px;
-      border-right: 1px solid #e0e0e0;
-      padding: 2rem 1.5rem;
-      display: flex; flex-direction: column; gap: 0.25rem;
-    }
-    .sidebar a { font-size: 14px; color: #555; padding: 0.35rem 0; display: block; }
-    .sidebar a:hover { color: #111; }
-    .sidebar a.active { color: #111; font-weight: 500; }
-    .page-content { flex: 1; max-width: 720px; padding: 4rem 3rem; }
-
-    .page-content h1 { font-size: 2rem; font-weight: 600; margin-bottom: 1rem; }
-    .page-content p { color: #555; line-height: 1.8; }
-    footer { border-top: 1px solid #e0e0e0; padding: 2rem; text-align: center; font-size: 13px; color: #888; }
-  </style>
-</head>
-<body>
-<nav>
-  <a href="index.html" class="nav-logo">
-    <img src="assets/cpp-logo.png" alt="C++ Mode">
-    <span>C++ Mode</span>
-  </a>
-</nav>
-<div class="layout">
-  <div class="sidebar">
-    <a href="reference.html" >Reference</a>
-    <a href="examples.html" class='active'>Examples</a>
-    <a href="about.html" >About</a>
-  </div>
-  <div class="page-content">
-  <h1>Examples</h1>
-  <p>Examples coming soon.</p>
-</div>
-</div>
-<footer><p>C++ Mode for Processing</p></footer>
-</body>
-</html>
