till/managarten
1
0
Fork 0
mirror of https://github.com/Memo-2023/mana-monorepo.git synced 2026-05-14 20:01:09 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

feat(apps): add unified Apps page and PillNavigation to all web apps

Browse source 
- Add AppsPage component to shared-ui for displaying all Mana apps
- Add allAppsHref prop to PillNavigation with "Alle Apps" link in dropdown
- Integrate PillNavigation in archived apps (maerchenzauber, news, uload, wisekeep)
- Add /apps route to all web apps (active and archived)
- Replace custom sidebars/headers with unified PillNavigation

Apps updated:
- Active: chat, manacore, manadeck, picture, presi, zitare
- Archived: maerchenzauber, memoro, news, nutriphi, uload, wisekeep

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Till-JS 2025-12-01 14:48:00 +01:00
parent 1f2d21e005
commit 4e4db4612c
25 changed files with 1354 additions and 538 deletions
Download patch file Download diff file Expand all files Collapse all files

1
apps/chat/apps/web/src/routes/(protected)/+layout.svelte
View file

@ -205,6 +205,7 @@
settingsHref="/settings"
manaHref="/mana"
profileHref="/profile"
allAppsHref="/apps"
/>
<!-- Main Content with dynamic padding based on nav mode -->

14
apps/chat/apps/web/src/routes/(protected)/apps/+page.svelte Normal file
View file

@ -0,0 +1,14 @@
<script lang="ts">
import { AppsPage } from '@manacore/shared-ui';
</script>
<div class="apps-page-wrapper">
<AppsPage currentAppId="chat" locale="de" title="Alle Apps" />
</div>
<style>
.apps-page-wrapper {
background-color: hsl(var(--background));
min-height: 100%;
}
</style>

1
apps/manacore/apps/web/src/routes/(app)/+layout.svelte
View file

@ -191,6 +191,7 @@
settingsHref="/settings"
manaHref="/mana"
profileHref="/profile"
allAppsHref="/apps"
/>
<!-- Main content with dynamic padding -->

14
apps/manacore/apps/web/src/routes/(app)/apps/+page.svelte Normal file
View file

@ -0,0 +1,14 @@
<script lang="ts">
import { AppsPage } from '@manacore/shared-ui';
</script>
<div class="apps-page-wrapper">
<AppsPage currentAppId="manacore" locale="de" title="Alle Apps" />
</div>
<style>
.apps-page-wrapper {
background-color: hsl(var(--background));
min-height: 100%;
}
</style>

5
apps/manadeck/apps/web/src/routes/(app)/+layout.svelte
View file

@ -27,13 +27,11 @@
// Get theme state
let isDark = $derived(theme.isDark);
// Navigation items for ManaDeck
// Navigation items for ManaDeck (Mana and Profile are in user dropdown)
const navItems: PillNavItem[] = [
{ href: '/decks', label: 'Decks', icon: 'archive' },
{ href: '/explore', label: 'Explore', icon: 'search' },
{ href: '/progress', label: 'Progress', icon: 'chart' },
{ href: '/mana', label: 'Mana', icon: 'mana' },
{ href: '/profile', label: 'Profile', icon: 'user' },
];
// Theme variant dropdown items
@ -196,6 +194,7 @@
settingsHref="/settings"
manaHref="/mana"
profileHref="/profile"
allAppsHref="/apps"
/>
<!-- Main content with dynamic padding -->

14
apps/manadeck/apps/web/src/routes/(app)/apps/+page.svelte Normal file
View file

@ -0,0 +1,14 @@
<script lang="ts">
import { AppsPage } from '@manacore/shared-ui';
</script>
<div class="apps-page-wrapper">
<AppsPage currentAppId="manadeck" locale="de" title="Alle Apps" />
</div>
<style>
.apps-page-wrapper {
background-color: hsl(var(--background));
min-height: 100%;
}
</style>

1
apps/picture/apps/web/src/routes/app/+layout.svelte
View file

