Feature/code adventure page

docs/code-adventure/index.md

@@ -0,0 +1,86 @@
+---
+description: A story-based series of Programming Puzzles inspired by Advent of Code
+---
+
+#
+
+[![Practical Python Code Adventure](/static/code-adventure/MAINlight.png#only-light)](#adventures)
+[![Practical Python Code Adventure](/static/code-adventure/MAINdark.png#only-dark)](#adventures)
+
+Practical Python Code Adventure is a series of programming puzzles inspired by Eric Wastl's *Advent of Code*.
+
+Each year features __10 story-driven puzzles__ designed to teach programming concepts, popular algorithms,
+and real topics from mathematics and science. Every puzzle has two parts, with the second building on the first
+to provide an extra challenge. As you progress, the story unfolds alongside the puzzles, adding another layer
+of mystery and satisfaction to each solution.
+
+The puzzles are __free for everyone to enjoy__. Signing in with Discord is optional and lets you save your
+progress, but you are also welcome to play as a guest. For the best experience, we recommend completing the
+puzzles in order so the story develops naturally, though you're free to tackle them in any order or skip a
+puzzle if it proves too challenging.
+
+Do you love solving puzzles and learning something new? __Join us on a Code Adventure!__
+
+
+## :octicons-trophy-24:{ .md .middle } Adventures
+
+<div class="grid cards adventure" markdown>
+
+-   :material-rocket-launch:{ .lg .middle } &nbsp; __2025__
+
+    ---
+
+    [![2025 Challenges](/static/code-adventure/2025.png)](https://adventure.practicalpython.org/2025)
+
+    Begin your adventure on board the STS Solara with Captain Xarlos and his crew, embarking
+    on a space adventure to save the universe from a mysterious threat.
+
+
+-   :material-bone:{ .lg .middle } &nbsp; __2026__
+
+    ---
+
+    [![2026 Challenges](/static/code-adventure/2026.png)](https://adventure.practicalpython.org/2026)
+
+    Continue where you left off, finding yourself in a strange place and time, separated from
+    your captain and the crew. Will you be able to find them, and what dangers await?
+
+
+-   :material-help-circle:{ .lg .middle } &nbsp; __2027 (Coming Next Summer)__
+
+    ---
+
+    ![2027 Challenges](/static/code-adventure/2027BLUR.png) <!-- (https://adventure.practicalpython.org/2027) -->
+
+
+</div>
+
+
+!!! tip ""
+
+    ## :material-campfire:{ .lg .middle } Around the campfire :material-campfire:{ .lg .middle .flip }
+
+    *Shedding some <span class="highlight">light</span> on the __people__ and __work__ behind the adventure*
+
+    ---
+
+    [:material-heart-outline:{ .lg .middle } __Gratitude__](https://adventure.practicalpython.org/gratitude)
+
+    :   Practical Python Code Adventure wouldn't be what it is without the help of a great community.
+        Several people have contributed their time and expertise by helping with hosting, beta testing,
+        UX testing, and advice. __They deserve recognition, so you'll find them listed here__!
+
+    [:material-star-shooting-outline:{ .lg .middle } __Sponsors__](https://adventure.practicalpython.org/sponsor)
+
+    :   Enjoying the puzzles and want to help keep the adventure going? There are two patron tiers,
+        __starting at $5__. These puzzles take all year to build, and we want to keep them free for
+        everyone. If you can, __your support means a lot and is genuinely appreciated__.
+
+    :   __See who's already helped support the adventure__, or find out how you can become a sponsor yourself.
+
+    :   __Corporate sponsorship opportunities are also available__.
+
+    [:simple-github:{ .lg .middle } __Github__](https://github.com/JefeThePug/Practical-Python-Code-Adventure)
+
+    :   Curious about how the adventure was made? __Check out the project on GitHub__.
+        If you like what you see, feel free to give it a :material-star:{ .lg .bottom }.

docs/stylesheets/extra.css

@@ -41,6 +41,42 @@
   margin: 0.3rem 0.2rem 0;
 }
 
+.flip svg {
+  transform: scaleX(-1);
+}
+
+.highlight {
+  color: var(--md-accent-fg-color);
+  font-weight: 700;
+}
+
+.adventure img {
+  transition: transform 0.15s ease;
+  border-radius: 0.5rem;
+}
+
+.adventure img:hover {
+  animation: magic-pulse 1.3s infinite;
+  transform: scale(1.02);
+}
+
+@keyframes magic-pulse {
+  0%,
+  100% {
+    box-shadow:
+      0 0 0 rgba(94, 139, 222, 0),
+      0 0 8px rgba(94, 139, 222, 0.35),
+      0 0 18px rgba(94, 139, 222, 0.2);
+  }
+
+  50% {
+    box-shadow:
+      0 0 12px rgba(94, 139, 222, 0.9),
+      0 0 30px rgba(94, 139, 222, 0.7),
+      0 0 60px rgba(94, 139, 222, 0.5);
+  }
+}
+
 @media screen and (max-width: 44.98em) {
   .pp-hero {
     padding: 1.6rem 0 1.2rem;

zensical.toml

@@ -44,6 +44,9 @@ nav = [
     "rules/moderation.md",
     "rules/channels.md",
   ] },
+  { "Code Adventure" = [
+    "code-adventure/index.md",
+  ] },
 ]
 
 [project.theme]