Events: Re-organize templates and significantly improve layouts

Aka, many minor changes I shouldn't've grouped together in a single
commit.

- Add main page events description
- Use date icons every where
- Fill up one-off events list
- Use a media-like layout for one-off events instead
- Use 2-column masonry for one-off events list
- Update schedules for this year
- Add a colored top border line to cards in the main gallery that do not
  have thumbnail banners
- Add april fools to fill the gap in the second row so the grid looks
  better
- Re-purpose 'all events' sidebar as 'ToC' with appropriate anchor links
- Use circle-info icon everywhere for learn more buttons
- Added python release streams to the one-off events

That light blue cloud icon for devops hour looks dope IMO :P

- And of course, thanks to the layout change for one-off events list I
  do not have to hurriedly create ad-hoc thumbnails for them 😔. phew
- Which means our fancy hats workshop can use the beautiful magician hat
  emoji as the icon!

- Renamed 'scheduled' and 'recent' events to be year-independent. This
  makes it consistent because we might end up updating the list
  mid-year. This means all dates will have the year specified.

The pain of updating the gallery sections' height for both main and
one-off events section continues to be a limitation.

3 files changed, 14 insertions, 17 deletions

diff --git a/pydis_site/templates/events/sidebar/adventofcode/useful-links.html b/pydis_site/templates/events/sidebar/adventofcode/useful-links.html
index 8b0b3c6f..11dafcb8 100644
--- a/pydis_site/templates/events/sidebar/adventofcode/useful-links.html
+++ b/pydis_site/templates/events/sidebar/adventofcode/useful-links.html
@@ -2,7 +2,7 @@
     <div class="has-text-centered">
         <img src="https://raw.githubusercontent.com/python-discord/branding/main/events/christmas/server_icons/festive_256.gif" style="border-radius: 10px;" alt="Server icon for AoC">
     </div>
-    <p class="menu-label">Advent of Code Links</p>
+    <p class="menu-label">Quick links</p>
     <ul class="menu-list">
         <li><a class="has-text-link" href="https://adventofcode.com">Homepage</a></li>
         <li><a class="has-text-link" href="https://reddit.com/r/adventofcode">Reddit</a></li>
diff --git a/pydis_site/templates/events/sidebar/events_list.html b/pydis_site/templates/events/sidebar/main_sidebar.html
index 3a3bb1dd..4f7272bc 100644
--- a/pydis_site/templates/events/sidebar/events_list.html
+++ b/pydis_site/templates/events/sidebar/main_sidebar.html
@@ -1,5 +1,5 @@
-<div class="box previous-events">
-    <h2 class="title is-5">Previous events from 2023</h2>
+<div class="box" id="previous-events">
+    <h2 class="title is-5">Previous events</h2>
     <article class="media">
         <div class="media-left">
             <p class="image is-32x32">
@@ -9,7 +9,7 @@
         <div class="media-content">
             <div class="content">
                 <h5 class="title is-5"><a href="https://pyweek/35/">PyWeek 35</a></h5>
-                <p class="subtitle is-6">March</p>
+                <p class="subtitle is-6">March 2023</p>
             </div>
         </div>
     </article>
@@ -22,7 +22,7 @@
         <div class="media-content">
             <div class="content">
                 <h5 class="title is-5"><a href="{% url "events:page" path="code-jams/10" %}">Summer Code Jam 2023</a></h5>
-                <p class="subtitle is-6">August</p>
+                <p class="subtitle is-6">August 2023</p>
             </div>
         </div>
     </article>
@@ -35,7 +35,7 @@
         <div class="media-content">
             <div class="content">
                 <h5 class="title is-5"><a href="https://pyweek/36/">PyWeek 36</a></h5>
-                <p class="subtitle is-6">September</p>
+                <p class="subtitle is-6">September 2023</p>
             </div>
         </div>
     </article>
@@ -48,7 +48,7 @@
         <div class="media-content">
             <div class="content">
                 <h5 class="title is-5"><a href="https://adventofcode.com/2023">Advent of Code 2023</a></h5>
-                <p class="subtitle is-6">December</p>
+                <p class="subtitle is-6">December 2023</p>
             </div>
         </div>
     </article>
@@ -56,14 +56,11 @@
 
 <div class="is-hidden-mobile">
     <div class="box">
-        <h4 class="title is-5">All events</h4>
+        <h4 class="title is-5">Table of contents</h4>
         <ul class="menu-list" style="margin-top: 0;">
-            <li><a class="has-text-link" href="{% url "events:page" path="code-jams" %}">Code Jams</a></li>
-            <li><a class="has-text-link" href="{% url "events:page" path="pyweek" %}">PyWeek</a></li>
-            <li><a class="has-text-link" href="{% url "events:page" path="pixels" %}">Pixels</a></li>
-            <li><a class="has-text-link" href="{% url "events:page" path="adventofcode" %}">Advent of Code</a></li>
-            <li><a class="has-text-link" href="{% url "events:page" path="revivalofcode" %}">Revival of Code</a></li>
-            <li><a class="has-text-link" href="{% url "events:page" path="game-jams" %}">Game Jams</a></li>
+            <li><a class="has-text-link" href="#scheduled-events">Scheduled events</a></li>
+            <li><a class="has-text-link" href="#main-events">Annual events</a></li>
+            <li><a class="has-text-link" href="#other-events">Other events</a></li>
         </ul>
     </div>
 </div>
diff --git a/pydis_site/templates/events/sidebar/revivalofcode.html b/pydis_site/templates/events/sidebar/revivalofcode.html
index 8b0b3c6f..6bcf9dbc 100644
--- a/pydis_site/templates/events/sidebar/revivalofcode.html
+++ b/pydis_site/templates/events/sidebar/revivalofcode.html
@@ -2,9 +2,9 @@
     <div class="has-text-centered">
         <img src="https://raw.githubusercontent.com/python-discord/branding/main/events/christmas/server_icons/festive_256.gif" style="border-radius: 10px;" alt="Server icon for AoC">
     </div>
-    <p class="menu-label">Advent of Code Links</p>
+    <p class="menu-label">Quick links</p>
     <ul class="menu-list">
-        <li><a class="has-text-link" href="https://adventofcode.com">Homepage</a></li>
-        <li><a class="has-text-link" href="https://reddit.com/r/adventofcode">Reddit</a></li>
+        <li><a class="has-text-link" href="https://adventofcode.com">AoC Homepage</a></li>
+        <li><a class="has-text-link" href="https://reddit.com/r/adventofcode">AoC Reddit</a></li>
     </ul>
 </div>