From def36878937068482193498715a96b7d3e42f3fe Mon Sep 17 00:00:00 2001
From: Jake Howard <git@theorangeone.net>
Date: Wed, 8 Feb 2023 19:51:22 +0000
Subject: [PATCH 01/12] Add "add to calendar button" to events page

---
 _includes/script.html |  2 ++
 _sass/common.scss     | 10 +++++++++-
 events.html           | 12 +++++++++++-
 3 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/_includes/script.html b/_includes/script.html
index 1de6833c..c79a65d8 100644
--- a/_includes/script.html
+++ b/_includes/script.html
@@ -1,6 +1,8 @@
 <script src="{{ '/js/main.js' | prepend: site.baseurl }}"></script>
 <script src="{{ '/js/localise-times.js' | prepend: site.baseurl }}"></script>
 
+<script src="https://cdn.jsdelivr.net/npm/add-to-calendar-button@2.1.1/dist/atcb.min.js"></script>
+
 {% if site.user_tracking %}
   <script defer data-domain="studentrobotics.org" src="https://plausible.io/js/plausible.js"></script>
 {% endif %}
diff --git a/_sass/common.scss b/_sass/common.scss
index 17dab1b4..82f77cf7 100644
--- a/_sass/common.scss
+++ b/_sass/common.scss
@@ -10,7 +10,7 @@
 
   margin: 0 auto;
   padding: 0;
-  overflow: hidden;
+  // overflow: hidden;
 }
 
 .sidebar, main {
@@ -34,6 +34,14 @@
     color: $sr-white;
     margin-bottom: 0;
   }
+
+  &.calendar-button .fixed-width {
+    display: flex;
+    justify-content: space-between;
+    overflow: initial;
+    align-items: center;
+
+  }
 }
 
 .top-spacing {
diff --git a/events.html b/events.html
index 62dd3094..3a847368 100644
--- a/events.html
+++ b/events.html
@@ -3,9 +3,19 @@
 title: Events
 permalink: /events/
 ---
-<div class="header-card">
+<div class="header-card calendar-button">
   <div class="fixed-width">
     <h1>Events</h1>
+    <add-to-calendar-button
+      name="{{ site.title }}"
+      startDate="1970-01-01"
+      subscribe
+      icsFile="https://studentrobotics.org/events.ics"
+      iCalFileName="{{ site.title }}"
+      options="'Apple','Google','iCal','Outlook.com','Microsoft 365','Microsoft Teams'"
+      lightMode="system"
+      size="4|4|2"
+    />
   </div>
 </div>
 <div class="main">

From f8cefa58c716365d788b27c558ab98ccea96d21b Mon Sep 17 00:00:00 2001
From: Jake Howard <git@theorangeone.net>
Date: Wed, 8 Feb 2023 20:05:58 +0000
Subject: [PATCH 02/12] Add calendar button to event page

---
 _includes/calendar-button.html | 12 ++++++++++++
 _layouts/event.html            |  3 ++-
 events.html                    | 11 +----------
 3 files changed, 15 insertions(+), 11 deletions(-)
 create mode 100644 _includes/calendar-button.html

diff --git a/_includes/calendar-button.html b/_includes/calendar-button.html
new file mode 100644
index 00000000..5c763dee
--- /dev/null
+++ b/_includes/calendar-button.html
@@ -0,0 +1,12 @@
+<add-to-calendar-button
+  name="{{ site.title }}"
+  {% comment %}startDate is required{% endcomment %}
+  startDate="1970-01-01"
+  subscribe
+  icsFile="https://studentrobotics.org/events.ics"
+  iCalFileName="{{ site.title }}"
+  options="'Apple','Google','iCal','Outlook.com','Microsoft 365','Microsoft Teams'"
+  lightMode="system"
+  size="4|4|2"
+  buttonStyle="flat"
+/>
diff --git a/_layouts/event.html b/_layouts/event.html
index ff174e70..e9ee4180 100644
--- a/_layouts/event.html
+++ b/_layouts/event.html
@@ -1,9 +1,10 @@
 ---
 layout: page
 ---
-<div class="header-card">
+<div class="header-card calendar-button">
   <div class="fixed-width">
     <h1>{{ page.title }}</h1>
+    {% include calendar-button.html %}
   </div>
 </div>
 <div class="main">
diff --git a/events.html b/events.html
index 3a847368..888aec8d 100644
--- a/events.html
+++ b/events.html
@@ -6,16 +6,7 @@
 <div class="header-card calendar-button">
   <div class="fixed-width">
     <h1>Events</h1>
-    <add-to-calendar-button
-      name="{{ site.title }}"
-      startDate="1970-01-01"
-      subscribe
-      icsFile="https://studentrobotics.org/events.ics"
-      iCalFileName="{{ site.title }}"
-      options="'Apple','Google','iCal','Outlook.com','Microsoft 365','Microsoft Teams'"
-      lightMode="system"
-      size="4|4|2"
-    />
+    {% include calendar-button.html %}
   </div>
 </div>
 <div class="main">

From 4443336f14663ccd45d480f5add0ddb1fd27f455 Mon Sep 17 00:00:00 2001
From: Jake Howard <git@theorangeone.net>
Date: Wed, 8 Feb 2023 20:09:45 +0000
Subject: [PATCH 03/12] Un-comment code from debugging

---
 _sass/common.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/_sass/common.scss b/_sass/common.scss
index 82f77cf7..14e51e94 100644
--- a/_sass/common.scss
+++ b/_sass/common.scss
@@ -10,7 +10,7 @@
 
   margin: 0 auto;
   padding: 0;
-  // overflow: hidden;
+  overflow: hidden;
 }
 
 .sidebar, main {

From 9fe1ec6a328149cab4bb1cd43ba001c8e41698eb Mon Sep 17 00:00:00 2001
From: Jake Howard <git@theorangeone.net>
Date: Wed, 8 Feb 2023 21:54:01 +0000
Subject: [PATCH 04/12] Rename calendar class

---
 _layouts/event.html | 2 +-
 _sass/common.scss   | 2 +-
 events.html         | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/_layouts/event.html b/_layouts/event.html
index e9ee4180..06bfd58e 100644
--- a/_layouts/event.html
+++ b/_layouts/event.html
@@ -1,7 +1,7 @@
 ---
 layout: page
 ---
-<div class="header-card calendar-button">
+<div class="header-card with-calendar-button">
   <div class="fixed-width">
     <h1>{{ page.title }}</h1>
     {% include calendar-button.html %}
diff --git a/_sass/common.scss b/_sass/common.scss
index 14e51e94..1749db37 100644
--- a/_sass/common.scss
+++ b/_sass/common.scss
@@ -35,7 +35,7 @@
     margin-bottom: 0;
   }
 
