From 05600588bb033c70a9c1af2f0a1f2d087e08c5cb Mon Sep 17 00:00:00 2001
From: Carolina Capetillo <carolinacapetilloc@gmail.com>
Date: Mon, 1 Jul 2024 11:03:42 -0700
Subject: [PATCH 1/2] changed a of rgba, changed width of bar, and moved
 z-index of weather to be on top of moon

---
 src/components/calendar/TheCalendar.vue | 9 +++++----
 src/utils/calendar_utils.js             | 2 +-
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/components/calendar/TheCalendar.vue b/src/components/calendar/TheCalendar.vue
index 51df3a97..d755a5a1 100644
--- a/src/components/calendar/TheCalendar.vue
+++ b/src/components/calendar/TheCalendar.vue
@@ -1096,7 +1096,7 @@ export default {
           start: new Date(moon.rise),
           end: new Date(moon.set),
           rendering: 'background',
-          backgroundColor: rgba_from_illumination(moon.illumination, 235),
+          backgroundColor: rgba_from_illumination(moon.illumination, 255),
           borderColor: '#aaaaaa',
           id: 'fc-custom-moon-indicator',
           classNames: ['fc-moon-indicator'],
@@ -1218,7 +1218,7 @@ export default {
 @import "@/style/buefy-styles.scss";
 @import "@/style/_variables.scss";
 
-$moon-width: 16px;
+$moon-width: 20px;
 
 $event-left-margin: 4px;
 
@@ -1226,7 +1226,7 @@ $moon-info-z-index: 20; // this should be above all other events
 $now-indicator-z-index: 19;
 $moon-icon-z-index: 18;
 $forecast-z-index: 16; // this should be above the moon
-$moon-z-index: 15;
+$moon-z-index: 0;
 $observing-start-end-z-index: 15;
 $sky-darkness-z-index: 15;
 
@@ -1380,6 +1380,7 @@ These times are obtained from the events in the site config */
 .fc-moon-indicator {
   z-index: $moon-z-index;
   width: $moon-width;
+  opacity: 0.4;
   transition: 0.2s;
 }
 .fc-moon-indicator:hover {
@@ -1391,7 +1392,7 @@ These times are obtained from the events in the site config */
 .fc-forecast-event {
   $background-opacity: 0;
   $border-width: $forecast-width;
-  // z-index: $forecast-z-index !important;
+  z-index: $forecast-z-index !important;
   opacity: 1;
   background-color: rgba(0,0,0,0);
   width: 0;
diff --git a/src/utils/calendar_utils.js b/src/utils/calendar_utils.js
index c957082b..1903db58 100644
--- a/src/utils/calendar_utils.js
+++ b/src/utils/calendar_utils.js
@@ -151,7 +151,7 @@ const getMoonPhaseDays = (year, month, day) => {
  * @returns {string}: css value, something like 'rgba(255,255,255,0.5)'
  */
 const rgba_from_illumination = (illum, peak) => {
-  const alpha = 0.1 + (0.9 * illum) // should have minimum opacity of 0.1
+  const alpha = 0.1 + (0.9 * illum) + 1
   return `rgba(${peak},${peak},${peak},${alpha})`
 }
 

From 27aa3c1d694caf4fc1deee9a00adacb04a6fb2f9 Mon Sep 17 00:00:00 2001
From: Carolina Capetillo <carolinacapetilloc@gmail.com>
Date: Mon, 1 Jul 2024 11:08:55 -0700
Subject: [PATCH 2/2] reversed moon z index

---
 src/components/calendar/TheCalendar.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/calendar/TheCalendar.vue b/src/components/calendar/TheCalendar.vue
index d755a5a1..62873aff 100644
--- a/src/components/calendar/TheCalendar.vue
+++ b/src/components/calendar/TheCalendar.vue
@@ -1226,7 +1226,7 @@ $moon-info-z-index: 20; // this should be above all other events
 $now-indicator-z-index: 19;
 $moon-icon-z-index: 18;
 $forecast-z-index: 16; // this should be above the moon
-$moon-z-index: 0;
+$moon-z-index: 15;
 $observing-start-end-z-index: 15;
 $sky-darkness-z-index: 15;