From d627f6a2a4dfd95b813db030860b007e15a4ae4b Mon Sep 17 00:00:00 2001
From: Sarah <144068104+iamawatermelo@users.noreply.github.com>
Date: Fri, 6 Dec 2024 21:50:12 +0000
Subject: [PATCH 1/9] mini

---
 src/lib/components/EmailLanding.svelte |  11 --
 src/lib/components/Page.svelte         |  21 ++-
 src/routes/mini/+page.svelte           | 200 +++++++++++++++++++++++++
 wak.toml                               |  15 ++
 4 files changed, 234 insertions(+), 13 deletions(-)
 create mode 100644 src/routes/mini/+page.svelte
 create mode 100644 wak.toml

diff --git a/src/lib/components/EmailLanding.svelte b/src/lib/components/EmailLanding.svelte
index f06c646..5a9b3f7 100644
--- a/src/lib/components/EmailLanding.svelte
+++ b/src/lib/components/EmailLanding.svelte
@@ -37,15 +37,4 @@
   form {
     margin: 1em 0;
   }
-
-  button {
-    height: 3em;
-    padding: 0 2em;
-    color: rgb(var(--fg));
-    font-weight: 500;
-    background: none;
-
-    @include style.hover;
-    @include style.box-texture('$lib/textures/inputbox.svg');
-  }
 </style>
diff --git a/src/lib/components/Page.svelte b/src/lib/components/Page.svelte
index 0bbfa08..fecb67e 100644
--- a/src/lib/components/Page.svelte
+++ b/src/lib/components/Page.svelte
@@ -1,18 +1,20 @@
 <script lang="ts">
-  let { title, children } = $props();
+  let { title, children, inverted = false } = $props();
 </script>
 
 <svelte:head>
   <title>{title} | Revolution</title>
 </svelte:head>
 
-<main>
+<main class:inverted={inverted}>
   <div class="content">
     {@render children?.()}
   </div>
 </main>
 
 <style lang="scss">
+  @use 'src/lib/style';
+  
   .content {
     margin: auto;
     padding: 4em 2em;
@@ -22,4 +24,19 @@
     flex-direction: column;
     gap: 0.5em;
   }
+  
+  .inverted {
+    filter: #{"grayscale(50%) invert()"};
+  }
+  
+  main :global(button) {
+    height: 3em;
+    padding: 0 2em;
+    color: rgb(var(--fg));
+    font-weight: 500;
+    background: none;
+
+    @include style.hover;
+    @include style.box-texture('$lib/textures/inputbox.svg');
+  }
 </style>
