From fb7c78977c386c8384a1e703e671b12d8ae5ffa6 Mon Sep 17 00:00:00 2001
From: stopflock <admin@stopflock.com>
Date: Sat, 4 Jul 2026 11:23:57 -0500
Subject: [PATCH 1/9] discord lander page

---
 webapp/src/router/index.ts       |  9 +++++++
 webapp/src/views/DiscordJoin.vue | 42 ++++++++++++++++++++++++++++++++
 2 files changed, 51 insertions(+)
 create mode 100644 webapp/src/views/DiscordJoin.vue

diff --git a/webapp/src/router/index.ts b/webapp/src/router/index.ts
index 50fa563..69b7027 100644
--- a/webapp/src/router/index.ts
+++ b/webapp/src/router/index.ts
@@ -183,6 +183,14 @@ const router = createRouter({
         title: 'Blog Post | DeFlock'
       }
     },
+    {
+      path: '/discord',
+      name: 'discord',
+      component: () => import('../views/DiscordJoin.vue'),
+      meta: {
+        title: 'Join our Discord | DeFlock'
+      }
+    },
     {
       path: '/:pathMatch(.*)*',
       name: 'not-found',
@@ -190,6 +198,7 @@ const router = createRouter({
       meta: {
         title: 'Not Found | DeFlock'
       }
+
     }
   ]
 })
diff --git a/webapp/src/views/DiscordJoin.vue b/webapp/src/views/DiscordJoin.vue
new file mode 100644
index 0000000..22e882b
--- /dev/null
+++ b/webapp/src/views/DiscordJoin.vue
@@ -0,0 +1,42 @@
+<template>
+  <DefaultLayout>
+    <div class="loading-container">
+      Loading...
+    </div>
+
+    <DiscordWarningDialog
+      v-model="showDialog"
+      :discordUrl="discordUrl"
+      @proceed="handleProceed"
+    />
+  </DefaultLayout>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import { useHead } from '@unhead/vue';
+import DefaultLayout from '@/layouts/DefaultLayout.vue';
+import DiscordWarningDialog from '@/components/DiscordWarningDialog.vue';
+
+useHead({
+  meta: [{ name: 'robots', content: 'noindex, nofollow' }]
+});
+
+const discordUrl = 'https://discord.gg/aV7v4R3sKT';
+const showDialog = ref(true);
+
+function handleProceed(url: string) {
+  window.open(url, '_blank');
+}
+</script>
+
+<style scoped>
+.loading-container {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-height: 60vh;
+  font-size: 1.1rem;
+  color: var(--df-text-color);
+}
+</style>

From 8e2adcf512bce5b1e3b76f75b9f1f60ae585d919 Mon Sep 17 00:00:00 2001
From: stopflock <admin@stopflock.com>
Date: Sat, 4 Jul 2026 11:29:19 -0500
Subject: [PATCH 2/9] change background message text

---
 webapp/src/views/DiscordJoin.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/webapp/src/views/DiscordJoin.vue b/webapp/src/views/DiscordJoin.vue
index 22e882b..dba2df8 100644
--- a/webapp/src/views/DiscordJoin.vue
+++ b/webapp/src/views/DiscordJoin.vue
@@ -1,7 +1,7 @@
 <template>
   <DefaultLayout>
     <div class="loading-container">
-      Loading...
+      (Intentionally blank)
     </div>
 
     <DiscordWarningDialog

From f9eedad6e5bffcf91a5c424e5e4e231e5f1ed1ab Mon Sep 17 00:00:00 2001
From: stopflock <admin@stopflock.com>
Date: Sat, 4 Jul 2026 12:07:50 -0500
Subject: [PATCH 3/9] nicer message, button instead of blank page

---
 .../src/components/DiscordWarningDialog.vue   |  4 ++++
 webapp/src/views/DiscordJoin.vue              | 21 +++++++------------
 2 files changed, 11 insertions(+), 14 deletions(-)

diff --git a/webapp/src/components/DiscordWarningDialog.vue b/webapp/src/components/DiscordWarningDialog.vue
index 2a834e3..04aeaf7 100644
--- a/webapp/src/components/DiscordWarningDialog.vue
+++ b/webapp/src/components/DiscordWarningDialog.vue
@@ -7,8 +7,12 @@
           <p class="mb-3 text-body-1">
             <strong>You're about to join Discord</strong>
           </p>
+          <p class="mb-3 text-body-2">
+            DeFlock's Discord is a space for individuals and groups to meet and collaborate to campaign against mass surveillance infrastructure.
+          </p>
           <v-alert color="warning" variant="outlined" class="mb-4">
             <b>Law enforcement</b> and <b>Flock employees</b> actively monitor the Discord server. Please act accordingly.
