diff --git a/webapp/src/App.vue b/webapp/src/App.vue
index 0b35159..92879b2 100644
--- a/webapp/src/App.vue
+++ b/webapp/src/App.vue
@@ -3,12 +3,13 @@ import { RouterView, useRouter } from 'vue-router'
import { computed, ref, watch, onMounted } from 'vue'
import { useTheme } from 'vuetify';
import DiscordWarningDialog from '@/components/DiscordWarningDialog.vue';
+import OfficialSocials from '@/components/layout/OfficialSocials.vue';
import { useDiscordIntercept } from '@/composables/useDiscordIntercept';
const theme = useTheme();
const router = useRouter();
-const isDark = computed(() => theme.name.value === 'dark');
const isInIframe = computed(() => window.self !== window.top);
+
const { showDialog, discordUrl, interceptDiscordLinks } = useDiscordIntercept();
function toggleTheme() {
@@ -38,23 +39,24 @@ const items = [
{ title: 'Map', icon: 'mdi-map', href: 'https://maps.deflock.org' },
{ title: 'Learn', icon: 'mdi-school', to: '/what-is-an-alpr' },
{ title: 'Store', icon: 'mdi-shopping', to: '/store' },
+ { title: 'Donate', icon: 'mdi-cash-multiple', to: '/donate' },
]
-const contributeItems = [
- { title: 'Submit Cameras', icon: 'mdi-map-marker-plus', to: '/report' },
+const resourceItems = [
{ title: 'Public Records', icon: 'mdi-file-document', to: '/foia' },
{ title: 'City Council', icon: 'mdi-account-voice', to: '/council' },
- { title: 'Support Us', icon: 'mdi-cash-multiple', to: '/donate' },
+ { title: 'FAQ', icon: 'mdi-help-circle', to: '/what-is-an-alpr' },
]
-const metaItems = [
- { title: 'Discord', customIcon: '/icon-discord.svg', customIconDark: '/icon-discord-white.svg', customIconGrey: '/icon-discord-grey.svg', href: 'https://discord.gg/aV7v4R3sKT'},
+const getInvolvedItems = [
{ title: 'Local Groups', icon: 'mdi-account-group', to: '/groups' },
{ title: 'Contact', icon: 'mdi-email-outline', to: '/contact' },
{ title: 'GitHub', icon: 'mdi-github', href: 'https://github.com/frillweeman/deflock'},
+ { title: 'Submit Cameras', icon: 'mdi-map-marker-plus', to: '/report' },
];
const drawer = ref(false)
+
watch(() => theme.global.name.value, (newTheme) => {
const root = document.documentElement;
if (newTheme === 'dark') {
@@ -110,7 +112,7 @@ watch(() => theme.global.name.value, (newTheme) => {
© {{ currentYear }} DeFlock. All Rights Reserved
@@ -70,6 +94,7 @@ diff --git a/webapp/src/components/layout/OfficialSocials.vue b/webapp/src/components/layout/OfficialSocials.vue new file mode 100644 index 0000000..de51744 --- /dev/null +++ b/webapp/src/components/layout/OfficialSocials.vue @@ -0,0 +1,85 @@ + + + + + + +