jennie/ghostguild-org
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Redesign interface across member dashboard and events pages

Browse source 
The changes involve a comprehensive interface redesign across multiple
pages, including:

- Updated peer support badge with shield design
- Switched privacy toggle to use USwitch component
- Added light/dark mode support throughout
- Enhanced layout and spacing in default template
- Added series details page with timeline view
- Improved event cards and status indicators
- Refreshed member profile styles for better readability
- Introduced global cursor styling for interactive elements
This commit is contained in:
Jennie Robinson Faber 2025-10-09 16:25:57 +01:00
parent e8e3b84276
commit 896ad0336c
12 changed files with 915 additions and 360 deletions
Download patch file Download diff file Expand all files Collapse all files

32
app/pages/member/dashboard.vue
View file

@ -8,7 +8,7 @@
size="medium"
/>
<UContainer class="py-12">
<UContainer class="">
<!-- Loading State -->
<div
v-if="!memberData || authPending"
@ -17,7 +17,7 @@
<div class="text-center">
<div
class="w-8 h-8 border-4 border-whisper-500 border-t-transparent rounded-full animate-spin mx-auto mb-4"
></div>
/>
<p class="text-ghost-300">Loading your dashboard...</p>
</div>
</div>
@ -39,10 +39,7 @@
<h1 class="text-2xl font-bold text-ghost-100 ethereal-text">
Welcome to Ghost Guild, {{ memberData?.name }}!
</h1>
<p class="text-ghost-300 mt-2">
Your membership is active and you're part of our cooperative
community.
</p>
<p class="text-ghost-300 mt-2">Your membership is active!</p>
</div>
<div class="flex-shrink-0" v-if="memberData?.avatar">
<img
@ -63,14 +60,14 @@
<div class="flex flex-wrap gap-4 text-sm">
<div class="bg-ghost-800 border border-ghost-600 px-4 py-2">
<span class="text-ghost-400">Circle:</span>
<span class="font-medium text-whisper-300 ml-1 capitalize">{{
<span class="text-ghost-200">Circle:</span>
<span class="font-medium text-stone-50 ml-1 capitalize">{{
memberData?.circle
}}</span>
</div>
<div class="bg-ghost-800 border border-ghost-600 px-4 py-2">
<span class="text-ghost-400">Contribution:</span>
<span class="font-medium text-whisper-300 ml-1"
<span class="text-ghost-200">Contribution:</span>
<span class="font-medium text-stone-50 ml-1"
>${{ memberData?.contributionTier }} CAD/month</span
>
</div>
@ -93,21 +90,10 @@
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3">
<UButton
disabled
to="/members?peerSupport=true"
variant="outline"
class="border-ghost-600 text-ghost-500 cursor-not-allowed justify-start"
class="border-ghost-600 text-ghost-200 hover:bg-ghost-800 hover:border-whisper-500 justify-start"
block
title="Coming soon"
>
Propose an Event
</UButton>
<UButton
disabled
variant="outline"
class="border-ghost-600 text-ghost-500 cursor-not-allowed justify-start"
block
title="Coming soon"
>
Book a Peer Session
</UButton>