-  &.calendar-button .fixed-width {
+  &.with-calendar-button .fixed-width {
     display: flex;
     justify-content: space-between;
     overflow: initial;
diff --git a/events.html b/events.html
index 888aec8d..ded71439 100644
--- a/events.html
+++ b/events.html
@@ -3,7 +3,7 @@
 title: Events
 permalink: /events/
 ---
-<div class="header-card calendar-button">
+<div class="header-card with-calendar-button">
   <div class="fixed-width">
     <h1>Events</h1>
     {% include calendar-button.html %}

From 0d443f86d3dc5fb46b64aca0a72b8937d2c80f2b Mon Sep 17 00:00:00 2001
From: Jake Howard <git@theorangeone.net>
Date: Wed, 8 Feb 2023 21:55:34 +0000
Subject: [PATCH 05/12] Always use light mode

This matches the rest of the site's styling
---
 _includes/calendar-button.html | 1 -
 1 file changed, 1 deletion(-)

diff --git a/_includes/calendar-button.html b/_includes/calendar-button.html
index 5c763dee..f2da87ac 100644
--- a/_includes/calendar-button.html
+++ b/_includes/calendar-button.html
@@ -6,7 +6,6 @@
   icsFile="https://studentrobotics.org/events.ics"
   iCalFileName="{{ site.title }}"
   options="'Apple','Google','iCal','Outlook.com','Microsoft 365','Microsoft Teams'"
-  lightMode="system"
   size="4|4|2"
   buttonStyle="flat"
 />

From a5e3eff930a0c011f44909bbfe8577e93f76bf34 Mon Sep 17 00:00:00 2001
From: Jake Howard <git@theorangeone.net>
Date: Wed, 8 Feb 2023 21:56:12 +0000
Subject: [PATCH 06/12] Don't blur background when opening calendar widget

---
 _includes/calendar-button.html | 1 +
 1 file changed, 1 insertion(+)

diff --git a/_includes/calendar-button.html b/_includes/calendar-button.html
index f2da87ac..277bd46e 100644
--- a/_includes/calendar-button.html
+++ b/_includes/calendar-button.html
@@ -8,4 +8,5 @@
   options="'Apple','Google','iCal','Outlook.com','Microsoft 365','Microsoft Teams'"
   size="4|4|2"
   buttonStyle="flat"
+  hideBackground
 />

From 15925ecc7299102c20cd68b4efba1b53031836b8 Mon Sep 17 00:00:00 2001
From: Jake Howard <git@theorangeone.net>
Date: Wed, 8 Feb 2023 23:08:19 +0000
Subject: [PATCH 07/12] Trigger button on click

This works better
---
 _includes/calendar-button.html | 1 +
 1 file changed, 1 insertion(+)

diff --git a/_includes/calendar-button.html b/_includes/calendar-button.html
index 277bd46e..3fdbeaf1 100644
--- a/_includes/calendar-button.html
+++ b/_includes/calendar-button.html
@@ -8,5 +8,6 @@
   options="'Apple','Google','iCal','Outlook.com','Microsoft 365','Microsoft Teams'"
   size="4|4|2"
   buttonStyle="flat"
+  trigger="click"
   hideBackground
 />

From 7d8f126714d0a1d3e7e40dbbe0e40343f74559d9 Mon Sep 17 00:00:00 2001
From: Jake Howard <git@theorangeone.net>
Date: Wed, 8 Feb 2023 23:17:34 +0000
Subject: [PATCH 08/12] Style the button to be more in keeping with our style

It's not perfect, but it's a lot better
---
 _includes/calendar-button.html | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/_includes/calendar-button.html b/_includes/calendar-button.html
index 3fdbeaf1..e6685019 100644
--- a/_includes/calendar-button.html
+++ b/_includes/calendar-button.html
@@ -10,4 +10,6 @@
   buttonStyle="flat"
   trigger="click"
   hideBackground
+  styleLight="--btn-shadow: none; --btn-border: none; --font: 'Open Sans', Arial, sans-serif"
+  lightMode="light"
 />

From 25f52761384596954c09b08cdcc9c26d51ae5d70 Mon Sep 17 00:00:00 2001
From: Jake Howard <git@theorangeone.net>
Date: Sat, 11 Feb 2023 16:50:52 +0000
Subject: [PATCH 09/12] Move calendar button into events sidebar

---
 _includes/calendar-button.html | 5 +++--
 _layouts/event.html            | 5 ++++-
 _sass/events.scss              | 7 +++++++
 events.html                    | 2 +-
 4 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/_includes/calendar-button.html b/_includes/calendar-button.html
index e6685019..eb04343a 100644
--- a/_includes/calendar-button.html
+++ b/_includes/calendar-button.html
@@ -7,9 +7,10 @@
   iCalFileName="{{ site.title }}"
   options="'Apple','Google','iCal','Outlook.com','Microsoft 365','Microsoft Teams'"
   size="4|4|2"
-  buttonStyle="flat"
+  buttonStyle="{{ include.button_style }}"
   trigger="click"
   hideBackground
-  styleLight="--btn-shadow: none; --btn-border: none; --font: 'Open Sans', Arial, sans-serif"
+  styleLight="--btn-shadow: none; --btn-border: none; --font: 'Open Sans', Arial, sans-serif; --overlay-cursor: initial; --btn-underline: transparent"
   lightMode="light"
+  hideIconButton
 />
diff --git a/_layouts/event.html b/_layouts/event.html
index 06bfd58e..cb835f75 100644
--- a/_layouts/event.html
+++ b/_layouts/event.html
@@ -4,7 +4,6 @@
 <div class="header-card with-calendar-button">
   <div class="fixed-width">
     <h1>{{ page.title }}</h1>
-    {% include calendar-button.html %}
   </div>
 </div>
 <div class="main">
@@ -20,6 +19,10 @@ <h1>{{ page.title }}</h1>
             {% assign date_only_format = '%e %B %Y <small class="muted">(time <abbr title="To be confirmed">TBC</abbr>)</small>' %}
             {% include datetime.html date_only_format=date_only_format datetime_format='%e %B %Y at %l%P' time_only_format = '%l%P' event=page %}
           </li>
+          <li class="with-add-to-calendar-button">
+            <i class="fa-solid fa-calendar" aria-hidden="true"></i>
+            {% include calendar-button.html button_style="text" %}
+          </li>
           <li><i class="fa-solid fa-fw fa-location-dot" aria-hidden="true"></i> {{ page.location }}</li>
         </ul>
       </div>
diff --git a/_sass/events.scss b/_sass/events.scss
index b70aad33..22b702f9 100644
--- a/_sass/events.scss
+++ b/_sass/events.scss
@@ -77,3 +77,10 @@ ul.event-listing {
 .event-date time {
   white-space: nowrap;
 }
+
+.detail-list li.with-add-to-calendar-button {
+  padding-top: 0.25em;
+  padding-bottom: 0.25em;
+  display: flex;
+  align-items: center;
+}
diff --git a/events.html b/events.html
index ded71439..6bbcdb1b 100644
--- a/events.html
+++ b/events.html
@@ -6,7 +6,7 @@
 <div class="header-card with-calendar-button">
   <div class="fixed-width">
     <h1>Events</h1>
-    {% include calendar-button.html %}
+    {% include calendar-button.html button_style="flat" %}
   </div>
 </div>
 <div class="main">

From 293561261ef452d64724a7574d069fc03071a33a Mon Sep 17 00:00:00 2001
From: Jake Howard <git@theorangeone.net>
Date: Sat, 11 Feb 2023 16:51:28 +0000
Subject: [PATCH 10/12] Hide checkmark once added to calendar

---
 _includes/calendar-button.html | 1 +
 1 file changed, 1 insertion(+)

diff --git a/_includes/calendar-button.html b/_includes/calendar-button.html
index eb04343a..01f87f3b 100644
--- a/_includes/calendar-button.html
+++ b/_includes/calendar-button.html
@@ -13,4 +13,5 @@
   styleLight="--btn-shadow: none; --btn-border: none; --font: 'Open Sans', Arial, sans-serif; --overlay-cursor: initial; --btn-underline: transparent"
   lightMode="light"
   hideIconButton
+  hideCheckmark
 />

From 355b7ef8d045eb556e500277bfeb27eaabc0cbdf Mon Sep 17 00:00:00 2001
From: Jake Howard <git@theorangeone.net>
Date: Sat, 11 Feb 2023 16:53:56 +0000
Subject: [PATCH 11/12] Remove list border

---
 _includes/calendar-button.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/_includes/calendar-button.html b/_includes/calendar-button.html
index 01f87f3b..48d0e130 100644
--- a/_includes/calendar-button.html
+++ b/_includes/calendar-button.html
@@ -10,7 +10,7 @@
   buttonStyle="{{ include.button_style }}"
   trigger="click"
   hideBackground
-  styleLight="--btn-shadow: none; --btn-border: none; --font: 'Open Sans', Arial, sans-serif; --overlay-cursor: initial; --btn-underline: transparent"
+  styleLight="--btn-shadow: none; --btn-border: none; --list-border: none; --font: 'Open Sans', Arial, sans-serif; --overlay-cursor: initial; --btn-underline: transparent"
   lightMode="light"
   hideIconButton
   hideCheckmark

From 31748e1bacf931c340f854febc5772cc7a31be18 Mon Sep 17 00:00:00 2001
From: Jake Howard <git@theorangeone.net>
Date: Sat, 11 Feb 2023 17:26:57 +0000
Subject: [PATCH 12/12] Improve styling on calendar button

---
 _includes/calendar-button.html | 6 +++---
 _layouts/event.html            | 2 +-
 events.html                    | 2 +-
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/_includes/calendar-button.html b/_includes/calendar-button.html
index 48d0e130..03793910 100644
--- a/_includes/calendar-button.html
+++ b/_includes/calendar-button.html
@@ -6,11 +6,11 @@
   icsFile="https://studentrobotics.org/events.ics"
   iCalFileName="{{ site.title }}"
   options="'Apple','Google','iCal','Outlook.com','Microsoft 365','Microsoft Teams'"
-  size="4|4|2"
-  buttonStyle="{{ include.button_style }}"
+  size="{{ include.sizes }}"
+  buttonStyle="text"
   trigger="click"
   hideBackground
-  styleLight="--btn-shadow: none; --btn-border: none; --list-border: none; --font: 'Open Sans', Arial, sans-serif; --overlay-cursor: initial; --btn-underline: transparent"
+  styleLight="--btn-shadow: none; --btn-border: none; --list-border: none; --font: 'Open Sans', Arial, sans-serif; --overlay-cursor: initial; --btn-underline: transparent; --btn-text: {{ include.text_colour }}; --btn-text-hover: {{ include.text_colour }}; --btn-text-shadow: none; --btn-background: transparent"
   lightMode="light"
   hideIconButton
   hideCheckmark
diff --git a/_layouts/event.html b/_layouts/event.html
index cb835f75..34a0e3ea 100644
--- a/_layouts/event.html
+++ b/_layouts/event.html
@@ -21,7 +21,7 @@ <h1>{{ page.title }}</h1>
           </li>
           <li class="with-add-to-calendar-button">
             <i class="fa-solid fa-calendar" aria-hidden="true"></i>
-            {% include calendar-button.html button_style="text" %}
+            {% include calendar-button.html text_colour="black" sizes="5" %}
           </li>
           <li><i class="fa-solid fa-fw fa-location-dot" aria-hidden="true"></i> {{ page.location }}</li>
         </ul>
diff --git a/events.html b/events.html
index 6bbcdb1b..f5e120ee 100644
--- a/events.html
+++ b/events.html
@@ -6,7 +6,7 @@
 <div class="header-card with-calendar-button">
   <div class="fixed-width">
     <h1>Events</h1>
-    {% include calendar-button.html button_style="flat" %}
+    {% include calendar-button.html text_colour="white" sizes="6|6|2" %}
   </div>
 </div>
 <div class="main">