+
           </v-alert>
           <p class="text-caption text-medium-emphasis mb-2">
             If you understand the risks and wish to continue, click <strong>Proceed</strong> below.
diff --git a/webapp/src/views/DiscordJoin.vue b/webapp/src/views/DiscordJoin.vue
index dba2df8..c69af5e 100644
--- a/webapp/src/views/DiscordJoin.vue
+++ b/webapp/src/views/DiscordJoin.vue
@@ -1,8 +1,12 @@
 <template>
   <DefaultLayout>
-    <div class="loading-container">
-      (Intentionally blank)
-    </div>
+    <v-container class="narrow-text text-center">
+      <h1 class="mb-4">Join the DeFlock Discord</h1>
+      <v-btn color="primary" size="large" rounded @click="showDialog = true">
+        <v-icon start>mdi-discord</v-icon>
+        Join Discord
+      </v-btn>
+    </v-container>
 
     <DiscordWarningDialog
       v-model="showDialog"
@@ -29,14 +33,3 @@ function handleProceed(url: string) {
   window.open(url, '_blank');
 }
 </script>
-
-<style scoped>
-.loading-container {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  min-height: 60vh;
-  font-size: 1.1rem;
-  color: var(--df-text-color);
-}
-</style>

From 2f7d5f045cd091df274c0b1809a19ba98efe0f7a Mon Sep 17 00:00:00 2001
From: stopflock <admin@stopflock.com>
Date: Sat, 4 Jul 2026 12:14:03 -0500
Subject: [PATCH 4/9] fix discord icon

---
 webapp/src/views/DiscordJoin.vue | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/webapp/src/views/DiscordJoin.vue b/webapp/src/views/DiscordJoin.vue
index c69af5e..39bf8c5 100644
--- a/webapp/src/views/DiscordJoin.vue
+++ b/webapp/src/views/DiscordJoin.vue
@@ -1,13 +1,13 @@
 <template>
   <DefaultLayout>
     <v-container class="narrow-text text-center">
-      <h1 class="mb-4">Join the DeFlock Discord</h1>
       <v-btn color="primary" size="large" rounded @click="showDialog = true">
-        <v-icon start>mdi-discord</v-icon>
+        <v-img class="mr-2" contain width="24" height="24" :src="isDark ? '/icon-discord-white.svg' : '/icon-discord.svg'" />
         Join Discord
       </v-btn>
     </v-container>
 
+
     <DiscordWarningDialog
       v-model="showDialog"
       :discordUrl="discordUrl"
@@ -17,7 +17,8 @@
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue';
+import { computed, ref } from 'vue';
+import { useTheme } from 'vuetify';
 import { useHead } from '@unhead/vue';
 import DefaultLayout from '@/layouts/DefaultLayout.vue';
 import DiscordWarningDialog from '@/components/DiscordWarningDialog.vue';
@@ -26,7 +27,11 @@ useHead({
   meta: [{ name: 'robots', content: 'noindex, nofollow' }]
 });
 
+const theme = useTheme();
+const isDark = computed(() => theme.name.value === 'dark');
+
 const discordUrl = 'https://discord.gg/aV7v4R3sKT';