diff --git a/src/routes/mini/+page.svelte b/src/routes/mini/+page.svelte
new file mode 100644
index 0000000..b19efc6
--- /dev/null
+++ b/src/routes/mini/+page.svelte
@@ -0,0 +1,200 @@
+<script>
+  import Page from '$lib/components/Page.svelte';
+  import DoubleArrow from '$lib/images/doublearrow.svg?component';
+  import Gear from '$lib/images/gear.svg?component';
+</script>
+
+<Page title="mini" inverted>
+  <div class="first-screen">
+    <div class="first-screen-content">
+      <DoubleArrow class="logo" />
+      <h1 class="header">Revolution<br /><span class="mini">mini</span></h1>
+
+      <div class="content">
+        <p class="hero">We're hosting a small event in London lorem ipsum sit dolor amet I hate web development</p>
+        <br />
+        <button>Sign Up Yes Do It Now Right Away Immediately</button>
+      </div>
+    </div>
+
+    <div class="gear first">
+      <Gear />
+    </div>
+    <div class="gear second">
+      <Gear />
+    </div>
+  </div>
+
+  <div class="info-container">
+    <div class="info-card">
+      <h2>What?</h2>
+
+      <p>i am pissing myself</p>
+    </div>
+    <div class="info-card">
+      <h2>What?</h2>
+
+      <p>i am pissing myself</p>
+    </div>
+    <div class="info-card">
+      <h2>What?</h2>
+
+      <p>i am pissing myself</p>
+    </div>
+    <div class="info-card">
+      <h2>What?</h2>
+
+      <p>i am pissing myself</p>
+    </div>
+    <div class="info-card">
+      <h2>What?</h2>
+
+      <p>i am pissing myself</p>
+    </div>
+    <div class="info-card">
+      <h2>What?</h2>
+
+      <p>i am pissing myself</p>
+    </div>
+    <div class="info-card">
+      <h2>What?</h2>
+
+      <p>i am pissing myself</p>
+    </div>
+    <div class="info-card">
+      <h2>What?</h2>
+
+      <p>i am pissing myself</p>
+    </div>
+    <div class="info-card">
+      <h2>What?</h2>
+
+      <p>i am pissing myself</p>
+    </div>
+    
+  </div>
+</Page>
+
+<style lang="scss">
+  @use 'src/lib/style';
+
+  .first-screen {
+    z-index: 0;
+
+    .gear {
+      position: absolute;
+      animation: 120s linear infinite rotate;
+      height: 24em;
+      aspect-ratio: 1;
+
+      :global(svg) {
+        width: 100%;
+        height: 100%;
+        filter: drop-shadow(4px 8px 8px rgba(0, 0, 0, 0.2));
+      }
+
+      :global(path) {
+        fill: rgb(var(--extra-dim));
+      }
+
+      &.first {
+        top: 70%;
+        right: calc(0% - 4em);
+        --transform: translate(50%, -100%);
+      }
+
+      &.second {
+        bottom: 20%;
+        left: 0%;
+        --transform: translate(-50%, 25%);
+      }
+
+      @media (prefers-reduced-motion) {
+        animation: none;
+      }
+    }
+
+    .first-screen-content {
+      position: relative;
+      z-index: 100;
+      display: grid;
+      grid-template-columns: auto min-content;
+      grid-template-rows: min-content min-content;
+      justify-content: center;
+      align-content: center;
+      padding: 8em 4em;
+      margin: auto;
+      gap: 1em;
+
+      :global(.logo) {
+        /* I'm not sure why this is needed. Maybe because it's another component */
+        grid-area: 1 / 1 / 1 / 1;
+        width: 3em;
+        height: 3em;
+        align-self: center;
+      }
+
+      .header {
+        grid-area: 1 / 2 / 1 / 2;
+        font-size: 3em;
+        line-height: 1em;
+        min-width: max-content;
+
+        .mini {
+          display: block;
+          text-align: left;
+          line-height: 0.7em;
+          font-size: 0.5em;
+        }
+      }
+
+      .content {
+        display: grid;
+        grid-area: 2 / 1 / 2 / end;
+
+        .hero {
+          font-size: 1.5em;
+          line-height: 1.2em;
+        }
+      }
+
+      @media (min-width: style.$size_sm) {
+        :global(.logo) {
+          width: 6em;
+          height: 6em;
+        }
+
+        .header {
+          grid-area: 1 / 2 / 1 / 2;
+          font-size: 6em;
+          min-width: max-content;
+          padding-right: 4rem;
+        }
+
+        .content {
+          display: grid;
+          grid-area: 2 / 2 / 2 / 2;
+        }
+      }
+    }
+  }
+
+  .info-container {
+    display: flex;
+    flex-flow: wrap;
+    gap: 1em;
+    z-index: 5;
+
+    .info-card {
+      flex: auto;
+      flex-basis: 16em;
+      margin: auto;
+      max-width: calc(100vw - 4em);
+      width: 64em;
+      padding: 2em 2em;
+      box-shadow: 4px 8px 8px 0 rgba(0, 0, 0, 0.2);
+      
+      @include style.box-texture('$lib/textures/containerbox.svg');
+    }
+  }
+</style>
diff --git a/wak.toml b/wak.toml
new file mode 100644
index 0000000..090cba8
--- /dev/null
+++ b/wak.toml
@@ -0,0 +1,15 @@
+# https://github.com/iamawatermelo/wakapi-anyide v0.6.7
+
+[meta]
+version = 1
+watchers = ['files']
+
+[files]
+include = ["*"]  # files to include in tracking
+exclude = []  # files to exclude in tracking
+exclude_files = [".gitignore"]  # files whose contents will be used to exclude other files from tracking
+exclude_binary_files = true  # whether to ignore binary files
+# language_mapping = {".kicad_sch" = "Kicad Schematic"} # custom language mapping
+
+[project]
+name = "revolution"  # your project name
\ No newline at end of file

