refactor(activity): migrate to PageShell + ColumnsLayout

Replace .activity-page wrapper + SidebarLayout with PageShell +
ColumnsLayout cols="events-sidebar". Delete the now-redundant
flex-chain CSS that PageShell owns. Adds .loading-state to the
visual mask list to handle the connections-mobile race between
the loading and loaded states.
This commit is contained in:
Jennie Robinson Faber 2026-04-08 16:45:12 +01:00
parent 89c9a5e4a2
commit eb2544a42d
2 changed files with 8 additions and 16 deletions

View file

@ -1,11 +1,9 @@
<template>
<div class="activity-page">
<PageHeader
title="Activity Log"
subtitle="Your activity and milestones in the Guild"
/>
<SidebarLayout :limit="5">
<PageShell
title="Activity Log"
subtitle="Your activity and milestones in the Guild"
>
<ColumnsLayout cols="events-sidebar" :limit="5">
<ClientOnly>
<!-- Loading State -->
<div v-if="loading && !entries.length" class="state-box">
@ -66,8 +64,8 @@
</div>
</template>
</ClientOnly>
</SidebarLayout>
</div>
</ColumnsLayout>
</PageShell>
</template>
<script setup>
@ -142,13 +140,6 @@ useHead({ title: 'Activity Log - Ghost Guild' })
</script>
<style scoped>
.activity-page {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
}
/* ---- STATE BOXES ---- */
.state-box {
display: flex;