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

Readying for design

Browse source
This commit is contained in:
Jennie Robinson Faber 2026-03-04 18:24:20 +00:00
parent d73256ca2b
commit fadf473dde
50 changed files with 1478 additions and 1259 deletions
Download patch file Download diff file Expand all files Collapse all files

45
app/pages/welcome.vue
View file

@ -3,7 +3,6 @@
<PageHeader
title="Welcome to Ghost Guild"
subtitle="You're officially part of the community!"
theme="purple"
size="large"
/>
@ -26,7 +25,7 @@
class="w-full h-full object-contain"
/>
</div>
<h2 class="text-2xl font-bold text-guild-100 mb-4">
<h2 class="text-display font-bold text-guild-100 mb-4">
Hey {{ memberData?.name || "there" }}!
</h2>
<p class="text-lg text-guild-300 max-w-2xl mx-auto">
@ -38,15 +37,15 @@
<div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
<div class="p-6 bg-guild-800/50 rounded-xl border border-guild-700">
<div
class="w-12 h-12 bg-purple-500/20 rounded-lg flex items-center justify-center mb-4"
class="w-12 h-12 bg-candlelight-500/20 rounded-lg flex items-center justify-center mb-4"
>
<Icon
name="heroicons:user-circle"
class="w-6 h-6 text-purple-400"
class="w-6 h-6 text-candlelight-400"
/>
</div>
<h3 class="font-semibold text-guild-100 mb-2">
1. Complete Your Profile
<span class="text-ui-label text-candlelight-400 mr-2">1.</span>Complete Your Profile
</h3>
<p class="text-sm text-guild-400 mb-4">
Tell the community about yourself, your skills, and what you're
@ -59,15 +58,15 @@
<div class="p-6 bg-guild-800/50 rounded-xl border border-guild-700">
<div
class="w-12 h-12 bg-blue-500/20 rounded-lg flex items-center justify-center mb-4"
class="w-12 h-12 bg-candlelight-500/20 rounded-lg flex items-center justify-center mb-4"
>
<Icon
name="heroicons:calendar-days"
class="w-6 h-6 text-blue-400"
class="w-6 h-6 text-candlelight-400"
/>
</div>
<h3 class="font-semibold text-guild-100 mb-2">
2. Join an Event
<span class="text-ui-label text-candlelight-400 mr-2">2.</span>Join an Event
</h3>
<p class="text-sm text-guild-400 mb-4">
From workshops to game nights, events are the heart of our
@ -80,12 +79,12 @@
<div class="p-6 bg-guild-800/50 rounded-xl border border-guild-700">
<div
class="w-12 h-12 bg-green-500/20 rounded-lg flex items-center justify-center mb-4"
class="w-12 h-12 bg-candlelight-500/20 rounded-lg flex items-center justify-center mb-4"
>
<Icon name="heroicons:users" class="w-6 h-6 text-green-400" />
<Icon name="heroicons:users" class="w-6 h-6 text-candlelight-400" />
</div>
<h3 class="font-semibold text-guild-100 mb-2">
3. Meet the Community
<span class="text-ui-label text-candlelight-400 mr-2">3.</span>Meet the Community
</h3>
<p class="text-sm text-guild-400 mb-4">
Connect with other members and find peers for support and
@ -101,7 +100,7 @@
<div
class="p-8 bg-guild-800/30 rounded-2xl border border-guild-700 mb-16"
>
<h3 class="text-xl font-bold text-guild-100 mb-4">
<h3 class="text-display-sm font-bold text-guild-100 mb-4">
Understanding Circles
</h3>
<p class="text-guild-300 mb-6">
@ -115,7 +114,7 @@
class="p-4 rounded-lg"
:class="
memberData?.circle === 'community'
? 'bg-purple-500/20 border border-purple-500/50'
? 'circle-surface-community border border-[var(--color-circle-community)]/50'
: 'bg-guild-800/50'
"
>
@ -123,7 +122,7 @@
Community Circle
<span
v-if="memberData?.circle === 'community'"
class="text-purple-400 text-sm ml-2"
class="text-candlelight-400 text-sm ml-2"
>← You're here</span
>
</h4>
@ -137,7 +136,7 @@
class="p-4 rounded-lg"
:class="
memberData?.circle === 'founder'
? 'bg-purple-500/20 border border-purple-500/50'
? 'circle-surface-founder border border-[var(--color-circle-founder)]/50'
: 'bg-guild-800/50'
"
>
@ -145,7 +144,7 @@
Founder Circle
<span
v-if="memberData?.circle === 'founder'"
class="text-purple-400 text-sm ml-2"
class="text-candlelight-400 text-sm ml-2"
>← You're here</span
>
</h4>
@ -159,7 +158,7 @@
class="p-4 rounded-lg"
:class="
memberData?.circle === 'practitioner'
? 'bg-purple-500/20 border border-purple-500/50'
? 'circle-surface-practitioner border border-[var(--color-circle-practitioner)]/50'
: 'bg-guild-800/50'
"
>
@ -167,7 +166,7 @@
Practitioner Circle
<span
v-if="memberData?.circle === 'practitioner'"
class="text-purple-400 text-sm ml-2"
class="text-candlelight-400 text-sm ml-2"
>← You're here</span
>
</h4>
@ -183,17 +182,17 @@
<div
class="p-8 bg-guild-800/30 rounded-2xl border border-guild-700 mb-16"
>
<h3 class="text-xl font-bold text-guild-100 mb-4">
<h3 class="text-display-sm font-bold text-guild-100 mb-4">
Resources & Support
</h3>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="flex items-start gap-4">
<div
class="w-10 h-10 bg-amber-500/20 rounded-lg flex items-center justify-center flex-shrink-0"
class="w-10 h-10 bg-candlelight-500/20 rounded-lg flex items-center justify-center flex-shrink-0"
>
<Icon
name="heroicons:book-open"
class="w-5 h-5 text-amber-400"
class="w-5 h-5 text-candlelight-400"
/>
</div>
<div>
@ -218,11 +217,11 @@
<div class="flex items-start gap-4">
<div
class="w-10 h-10 bg-pink-500/20 rounded-lg flex items-center justify-center flex-shrink-0"
class="w-10 h-10 bg-ember-500/20 rounded-lg flex items-center justify-center flex-shrink-0"
>
<Icon
name="heroicons:chat-bubble-left-right"
class="w-5 h-5 text-pink-400"
class="w-5 h-5 text-ember-400"
/>
</div>
<div>