From 6ae9aa50a686b43edaf95b634993963308c10123 Mon Sep 17 00:00:00 2001
From: Sarah <144068104+iamawatermelo@users.noreply.github.com>
Date: Fri, 6 Dec 2024 22:02:53 +0000
Subject: [PATCH 2/9] promote mini

---
 src/routes/+layout.svelte |  1 +
 src/routes/+page.svelte   | 14 ++++++++++++++
 2 files changed, 15 insertions(+)

diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 948723d..70d27f8 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -22,6 +22,7 @@
     <a class="header" href="/">Revolution</a>
     <div class="content">
       <ul>
+        <li><a href="/mini">Revolution (mini)</a></li>
         <li><a href="https://hackclub.com/slack/">Hack Club Slack (talk to us!)</a></li>
         <li><a href="https://github.com/Revolution-Hacks/revolution">Source code</a></li>
         <li><a href="https://hcb.hackclub.com/revolution">Financials</a></li>
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 67a6a36..2380ee5 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -46,6 +46,11 @@
           to see you there!
         </p>
         <br />
+        <div class="info-card top-info">
+          <h2>Interested in Revolution?</h2>
+          You should come to our latest event, <a href="/mini">mini</a>! Sign ups close at the end of the year, UK time.
+        </div>
+        <br />
         <p class="email-title">Find out when sign-ups open:</p>
         {@render email()}
       </div>
@@ -101,6 +106,15 @@
     position: relative;
     min-height: 100vh;
     overflow-x: clip;
+    
+    .top-info {
+      width: 100%;
+      padding: 1.5em;
+      
+      h2 {
+        font-size: 1em;
+      }
+    }
 
     .track-container {
       display: flex;

From 83d1246703084342791acae482fa08bd866d231b Mon Sep 17 00:00:00 2001
From: Sarah <144068104+iamawatermelo@users.noreply.github.com>
Date: Fri, 6 Dec 2024 22:11:09 +0000
Subject: [PATCH 3/9] h

---
 src/lib/components/Page.svelte | 2 +-
 src/routes/mini/+page.svelte   | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/lib/components/Page.svelte b/src/lib/components/Page.svelte
index fecb67e..b2fd040 100644
--- a/src/lib/components/Page.svelte
+++ b/src/lib/components/Page.svelte
@@ -29,7 +29,7 @@
     filter: #{"grayscale(50%) invert()"};
   }
   
