ghostguild-org/app/components/TopStrip.vue
Jennie Robinson Faber fcd6f4cdf4 feat: reskin admin pages to zine design system
Migrate the entire admin section from the dark guild-* Tailwind theme
to the zine design system (dashed borders, CSS custom properties,
Brygada 1918 + Commit Mono, cream/dark mode palette).

- Replace admin top-nav layout with sidebar matching default layout
- Reskin dashboard, members, events, series management pages
- Reskin events/create and series/create form pages
- Add dev-only test login endpoint (GET /api/dev/test-login)
- Redirect duplicate admin/dashboard.vue to /admin
- Update CLAUDE.md design system docs
2026-04-03 10:56:01 +01:00

47 lines
1.1 KiB
Vue

<template>
<div class="top-strip">
<span>
<slot name="left">ghostguild.org{{ pagePath ? ` / ${pagePath}` : '' }}</slot>
</span>
<span>
<slot name="right">
<ClientOnly>
<template v-if="memberData">
Signed in as {{ memberData.name }}
<template v-if="memberData.circle">
&middot; {{ memberData.circle }}
</template>
</template>
<template v-else>
A cooperative for game developers
</template>
<template #fallback>
A cooperative for game developers
</template>
</ClientOnly>
</slot>
</span>
</div>
</template>
<script setup>
defineProps({
pagePath: { type: String, default: '' },
})
const { memberData } = useAuth()
</script>
<style scoped>
.top-strip {
padding: 16px 32px;
border-bottom: 1px dashed var(--border);
font-size: 12px;
color: var(--text-dim);
display: flex;
justify-content: space-between;
align-items: center;
}
.top-strip a { color: var(--text-faint); }
.top-strip a:hover { color: var(--candle); }
</style>