1 files changed, 48 insertions, 12 deletions

diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 39a2e40b..d08e6828 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -29,10 +29,15 @@ import settingsSyncTimes from "$stores/settingsSyncTimes";
 import Announcement from "$lib/Announcement.svelte";
 import Message from "$lib/Loading/Message.svelte";
 import { requestNotifications } from "$lib/Utility/notifications";
+import { executiveCopy } from "$lib/Utility/executiveMode";
 import { database as userDatabase } from "$lib/Database/IDB/user";
 import CommandPalette from "$lib/CommandPalette/CommandPalette.svelte";
 import { defaultActions } from "$lib/CommandPalette/actions";
 import { toolsAsCommandPaletteActions } from "$lib/Tools/tools";
+import aprilFools, {
+	aprilFoolsVisible,
+	hydrateAprilFools,
+} from "$stores/aprilFools";
 import localforage from "localforage";
 import { dev } from "$app/environment";
 import { injectAnalytics } from "@vercel/analytics/sveltekit";
@@ -90,6 +95,8 @@ const handleScroll = () => {
 };
 
 onMount(async () => {
+	hydrateAprilFools();
+
 	if (browser) {
 		if (await localforage.getItem("redirect")) {
 			window.location.href = (await localforage.getItem("redirect")) ?? "/";
@@ -213,41 +220,66 @@ $: {
 {:else}
   <Announcement />
 
+  {#if aprilFoolsVisible()}
+    <div class="card card-centered april-fools-banner">
+      <b>Executive Mode {$aprilFools ? 'enabled' : 'disabled'}.</b>
+      All media are now deliverables.
+      <Spacer />
+      <button class="small-button" onclick={() => aprilFools.toggle()}>
+        {$aprilFools ? 'Disable' : 'Enable'} Executive Mode
+      </button>
+    </div>
+  {/if}
+
   <div class="container">
     <div class="card card-centered header" class:header-hidden={!isHeaderVisible}>
       <div>
-        <a href={root('/')} class="header-item">{$locale().navigation.home}</a><a
+        <a href={root('/')} class="header-item"
+          >{executiveCopy($aprilFools, $locale().navigation.home)}</a
+        ><a
           href={root('/completed')}
           class="header-item"
         >
-          {$locale().navigation.completed}
+          {executiveCopy($aprilFools, $locale().navigation.completed)}
         </a>
         <Dropdown
           items={[
-            { name: $locale().navigation.subtitleSchedule, url: root('/schedule') },
+            {
+              name: executiveCopy($aprilFools, $locale().navigation.subtitleSchedule),
+              url: root('/schedule')
+            },
             { name: $locale().navigation.hololive, url: root('/hololive') },
             { name: $locale().tools.tool.characterBirthdays.short, url: root('/birthdays') },
-            { name: $locale().navigation.newReleases, url: root('/updates') }
+            { name: executiveCopy($aprilFools, $locale().navigation.newReleases), url: root('/updates') }
           ]}
           header={false}
         >
-          <span slot="title" class="header-item">{$locale().navigation.schedule}</span>
+          <span slot="title" class="header-item">
+            {executiveCopy($aprilFools, $locale().navigation.schedule)}
+          </span>
         </Dropdown>
-        <a href={root('/tools')} class="header-item">{$locale().navigation.tools}</a>
-        <a href={root('/settings')} class="header-item">{$locale().navigation.settings}</a>
+        <a href={root('/tools')} class="header-item"
+          >{executiveCopy($aprilFools, $locale().navigation.tools)}</a
+        >
+        <a href={root('/settings')} class="header-item"
+          >{executiveCopy($aprilFools, $locale().navigation.settings)}</a
+        >
 
         <span class="header-item opaque separator">•</span>
 
         {#if data.user}
           <Dropdown
             items={[
-              { name: $locale().navigation.myProfile, url: root(`/user/${$userIdentity.name}`) },
               {
-                name: $locale().navigation.myBadgeWall,
+                name: executiveCopy($aprilFools, $locale().navigation.myProfile),
+                url: root(`/user/${$userIdentity.name}`)
+              },
+              {
+                name: executiveCopy($aprilFools, $locale().navigation.myBadgeWall),
                 url: root(`/user/${$userIdentity.name}/badges`)
               },
               {
-                name: $locale().navigation.logOut,
+                name: executiveCopy($aprilFools, $locale().navigation.logOut),
                 url: '#',
                 preventDefault: true,
                 onClick: async () => {
@@ -263,7 +295,7 @@ $: {
             header={false}
           >
             <span slot="title" class="header-item">
-              {$locale().navigation.profile}
+              {executiveCopy($aprilFools, $locale().navigation.profile)}
             </span>
           </Dropdown>
         {/if}
@@ -279,7 +311,7 @@ $: {
               );
             }}
           >
-            {$locale().navigation.logIn}
+            {executiveCopy($aprilFools, $locale().navigation.logIn)}
           </a>
         {:else if data.user}
           <a href={root(`/user/${$userIdentity.name}`)} class="header-item">
@@ -332,6 +364,10 @@ $: {
     transition: transform 0.3s ease;
   }
 
+  .april-fools-banner {
+    margin-bottom: 1rem;
+  }
+
   .header-hidden {
     transform: translateY(-150%);
   }