+
 const showDialog = ref(true);
 
 function handleProceed(url: string) {

From 307d9b256c9bed4e2c5de03a230d7eb9af58447d Mon Sep 17 00:00:00 2001
From: stopflock <admin@stopflock.com>
Date: Sat, 4 Jul 2026 12:14:37 -0500
Subject: [PATCH 5/9] change a word

---
 webapp/src/views/DiscordJoin.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/webapp/src/views/DiscordJoin.vue b/webapp/src/views/DiscordJoin.vue
index 39bf8c5..9ab33f1 100644
--- a/webapp/src/views/DiscordJoin.vue
+++ b/webapp/src/views/DiscordJoin.vue
@@ -3,7 +3,7 @@
     <v-container class="narrow-text text-center">
       <v-btn color="primary" size="large" rounded @click="showDialog = true">
         <v-img class="mr-2" contain width="24" height="24" :src="isDark ? '/icon-discord-white.svg' : '/icon-discord.svg'" />
-        Join Discord
+        Join DeFlock Discord
       </v-btn>
     </v-container>
 

From e12702005165233e9f588ae5a077d7342a9148bc Mon Sep 17 00:00:00 2001
From: stopflock <admin@stopflock.com>
Date: Sat, 4 Jul 2026 12:21:22 -0500
Subject: [PATCH 6/9] spacing

---
 webapp/src/views/DiscordJoin.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/webapp/src/views/DiscordJoin.vue b/webapp/src/views/DiscordJoin.vue
index 9ab33f1..cc00f19 100644
--- a/webapp/src/views/DiscordJoin.vue
+++ b/webapp/src/views/DiscordJoin.vue
@@ -1,6 +1,6 @@
 <template>
   <DefaultLayout>
-    <v-container class="narrow-text text-center">
+    <v-container class="narrow-text text-center mt-12">
       <v-btn color="primary" size="large" rounded @click="showDialog = true">
         <v-img class="mr-2" contain width="24" height="24" :src="isDark ? '/icon-discord-white.svg' : '/icon-discord.svg'" />
         Join DeFlock Discord

From f223e3d7fa3c5fb7088b46692d4f3b9d4f3b00ec Mon Sep 17 00:00:00 2001
From: stopflock <admin@stopflock.com>
Date: Sat, 4 Jul 2026 12:25:40 -0500
Subject: [PATCH 7/9] discord icon color should not go dark here

---
 webapp/src/views/DiscordJoin.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/webapp/src/views/DiscordJoin.vue b/webapp/src/views/DiscordJoin.vue
index cc00f19..829e436 100644
--- a/webapp/src/views/DiscordJoin.vue
+++ b/webapp/src/views/DiscordJoin.vue
@@ -2,7 +2,7 @@
   <DefaultLayout>
     <v-container class="narrow-text text-center mt-12">
       <v-btn color="primary" size="large" rounded @click="showDialog = true">
-        <v-img class="mr-2" contain width="24" height="24" :src="isDark ? '/icon-discord-white.svg' : '/icon-discord.svg'" />
+        <v-img class="mr-2" contain width="24" height="24" :src="/icon-discord-white.svg" />
         Join DeFlock Discord
       </v-btn>
     </v-container>

From c4c2af80e99a10549da0a1a58bcbfdf5a6909eee Mon Sep 17 00:00:00 2001
From: stopflock <admin@stopflock.com>
Date: Sat, 4 Jul 2026 12:26:44 -0500
Subject: [PATCH 8/9] fix floating footer on short pages

---
 webapp/src/layouts/DefaultLayout.vue | 19 ++++++++++++++++++-
 1 file changed, 18 insertions(+), 1 deletion(-)

diff --git a/webapp/src/layouts/DefaultLayout.vue b/webapp/src/layouts/DefaultLayout.vue
index 8759a16..b855d75 100644
--- a/webapp/src/layouts/DefaultLayout.vue
+++ b/webapp/src/layouts/DefaultLayout.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="page-wrapper">
     <slot name="header" />
 
     <!-- Main content -->
@@ -22,3 +22,20 @@ defineProps({
   },
 })
 </script>
+
+<style scoped>
+/* Sticky-footer layout: keeps the footer pinned to the bottom of the
+   viewport on short pages (without being fixed/floating), while still
+   allowing it to scroll off-screen naturally on taller pages. */
+.page-wrapper {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+}
+
+.page-wrapper main {
+
+  flex: 1 0 auto;
+}
+</style>
+

From 95a62ec5072e4cace9e989368a83f40e528af497 Mon Sep 17 00:00:00 2001
From: stopflock <admin@stopflock.com>
Date: Sat, 4 Jul 2026 12:35:57 -0500
Subject: [PATCH 9/9] actually fix light/dark mode discord icon

---
 webapp/src/views/DiscordJoin.vue | 9 ++-------
 1 file changed, 2 insertions(+), 7 deletions(-)

diff --git a/webapp/src/views/DiscordJoin.vue b/webapp/src/views/DiscordJoin.vue
index 829e436..0b7e0e6 100644
--- a/webapp/src/views/DiscordJoin.vue
+++ b/webapp/src/views/DiscordJoin.vue
@@ -2,12 +2,11 @@
   <DefaultLayout>
     <v-container class="narrow-text text-center mt-12">
       <v-btn color="primary" size="large" rounded @click="showDialog = true">
-        <v-img class="mr-2" contain width="24" height="24" :src="/icon-discord-white.svg" />
+        <v-img class="mr-2" contain width="24" height="24" src="/icon-discord-white.svg" />
         Join DeFlock Discord
       </v-btn>
     </v-container>
 
-
     <DiscordWarningDialog
       v-model="showDialog"
       :discordUrl="discordUrl"
@@ -17,8 +16,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, ref } from 'vue';
-import { useTheme } from 'vuetify';
+import { ref } from 'vue';
 import { useHead } from '@unhead/vue';
 import DefaultLayout from '@/layouts/DefaultLayout.vue';
 import DiscordWarningDialog from '@/components/DiscordWarningDialog.vue';
@@ -27,9 +25,6 @@ useHead({
   meta: [{ name: 'robots', content: 'noindex, nofollow' }]
 });
 
-const theme = useTheme();
-const isDark = computed(() => theme.name.value === 'dark');
-
 const discordUrl = 'https://discord.gg/aV7v4R3sKT';
 
 const showDialog = ref(true);