fix: Ideally actually fix the timestamp issue now

Author: UltrusBot

src/pages/events/mod-garden/nature.astro

@@ -134,39 +134,44 @@ const showcaseEnd = "2025-10-10T00:00:00Z";
           <ol class="relative border-s border-leaf-600 dark:border-leaf-200">
             <li class="mb-[19.5%] ms-4">
               <div class="absolute w-3 h-3 bg-pine-500 rounded-full mt-1.5 -start-1.5 dark:bg-pine-700"></div>
-              <time datetime={isoTime(planningStart)} data-start-time={planningStart} class="mb-1 text-sm font-normal leading-none italic">{formatTime(planningStart)} - {formatTime(planningEnd)}</time>
+              <time datetime={isoTime(planningStart)} data-start-time={planningStart}  data-end-time={planningEnd}
+                    class="mb-1 text-sm font-normal leading-none italic">{formatTime(planningStart)} - {formatTime(planningEnd)}</time>
               <h3 class="text-lg font-semibold text-gray-900 dark:text-white">Planning Stage</h3>
               <p class="text-base font-normal">
                 Here you can sign up, and start planning your project. This is the time to start forming teams, planning ideas and general brainstorming.
               </p>
             </li>
             <li class="mb-[19.5%] ms-4">
               <div class="absolute w-3 h-3 bg-pine-500 rounded-full mt-1.5 -start-1.5 dark:bg-pine-700"></div>
-              <time datetime={isoTime(developmentStart)} data-start-time={developmentStart} class="mb-1 text-sm font-normal leading-none italic">{formatTime(developmentStart)} - {formatTime(tweakStart)}</time>
+              <time datetime={isoTime(developmentStart)} data-start-time={developmentStart} data-end-time={tweakStart}
+                    class="mb-1 text-sm font-normal leading-none italic">{formatTime(developmentStart)} - {formatTime(tweakStart)}</time>
               <h3 class="text-lg font-semibold text-gray-900 dark:text-white">Development Stage</h3>
               <p class="text-base font-normal">
                 This is when you start working on your project(s). You should be submitted to Modrinth by the end of this stage.
               </p>
             </li>
             <li class="mb-[19.5%] ms-4">
               <div class="absolute w-3 h-3 bg-pine-500 rounded-full mt-1.5 -start-1.5 dark:bg-pine-700"></div>
-              <time datetime={isoTime(tweakStart)} data-start-time={tweakStart} class="mb-1 text-sm font-normal leading-none italic">{formatTime(tweakStart)} - {formatTime(buildStart)}</time>
+              <time datetime={isoTime(tweakStart)} data-start-time={tweakStart} data-end-time={buildStart}
+                    class="mb-1 text-sm font-normal leading-none italic">{formatTime(tweakStart)} - {formatTime(buildStart)}</time>
               <h3 class="text-lg font-semibold text-gray-900 dark:text-white">Tweak Stage</h3>
               <p class="text-base font-normal">
                 This period is all about fixing bugs, and integrating with other mods to have cross compatibility. Extensions will last until the end of the first week of this phase.
               </p>
             </li>
             <li class="mb-[19.5%] ms-4">
               <div class="absolute w-3 h-3 bg-pine-500 rounded-full mt-1.5 -start-1.5 dark:bg-pine-700"></div>
-              <time datetime={isoTime(buildStart)} data-start-time={buildStart} class="mb-1 text-sm font-normal leading-none italic">{formatTime(buildStart)} - {formatTime(buildEnd)}</time>
+              <time datetime={isoTime(buildStart)} data-start-time={buildStart} data-end-time={buildEnd}
+                    class="mb-1 text-sm font-normal leading-none italic">{formatTime(buildStart)} - {formatTime(buildEnd)}</time>
               <h3 class="text-lg font-semibold text-gray-900 dark:text-white">Building Stage</h3>
               <p class="text-base font-normal">
                 This stage is optional, but if you want to build a booth for your project, this is the time to do it.
               </p>
             </li>
             <li class="ms-4">
               <div class="absolute w-3 h-3 bg-pine-500 rounded-full mt-1.5 -start-1.5 dark:bg-pine-700"></div>
-              <time datetime={isoTime(showcaseStart)} data-start-time={showcaseStart} class="mb-1 text-sm font-normal leading-none italic">{formatTime(showcaseStart)} - {formatTime(showcaseEnd)}</time>
+              <time datetime={isoTime(showcaseStart)} data-start-time={showcaseStart} data-end-time={showcaseEnd}
+                    class="mb-1 text-sm font-normal leading-none italic">{formatTime(showcaseStart)} - {formatTime(showcaseEnd)}</time>
               <h3 class="text-lg font-semibold text-gray-900 dark:text-white">Showcase Stage</h3>
               <p class="text-base font-normal">
                 This is when the event server is up and running, where you and players can visit booths for all the projects. Players may vote for mods and awards are given in this stage. The server will still be up for some time after this phase ends.
@@ -228,7 +233,8 @@ const showcaseEnd = "2025-10-10T00:00:00Z";
   let timelineEntries = Array.from(document.querySelectorAll("[data-start-time]"));
   timelineEntries.forEach((entry) => {
     const startTime = entry.getAttribute("data-start-time");
-    entry.setAttribute("datetime", Moment(startTime).toISOString());
+    const endTime = entry.getAttribute("data-end-time");
+    entry.textContent = `${Moment(startTime).format("MM/D/YYYY h:mm A") } - ${Moment(endTime).format("MM/D/YYYY h:mm A")}`;
   });
 
 </script>