refactor: update app.vue and various components to improve routing paths, enhance UI consistency, and streamline layout for better user experience

This commit is contained in:
Jennie Robinson Faber 2025-09-11 11:51:48 +01:00
parent b6e8d3b7ec
commit 78af43770c
29 changed files with 1699 additions and 1990 deletions

30
app.vue
View file

@ -15,7 +15,8 @@
Urgent Tools
</h1>
</NuxtLink>
<div class="absolute right-0">
<div class="absolute right-0 flex items-center gap-2">
<CurrencySelector />
<ColorModeToggle />
</div>
</div>
@ -24,7 +25,7 @@
role="navigation"
aria-label="Main navigation">
<NuxtLink
to="/coop-planner"
to="/tools/coop-planner"
class="px-3 py-2 text-sm text-black dark:text-white hover:bg-neutral-100 dark:hover:bg-neutral-800 rounded-md transition-colors"
:class="{
'bg-neutral-100 dark:bg-neutral-800': isCoopBuilderSection,
@ -42,20 +43,20 @@
Coach
</NuxtLink> -->
<NuxtLink
to="/wizards"
to="/tools/wizards"
class="px-3 py-2 text-sm text-black dark:text-white hover:bg-neutral-100 dark:hover:bg-neutral-800 rounded-md transition-colors"
:class="{
'bg-neutral-100 dark:bg-neutral-800':
$route.path === '/wizards',
$route.path === '/tools/wizards',
}">
Wizards
</NuxtLink>
<NuxtLink
to="/resources"
to="/tools/resources"
class="px-3 py-2 text-sm text-black dark:text-white hover:bg-neutral-100 dark:hover:bg-neutral-800 rounded-md transition-colors"
:class="{
'bg-neutral-100 dark:bg-neutral-800':
$route.path === '/resources',
$route.path === '/tools/resources',
}">
More Resources & Templates
</NuxtLink>
@ -72,6 +73,7 @@
<NuxtPage />
</template>
</NuxtLayout>
<AppFooter />
<NuxtRouteAnnouncer />
</div>
</UApp>
@ -81,18 +83,16 @@
const route = useRoute();
const isCoopBuilderSection = computed(
() =>
route.path === "/coop-planner" ||
route.path === "/coop-builder" ||
route.path === "/" ||
route.path === "/mix" ||
route.path === "/budget" ||
route.path === "/project-budget" ||
route.path === "/settings" ||
route.path === "/glossary"
route.path === "/tools/coop-planner" ||
route.path === "/tools/coop-builder" ||
route.path === "/tools" ||
route.path === "/tools/mix" ||
route.path === "/tools/budget" ||
route.path === "/tools/project-budget"
);
const isWizardSection = computed(
() => route.path === "/wizards" || route.path.startsWith("/templates/")
() => route.path === "/tools/wizards" || route.path.startsWith("/tools/templates/")
);
// Run migrations on app startup