Add examples page

src/config/sidebarConfig.ts

@@ -202,6 +202,19 @@ export const sidebarSections: Record<string, SidebarSection[]> = {
         },
     ],
 
+    // Examples section
+    '/examples': [
+        {
+            label: 'Examples',
+            items: [
+                {
+                    label: 'Overview',
+                    slug: 'examples',
+                },
+            ],
+        },
+    ],
+
     // Best Practices section
     '/best-practices': [
         {

src/content/docs/examples/1678-2026-code.mdx

@@ -0,0 +1,10 @@
+---
+title: "1678's 2026 Code"
+description: In-depth code analysis of 1678's 2026 robot code
+---
+
+## Links
+
+* [Robot code repository](https://github.com/frc1678/C2026-Public)
+* [1678 Citrus Circuits 2026 CAD and Robot Code Release](https://www.chiefdelphi.com/t/1678-citrus-circuits-2026-cad-and-robot-code-release/521535)
+* [1678 Citrus Circuits | Behind the Bumpers | FRC REBUILT](https://www.youtube.com/watch?v=wsAJGi3yxSk)

src/content/docs/examples/581-2026-code.mdx

@@ -0,0 +1,9 @@
+---
+title: 581 2026 Code
+description: In-depth code analysis of 581's 2026 robot code
+---
+
+## Links
+
+* [Robot code repository](https://github.com/team581/frc-2026)
+* [581 Blazing Bulldogs 2026 CAD and Code Release](https://www.chiefdelphi.com/t/581-blazing-bulldogs-2026-cad-and-code-release/521762)

src/content/docs/examples/6328-2026-code.mdx

@@ -0,0 +1,82 @@
+---
+title: 6328 2026 Code
+description: In-depth code analysis of 6328's 2026 robot code
+---
+
+## Links
+
+* [Robot code repository](https://github.com/Mechanical-Advantage/RobotCode2026Public)
+* [FRC 6328 Mechanical Advantage 2026 Build Thread](https://www.chiefdelphi.com/t/frc-6328-mechanical-advantage-2026-build-thread/509595)
+* [6328 Mechanical Advantage | Behind the Bumpers | FRC REBUILT Robot](https://www.youtube.com/watch?v=-mxl5Mrm7RQ)
+
+## Logging
+
+AdvantageKit is a logging framework developed by Mechanical Advantage for deterministic log replay.
+It is based on the idea that the goal of the robot code is to convert inputs into outputs.
+
+![Logging](/examples/logging.png)
+
+> Instead of logging a limited set of values from the user code, AdvantageKit records all of the data flowing into the robot code.
+> Every sensor value, button press, and much more is logged every loop cycle.
+> After a match, these values can be replayed to the robot code in a simulator.
+> Since every input command is the same, all of the internal logic of the code is replayed exactly.
+> This allows you to log extra fields after the fact, or modify pipelines to see how they would have functioned during the match.
+> This technique means that logging is more than just a tool for checking on specific issues; it's also a safety net that can be used to verify how any part of the code functions.
+
+## IO Layer
+
+The IO layer is a design pattern for subsystems recommended for simulation in AdvantageKit’s log replay framework because it reduces the chance of interacting with hardware that doesn’t exist.
+
+![IO layer diagram](/examples/io-layer.png)
+
+> Data logging of inputs should occur between the control logic and hardware interface - this ensures that any control logic can be replayed in the simulator.
+> We suggest restructuring the subsystem such that hardware interfacing occurs in a separate object (we call this the "IO" layer).
+> The IO layer includes an interface defining all methods used for interacting with the hardware along with one or more implementations that make use of vendor libraries to carry out commands and read data.
+
+## Hub shift tracker
+
+`HubShiftUtil.java` is a utility class to get consistent match times and accurate alliance shift tracking to time the shooting to start just before the alliance shift starts and stop just before it ends based on the ball's time of flight.
+This is important to reduce wasted effort and the amount of uncounted balls in inactive periods.
+
+![Hub shift tracker](/examples/hub-shift-tracker.png)
+
+## SOTM with drum shooter
+
+Mechanical Advantage developed shoot on the move on their turreted Alpha Bot.
+After transitioning to a drum shooter, they were able to adapt their shoot on the move code by applying the turret angles to the drivebase and limiting the angular velocity of the drivebase to account for its relatively sluggish movement due to the weight it has to carry.
+
+## Hood anti-decapitation trench bounds
+
+TrenchBounds.java facilitates anti-decapitation for the shooter hood by checking if the hood translation is within any of the four trench bounds. The Bounds utility record class takes two X and two Y coordinates and has a contains method that returns whether a Translation2d is within the Bounds.
+
+{/* rli:ignore */}
+```java
+public static BooleanSupplier contains(Supplier<Translation2d> translation) {
+    return () ->
+        blueLeftTrench.contains(translation.get())
+            || blueRightTrench.contains(translation.get())
+            || redLeftTrench.contains(translation.get())
+            || redRightTrench.contains(translation.get());
+}
+```
+
+## Energy Management
+
+* `BatteryEstimator.java` uses a single RC Thevenin model with Peukert correction.
+The SOC (state-of-charge) is determined from open-loop coulomb counting, which is then used to determine OCV, R0, and RP.
+VP (polarization voltage) is determined using RC model and corrected from battery terminal voltage measurements using Kalman gain.
+The model structure is based on [this paper](https://doi.org/10.1016/j.ifacol.2022.06.031).
+Battery parameters are for MK Powered battery based on [this post](https://www.chiefdelphi.com/t/detailed-frc-battery-comparison-for-2026/508077/22) fitted using data from logs.
+* `BatteryLogger.java` logs current, power, and energy usage.
+* `BreakerModel.java` is a thermal model of the main breaker using Miner's-rule damage accumulation.
+Niceness (0–1) scales down the effective trip threshold so the model starts throttling before the actual trip point, providing headroom.
+* `CurrentLimits.java` defines current limits for subsystems.
+* `FinanceDepartment.java` calculates battery budgets and orchestrates `BatteryEstimator`, `BatterLogger`, `BreakerModel`, and `CurrentLimits` objects.
+
+## A variety of Gradle plugins
+
+[Gversion](https://plugins.gradle.org/plugin/com.peterabeles.gversion) auto-generates a version class file using Git and Gradle and outputs metadata that can be logged with AdvantageKit.
+
+[Spotless](https://plugins.gradle.org/plugin/com.diffplug.spotless) is a code formatter that helps ensure that the style of code written is consistent throughout the entire codebase.
+
+[Project Lombok](https://projectlombok.org/) is a library for code generation that relies on annotations.

src/content/docs/examples/index.mdx

@@ -0,0 +1,70 @@
+---
+title: Examples
+description: A programming reference featuring FRC robot code repositories, best practices, and innovative approaches
+---
+
+export const examples = [
+  {
+    title: '6328 2026 Code',
+    href: '/examples/6328-2026-code/',
+    image: '/examples/6328-2026-robot.png',
+    imageAlt: '6328 2026 robot render',
+    category: '',
+    description: 'IO layer, hub shift tracker, sotm with drum shooter, hood anti-decapitation trench bounds, battery state estimator, and a variety of Gradle plugins',
+  },
+  {
+    title: "1678's 2026 Code",
+    href: '/examples/1678-2026-code/',
+    image: '/examples/1678-2026-robot.png',
+    imageAlt: '1678 2026 robot render',
+    category: '',
+    description: 'Team library, custom targeting system, and customer power analyzer',
+  },
+  {
+    title: '2910 2026 Code',
+    href: '/examples/581-2026-code/',
+    image: '/examples/581-2026-robot.png',
+    imageAlt: '581 2026 robot render',
+    category: 'Best Practices',
+    description: 'Advanced software practices, automation, and team programming documentation',
+  },
+];
+
+<section class="examples-hero">
+  <div class="examples-hero-copy">
+    <p class="examples-eyebrow">Repository examples</p>
+    <blockquote>
+      <p>Steal from the best, invent the rest.</p>
+      <cite>-Mike Corsetto, Team 1678</cite>
+    </blockquote>
+    <p class="hero-copy">
+      Don't be afraid to take inspiration from robot code that already solved hard programming problems.
+      This library collects code analysis and repositories so teams can study real examples, compare approaches, and build better code faster.
+    </p>
+  </div>
+</section>
+
+<section class="mechanism-section">
+  <div class="section-heading">
+    <p class="mechanism-eyebrow">Code analysis</p>
+    <h2>In-depth Examples</h2>
+    <p>These examples go beyond the source code and explain why the code was designed the way it was.</p>
+  </div>
+
+  <div class="featured-grid">
+    {examples.map((example) => (
+      <article class="featured-card">
+        {example.image && (
+          <div class="featured-image">
+            <img src={example.image} alt={example.imageAlt} loading="lazy" />
+          </div>
+        )}
+        <div class="featured-body">
+          <p class="category-label">{example.category}</p>
+          <h3><a href={example.href} class="featured-card-link">{example.title}</a></h3>
+          <p>{example.description}</p>
+        </div>
+      </article>
+    ))}
+  </div>
+</section>

src/plugins/remark-image-attributes.ts

@@ -79,12 +79,12 @@ export function remarkImageAttributes() {
                         node.data.hProperties = node.data.hProperties || {};
                         node.data.hProperties.class = `img-wrapper img-align-${align}`;
                     } else if (children.length === 1) {
-                        // Standalone image without attributes - still wrap and center
+                        // Standalone image without attributes - still wrap and left-align
                         node.data = node.data || {};
                         node.data.hName = 'div';
                         node.data.hProperties = node.data.hProperties || {};
                         node.data.hProperties.class =
-                            'img-wrapper img-align-center';
+                            'img-wrapper img-align-left';
                     }
                 }
             }

src/starlightOverrides/Header.astro

@@ -12,6 +12,7 @@ const navLinks = [
     { href: '/', label: 'Home' },
     { href: '/learning-course/', label: 'Learning Course' },
     { href: '/educators-guide/introduction/', label: "Educator's Guide" },
+    { href: '/examples/', label: 'Examples' },
     { href: '/best-practices/overview', label: 'Best Practices' },
     { href: '/resources/docs', label: 'Other Resources' }, // TODO: update to '/resources/overview' after merging pr #104
     { href: '/contribution/', label: 'Contribution' },