@ -239,6 +239,7 @@
settingsHref="/app/settings"
manaHref="/app/mana"
profileHref="/app/profile"
allAppsHref="/app/apps"
/>
{/if}

14
apps/picture/apps/web/src/routes/app/apps/+page.svelte Normal file
View file

@ -0,0 +1,14 @@
<script lang="ts">
import { AppsPage } from '@manacore/shared-ui';
</script>
<div class="apps-page-wrapper">
<AppsPage currentAppId="picture" locale="de" title="Alle Apps" />
</div>
<style>
.apps-page-wrapper {
background-color: hsl(var(--color-background));
min-height: 100%;
}
</style>

9
apps/presi/apps/web/src/routes/+layout.svelte
View file

@ -61,12 +61,8 @@
let userEmail = $derived(auth.user?.email);
// Navigation items for Presi
const navItems: PillNavItem[] = [
{ href: '/', label: 'Decks', icon: 'document' },
{ href: '/profile', label: 'Profil', icon: 'user' },
{ href: '/mana', label: 'Mana', icon: 'sparkles' },
{ href: '/settings', label: 'Einstellungen', icon: 'settings' },
];
// Profile, Mana, and Settings are in the user dropdown via profileHref, manaHref, settingsHref
const navItems: PillNavItem[] = [{ href: '/', label: 'Decks', icon: 'document' }];
// Public routes that don't require auth
const publicRoutes = ['/login', '/register', '/forgot-password'];
@ -205,6 +201,7 @@
settingsHref="/settings"
manaHref="/mana"
profileHref="/profile"
allAppsHref="/apps"
/>
<!-- Main Content with dynamic padding based on nav mode -->

14
apps/presi/apps/web/src/routes/apps/+page.svelte Normal file
View file

@ -0,0 +1,14 @@
<script lang="ts">
import { AppsPage } from '@manacore/shared-ui';
</script>
<div class="apps-page-wrapper">
<AppsPage currentAppId="presi" locale="de" title="Alle Apps" />
</div>
<style>
.apps-page-wrapper {
background-color: hsl(var(--background));
min-height: 100%;
}
</style>

28
apps/zitare/apps/web/src/routes/+layout.svelte
View file

@ -68,7 +68,7 @@
// Navigation items for Zitare
const navItems: PillNavItem[] = [
{ href: '/', label: 'Zitate', icon: 'chat' },
{ href: '/', label: 'Zitate', icon: 'document' },
{ href: '/search', label: 'Suche', icon: 'search' },
{ href: '/authors', label: 'Autoren', icon: 'users' },
{ href: '/favorites', label: 'Favoriten', icon: 'heart' },
@ -214,10 +214,15 @@
class="main-content bg-background"
class:sidebar-mode={isSidebarMode && !isCollapsed}
class:floating-mode={!isSidebarMode && !isCollapsed}
class:full-height={$page.url.pathname === '/'}
>
<div class="content-wrapper">
{#if $page.url.pathname === '/'}
{@render children()}
</div>
{:else}
<div class="content-wrapper">
{@render children()}
</div>
{/if}
</main>
</div>
{/if}
@ -244,6 +249,23 @@
padding-left: 180px;
}
/* Full height mode for scrollable pages like home */
.main-content.full-height {
display: flex;
flex-direction: column;
height: calc(100vh - 100px);
overflow: hidden;
}
.main-content.full-height.floating-mode {
height: 100vh;
padding-top: 0;
}
.main-content.full-height.sidebar-mode {
height: 100vh;
}
.content-wrapper {
max-width: 80rem; /* max-w-7xl */
margin-left: auto;

14
apps/zitare/apps/web/src/routes/apps/+page.svelte Normal file
View file

@ -0,0 +1,14 @@
<script lang="ts">
import { AppsPage } from '@manacore/shared-ui';
</script>
<div class="apps-page-wrapper">
<AppsPage currentAppId="zitare" locale="de" title="Alle Apps" />
</div>
<style>
.apps-page-wrapper {
background-color: hsl(var(--background));
min-height: 100%;
}
</style>