-  main :global(button) {
+  main :global(button), main :global(.style-button) {
     height: 3em;
     padding: 0 2em;
     color: rgb(var(--fg));
diff --git a/src/routes/mini/+page.svelte b/src/routes/mini/+page.svelte
index b19efc6..684ba93 100644
--- a/src/routes/mini/+page.svelte
+++ b/src/routes/mini/+page.svelte
@@ -13,7 +13,7 @@
       <div class="content">
         <p class="hero">We're hosting a small event in London lorem ipsum sit dolor amet I hate web development</p>
         <br />
-        <button>Sign Up Yes Do It Now Right Away Immediately</button>
+        <a href="https://revolution.fillout.com/mini" class="style-button">Sign Up Yes Do It Now Right Away Immediately</a>
       </div>
     </div>
 

From 356cc9c0f1c1ddebec0f5bc0c0600e47644a9b80 Mon Sep 17 00:00:00 2001
From: Sarah <144068104+iamawatermelo@users.noreply.github.com>
Date: Fri, 6 Dec 2024 22:12:47 +0000
Subject: [PATCH 4/9] h

---
 src/lib/components/Page.svelte | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/lib/components/Page.svelte b/src/lib/components/Page.svelte
index b2fd040..e2af4f5 100644
--- a/src/lib/components/Page.svelte
+++ b/src/lib/components/Page.svelte
@@ -30,6 +30,7 @@
   }
   
   main :global(button), main :global(.style-button) {
+    display: block;
     height: 3em;
     padding: 0 2em;
     color: rgb(var(--fg));

From ca7c691dc41b33d9b65c2ade037410d097eef544 Mon Sep 17 00:00:00 2001
From: Sarah <144068104+iamawatermelo@users.noreply.github.com>
Date: Fri, 6 Dec 2024 22:25:02 +0000
Subject: [PATCH 5/9] crime

---
 src/lib/components/Page.svelte | 5 +++++
 src/routes/mini/+page.svelte   | 2 ++
 2 files changed, 7 insertions(+)

diff --git a/src/lib/components/Page.svelte b/src/lib/components/Page.svelte
index e2af4f5..493cd7c 100644
--- a/src/lib/components/Page.svelte
+++ b/src/lib/components/Page.svelte
@@ -31,6 +31,11 @@
   
   main :global(button), main :global(.style-button) {
     display: block;
+    text-decoration: none;
+    font-weight: bold;
+    display: flex;
+    align-items: center;
+    text-align: center;
     height: 3em;
     padding: 0 2em;
     color: rgb(var(--fg));
diff --git a/src/routes/mini/+page.svelte b/src/routes/mini/+page.svelte
index 684ba93..9113660 100644
--- a/src/routes/mini/+page.svelte
+++ b/src/routes/mini/+page.svelte
@@ -30,6 +30,7 @@
       <h2>What?</h2>
 
       <p>i am pissing myself</p>
+      <p>i am pissing myself</p>
     </div>
     <div class="info-card">
       <h2>What?</h2>
@@ -193,6 +194,7 @@
       width: 64em;
       padding: 2em 2em;
       box-shadow: 4px 8px 8px 0 rgba(0, 0, 0, 0.2);
+      height: 32em;
       
       @include style.box-texture('$lib/textures/containerbox.svg');
     }

From 3ebd6eb6b06da0a983fb69c480bd513a072f8dbd Mon Sep 17 00:00:00 2001
From: Sarah <144068104+iamawatermelo@users.noreply.github.com>
Date: Fri, 6 Dec 2024 22:32:51 +0000
Subject: [PATCH 6/9] button

---
 src/lib/components/Page.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/lib/components/Page.svelte b/src/lib/components/Page.svelte
index 493cd7c..1c4a139 100644
--- a/src/lib/components/Page.svelte
+++ b/src/lib/components/Page.svelte
@@ -35,7 +35,7 @@
     font-weight: bold;
     display: flex;
     align-items: center;
-    text-align: center;
+    justify-content: center;
     height: 3em;
     padding: 0 2em;
     color: rgb(var(--fg));

From 5250675ca742840edc10bb5d713002f7ba7e14d4 Mon Sep 17 00:00:00 2001
From: Sarah <144068104+iamawatermelo@users.noreply.github.com>
Date: Fri, 6 Dec 2024 22:34:19 +0000
Subject: [PATCH 7/9] button

---
 src/lib/components/Page.svelte | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/lib/components/Page.svelte b/src/lib/components/Page.svelte
index 1c4a139..2a1b512 100644
--- a/src/lib/components/Page.svelte
+++ b/src/lib/components/Page.svelte
@@ -39,7 +39,6 @@
     height: 3em;
     padding: 0 2em;
     color: rgb(var(--fg));
-    font-weight: 500;
     background: none;
 
     @include style.hover;

From 00b5837e0496cd16f7cec82d18853ad1fadfb089 Mon Sep 17 00:00:00 2001
From: Sarah <144068104+iamawatermelo@users.noreply.github.com>
Date: Fri, 6 Dec 2024 22:35:50 +0000
Subject: [PATCH 8/9] button

---
 src/lib/components/Page.svelte | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/lib/components/Page.svelte b/src/lib/components/Page.svelte
index 2a1b512..4f3a0f4 100644
--- a/src/lib/components/Page.svelte
+++ b/src/lib/components/Page.svelte
@@ -37,6 +37,7 @@
     align-items: center;
     justify-content: center;
     height: 3em;
+    width: 16em;
     padding: 0 2em;
     color: rgb(var(--fg));
     background: none;

From 8d8e9bf7a240e0c1d4314eb49690beabd51d3807 Mon Sep 17 00:00:00 2001
From: Dillon Barnes <amber@transcental.dev>
Date: Fri, 6 Dec 2024 22:37:11 +0000
Subject: [PATCH 9/9] COPY COPY COPY

---
 src/routes/mini/+page.svelte | 69 +++++++++++++-----------------------
 1 file changed, 25 insertions(+), 44 deletions(-)

diff --git a/src/routes/mini/+page.svelte b/src/routes/mini/+page.svelte
index 9113660..83aba8a 100644
--- a/src/routes/mini/+page.svelte
+++ b/src/routes/mini/+page.svelte
@@ -11,9 +11,9 @@
       <h1 class="header">Revolution<br /><span class="mini">mini</span></h1>
 
       <div class="content">
-        <p class="hero">We're hosting a small event in London lorem ipsum sit dolor amet I hate web development</p>
+        <p class="hero">We're hosting a small hackathon in London on <strong>January 4th</strong></p>
         <br />
-        <a href="https://revolution.fillout.com/mini" class="style-button">Sign Up Yes Do It Now Right Away Immediately</a>
+        <a href="https://revolution.fillout.com/mini" class="style-button">Sign up</a>
       </div>
     </div>
 
@@ -27,52 +27,33 @@
 
   <div class="info-container">
     <div class="info-card">
-      <h2>What?</h2>
-
-      <p>i am pissing myself</p>
-      <p>i am pissing myself</p>
+      <h2>Where is it?</h2>
+      <p>We don't know yet, but we're looking at venues in London Zones 1-3. We'll let you know as soon as we have a confirmed venue.</p>
     </div>
     <div class="info-card">
-      <h2>What?</h2>
-
-      <p>i am pissing myself</p>
+      <h2>When is it?</h2>
+      <p>January 4th, 2025. The exact times will depend on the venue, but will be roughly 9am-5pm.</p>
     </div>
     <div class="info-card">
-      <h2>What?</h2>
-
-      <p>i am pissing myself</p>
+      <h2>What can I build?</h2>
+      <p>Anything! As long as it follows the theme that is.</p>
     </div>
-    <div class="info-card">
-      <h2>What?</h2>
-
-      <p>i am pissing myself</p>
-    </div>
-    <div class="info-card">
-      <h2>What?</h2>
-
-      <p>i am pissing myself</p>
-    </div>
-    <div class="info-card">
-      <h2>What?</h2>
-
-      <p>i am pissing myself</p>
-    </div>
-    <div class="info-card">
-      <h2>What?</h2>
-
-      <p>i am pissing myself</p>
-    </div>
-    <div class="info-card">
-      <h2>What?</h2>
-
-      <p>i am pissing myself</p>
-    </div>
-    <div class="info-card">
-      <h2>What?</h2>
-
-      <p>i am pissing myself</p>
-    </div>
-    
+  <div class="info-card">
+    <h2>What do I need to bring?</h2>
+    <p>Yourself, a photo ID (student ID card is fine!), a smile, and your laptop! Food and drink will be provided.</p>
+  </div>
+  <div class="info-card">
+    <h2>How much does it cost?</h2>
+    <p>Revolution (mini) is free to attend! You will need to pay for transport though.</p>
+  </div>
+  <div class="info-card">
+    <h2>What about allergies?</h2>
+    <p>If you have allergies or other medical conditions, let us know on the signup form and we'll do our best to accomodate them.</p>
+  </div>
+  <div class="info-card">
+    <h2>What is the theme?</h2>
+    <p>You'll find out on the day! We're not spoiling it for you, but it may be somewhat related to the Industrial Revolution. 👀</p>
+  </div>
   </div>
 </Page>
 
@@ -194,7 +175,7 @@
       width: 64em;
       padding: 2em 2em;
       box-shadow: 4px 8px 8px 0 rgba(0, 0, 0, 0.2);
-      height: 32em;
+      height: 16em;
       
       @include style.box-texture('$lib/textures/containerbox.svg');
     }