Design token updates.
This commit is contained in:
parent
de3bcc479a
commit
c6b970a621
13 changed files with 198 additions and 211 deletions
|
|
@ -32,6 +32,8 @@
|
||||||
--parch-hover: #3a3025;
|
--parch-hover: #3a3025;
|
||||||
--parch-text: #ede4d0;
|
--parch-text: #ede4d0;
|
||||||
--parch-text-dim: #b8ae98;
|
--parch-text-dim: #b8ae98;
|
||||||
|
--parch-accent: #c4a448;
|
||||||
|
--parch-border: #b8a880;
|
||||||
--c-community: #7a4838;
|
--c-community: #7a4838;
|
||||||
--c-founder: #8a4420;
|
--c-founder: #8a4420;
|
||||||
--c-practitioner: #2a4650;
|
--c-practitioner: #2a4650;
|
||||||
|
|
@ -58,10 +60,9 @@
|
||||||
--text-bright: #d0c8b0;
|
--text-bright: #d0c8b0;
|
||||||
--text-dim: #958774;
|
--text-dim: #958774;
|
||||||
--text-faint: #8b7b62;
|
--text-faint: #8b7b62;
|
||||||
--parch: #ede4d0;
|
/* Parch family intentionally stays pinned to light-mode values —
|
||||||
--parch-hover: #d4c8a8;
|
inverted blocks are a consistent zine/terminal inset in both themes.
|
||||||
--parch-text: #2a2015;
|
See: --parch-accent and --parch-border for on-parch accents/borders. */
|
||||||
--parch-text-dim: #5a5040;
|
|
||||||
--c-community: #a06850;
|
--c-community: #a06850;
|
||||||
--c-founder: #c06030;
|
--c-founder: #c06030;
|
||||||
--c-practitioner: #4a7080;
|
--c-practitioner: #4a7080;
|
||||||
|
|
|
||||||
|
|
@ -1,92 +1,61 @@
|
||||||
<template>
|
<template>
|
||||||
<ClientOnly>
|
<ClientOnly>
|
||||||
<div v-if="!loading" class="onboarding-widget dashed-box no-hover">
|
<div v-if="!loading" class="onboarding-widget">
|
||||||
<!-- Welcome mode: onboarding in progress -->
|
<!-- Welcome mode: onboarding in progress -->
|
||||||
<template v-if="!isComplete">
|
<template v-if="!isComplete">
|
||||||
<div class="ow-header">
|
<div class="ow-prompt">> welcome</div>
|
||||||
<h3 class="ow-title">Welcome to Ghost Guild</h3>
|
<div class="ow-message">You are in the <strong>Ghost Guild</strong>. A few passages remain unexplored.</div>
|
||||||
<p class="ow-intro">Get oriented — here are a few things to explore as a new member.</p>
|
<div class="ow-hint">Next: {{ currentSuggestion.text }}</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ow-suggestion">
|
|
||||||
<span class="ow-suggestion-text">{{ currentSuggestion.text }}</span>
|
|
||||||
<NuxtLink
|
<NuxtLink
|
||||||
v-if="currentSuggestion.action && !currentSuggestion.isExternal"
|
v-if="currentSuggestion.action && !currentSuggestion.isExternal"
|
||||||
:to="currentSuggestion.action"
|
:to="currentSuggestion.action"
|
||||||
class="btn btn-primary ow-action"
|
class="ow-action"
|
||||||
>
|
>
|
||||||
{{ currentSuggestion.actionText }}
|
{{ currentSuggestion.actionText }} →
|
||||||
</NuxtLink>
|
</NuxtLink>
|
||||||
<a
|
<a
|
||||||
v-else-if="currentSuggestion.isExternal"
|
v-else-if="currentSuggestion.isExternal"
|
||||||
:href="currentSuggestion.action"
|
:href="currentSuggestion.action"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noopener"
|
rel="noopener"
|
||||||
class="btn btn-primary ow-action"
|
class="ow-action"
|
||||||
@click="trackGoal('wikiClicked')"
|
@click="trackGoal('wikiClicked')"
|
||||||
>
|
>
|
||||||
{{ currentSuggestion.actionText }}
|
{{ currentSuggestion.actionText }} →
|
||||||
</a>
|
</a>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ow-progress">
|
<div class="ow-progress">
|
||||||
<span class="ow-progress-label">{{ completedCount }} of 4</span>
|
<span class="ow-bar"><span class="ow-bar-fill">{{ barFill }}</span><span class="ow-bar-empty">{{ barEmpty }}</span></span>
|
||||||
<span class="ow-dots">
|
{{ completedCount }} of 4 explored
|
||||||
<span
|
|
||||||
v-for="i in 4"
|
|
||||||
:key="i"
|
|
||||||
class="ow-dot"
|
|
||||||
:class="{ 'ow-dot--done': i <= completedCount }"
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<!-- Suggestion mode: onboarding complete -->
|
<!-- Suggestion mode: onboarding complete -->
|
||||||
<template v-else>
|
<template v-else>
|
||||||
<!-- Empty state -->
|
<!-- Empty state -->
|
||||||
<div v-if="currentSuggestion.key === 'empty'" class="ow-empty">
|
<div v-if="currentSuggestion.key === 'empty'" class="ow-prompt">> look</div>
|
||||||
{{ currentSuggestion.text }}
|
<div v-if="currentSuggestion.key === 'empty'" class="ow-message ow-message--dim">{{ currentSuggestion.text }}</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Event recommendation -->
|
<!-- Recommendation (event, ecology, or wiki) -->
|
||||||
<div v-else-if="currentSuggestion.key === 'event'" class="ow-rec">
|
<template v-if="currentSuggestion.key !== 'empty'">
|
||||||
<div class="section-label">Suggested</div>
|
<div class="ow-prompt">> look</div>
|
||||||
<span class="ow-rec-text">{{ currentSuggestion.text }}</span>
|
<div class="ow-message">{{ currentSuggestion.text }}</div>
|
||||||
<NuxtLink
|
|
||||||
:to="currentSuggestion.action"
|
|
||||||
class="ow-rec-link"
|
|
||||||
>
|
|
||||||
{{ currentSuggestion.actionText }} →
|
|
||||||
</NuxtLink>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Ecology recommendation -->
|
|
||||||
<div v-else-if="currentSuggestion.key === 'ecology'" class="ow-rec">
|
|
||||||
<div class="section-label">Suggested</div>
|
|
||||||
<span class="ow-rec-text">{{ currentSuggestion.text }}</span>
|
|
||||||
<NuxtLink
|
|
||||||
:to="currentSuggestion.action"
|
|
||||||
class="ow-rec-link"
|
|
||||||
>
|
|
||||||
{{ currentSuggestion.actionText }} →
|
|
||||||
</NuxtLink>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Wiki recommendation -->
|
|
||||||
<div v-else-if="currentSuggestion.key === 'wiki'" class="ow-rec">
|
|
||||||
<div class="section-label">Suggested</div>
|
|
||||||
<span class="ow-rec-text">{{ currentSuggestion.text }}</span>
|
|
||||||
<a
|
<a
|
||||||
v-if="currentSuggestion.action"
|
v-if="currentSuggestion.isExternal && currentSuggestion.action"
|
||||||
:href="currentSuggestion.action"
|
:href="currentSuggestion.action"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noopener"
|
rel="noopener"
|
||||||
class="ow-rec-link"
|
class="ow-action"
|
||||||
>
|
>
|
||||||
{{ currentSuggestion.actionText }} →
|
{{ currentSuggestion.actionText }} →
|
||||||
</a>
|
</a>
|
||||||
</div>
|
<NuxtLink
|
||||||
|
v-else-if="currentSuggestion.action"
|
||||||
|
:to="currentSuggestion.action"
|
||||||
|
class="ow-action"
|
||||||
|
>
|
||||||
|
{{ currentSuggestion.actionText }} →
|
||||||
|
</NuxtLink>
|
||||||
|
</template>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
</ClientOnly>
|
</ClientOnly>
|
||||||
|
|
@ -100,115 +69,79 @@ const completedCount = computed(() => {
|
||||||
return [g.hasProfileTags, g.hasVisitedEvent, g.hasEngagedEcology, g.hasClickedWiki]
|
return [g.hasProfileTags, g.hasVisitedEvent, g.hasEngagedEcology, g.hasClickedWiki]
|
||||||
.filter(Boolean).length
|
.filter(Boolean).length
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const barFill = computed(() => '[' + '#'.repeat(completedCount.value * 2))
|
||||||
|
const barEmpty = computed(() => '-'.repeat((4 - completedCount.value) * 2) + ']')
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.onboarding-widget {
|
.onboarding-widget {
|
||||||
padding: 16px 20px;
|
padding: 16px 20px;
|
||||||
}
|
border-bottom: 1px dashed var(--parch-border);
|
||||||
|
background: var(--parch);
|
||||||
/* Welcome mode */
|
color: var(--parch-text);
|
||||||
.ow-header {
|
|
||||||
margin-bottom: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ow-title {
|
|
||||||
font-family: var(--font-display);
|
|
||||||
font-size: 16px;
|
|
||||||
font-weight: 600;
|
|
||||||
color: var(--text-bright);
|
|
||||||
margin: 0 0 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ow-intro {
|
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
color: var(--text-dim);
|
line-height: 1.7;
|
||||||
margin: 0;
|
|
||||||
line-height: 1.5;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.ow-suggestion {
|
.ow-prompt {
|
||||||
display: flex;
|
color: var(--parch-accent);
|
||||||
align-items: center;
|
margin-bottom: 6px;
|
||||||
justify-content: space-between;
|
|
||||||
gap: 12px;
|
|
||||||
padding: 10px 0;
|
|
||||||
border-top: 1px dashed var(--border);
|
|
||||||
flex-wrap: wrap;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.ow-suggestion-text {
|
.ow-message {
|
||||||
font-size: 12px;
|
color: var(--parch-text);
|
||||||
color: var(--text);
|
|
||||||
line-height: 1.5;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ow-action {
|
|
||||||
flex-shrink: 0;
|
|
||||||
font-size: 11px;
|
|
||||||
padding: 5px 14px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ow-progress {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
gap: 8px;
|
|
||||||
padding-top: 10px;
|
|
||||||
border-top: 1px dashed var(--border);
|
|
||||||
}
|
|
||||||
|
|
||||||
.ow-progress-label {
|
|
||||||
font-size: 10px;
|
|
||||||
letter-spacing: 0.08em;
|
|
||||||
text-transform: uppercase;
|
|
||||||
color: var(--text-faint);
|
|
||||||
}
|
|
||||||
|
|
||||||
.ow-dots {
|
|
||||||
display: flex;
|
|
||||||
gap: 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ow-dot {
|
|
||||||
width: 6px;
|
|
||||||
height: 6px;
|
|
||||||
border: 1px dashed var(--border);
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ow-dot--done {
|
|
||||||
background: var(--candle);
|
|
||||||
border-color: var(--candle);
|
|
||||||
border-style: solid;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Suggestion mode (graduated) */
|
|
||||||
.ow-rec {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ow-rec .section-label {
|
|
||||||
margin-bottom: 2px;
|
margin-bottom: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ow-rec-text {
|
.ow-message--dim {
|
||||||
font-size: 12px;
|
color: var(--parch-text-dim);
|
||||||
color: var(--text);
|
|
||||||
line-height: 1.5;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.ow-rec-link {
|
.ow-hint {
|
||||||
|
color: var(--parch-text-dim);
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
color: var(--candle);
|
|
||||||
margin-top: 2px;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.ow-empty {
|
.ow-action {
|
||||||
font-size: 12px;
|
display: inline-block;
|
||||||
color: var(--text-faint);
|
margin-top: 8px;
|
||||||
line-height: 1.5;
|
padding: 4px 12px;
|
||||||
|
border: 1px dashed rgba(237, 228, 208, 0.25);
|
||||||
|
color: var(--parch-accent);
|
||||||
|
font-size: 11px;
|
||||||
|
text-decoration: none;
|
||||||
|
letter-spacing: 0.04em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ow-action:hover {
|
||||||
|
border-color: var(--parch-accent);
|
||||||
|
border-style: solid;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ow-progress {
|
||||||
|
margin-top: 10px;
|
||||||
|
padding-top: 8px;
|
||||||
|
border-top: 1px dashed rgba(237, 228, 208, 0.12);
|
||||||
|
font-size: 11px;
|
||||||
|
color: var(--parch-text-dim);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ow-bar {
|
||||||
|
display: inline-flex;
|
||||||
|
gap: 0;
|
||||||
|
letter-spacing: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ow-bar-fill {
|
||||||
|
color: var(--parch-accent);
|
||||||
|
}
|
||||||
|
|
||||||
|
.ow-bar-empty {
|
||||||
|
color: rgba(237, 228, 208, 0.2);
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,7 @@
|
||||||
color: var(--parch-text);
|
color: var(--parch-text);
|
||||||
padding: 32px;
|
padding: 32px;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
border-bottom: 1px dashed var(--border);
|
border-bottom: 1px dashed var(--parch-border);
|
||||||
}
|
}
|
||||||
|
|
||||||
.parchment-inset :deep(h2) {
|
.parchment-inset :deep(h2) {
|
||||||
|
|
@ -30,6 +30,6 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.parchment-inset :deep(a) {
|
.parchment-inset :deep(a) {
|
||||||
color: var(--candle-faint);
|
color: var(--parch-accent);
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -87,13 +87,6 @@ export function useOnboarding(options = {}) {
|
||||||
return buildRecommendation(selected, items[0])
|
return buildRecommendation(selected, items[0])
|
||||||
}
|
}
|
||||||
|
|
||||||
// Fallback to first non-empty category (shouldn't happen since we filtered)
|
|
||||||
for (const cat of cats) {
|
|
||||||
if (recommendations.value[cat]?.length > 0) {
|
|
||||||
return buildRecommendation(cat, recommendations.value[cat][0])
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return { key: 'empty', text: 'No suggestions right now' }
|
return { key: 'empty', text: 'No suggestions right now' }
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -240,7 +240,7 @@ useHead({
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.loading-state {
|
.loading-state {
|
||||||
padding: 60px 24px;
|
padding: 48px 24px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
color: var(--text-faint);
|
color: var(--text-faint);
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
|
|
@ -256,7 +256,7 @@ useHead({
|
||||||
}
|
}
|
||||||
|
|
||||||
.filter-select {
|
.filter-select {
|
||||||
font-family: "Commit Mono", monospace;
|
font-family: inherit;
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
padding: 5px 10px;
|
padding: 5px 10px;
|
||||||
border: 1px dashed var(--border);
|
border: 1px dashed var(--border);
|
||||||
|
|
@ -266,13 +266,14 @@ useHead({
|
||||||
outline: none;
|
outline: none;
|
||||||
-webkit-appearance: none;
|
-webkit-appearance: none;
|
||||||
appearance: none;
|
appearance: none;
|
||||||
background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%238a7e6a' stroke-width='1.2'/%3E%3C/svg%3E");
|
background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23b8a880' stroke-width='1.2'/%3E%3C/svg%3E");
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-position: right 8px center;
|
background-position: right 8px center;
|
||||||
padding-right: 26px;
|
padding-right: 26px;
|
||||||
}
|
}
|
||||||
.filter-select:focus {
|
.filter-select:focus {
|
||||||
border-color: var(--candle-faint);
|
border-color: var(--candle-faint);
|
||||||
|
border-style: solid;
|
||||||
}
|
}
|
||||||
|
|
||||||
.connections-section {
|
.connections-section {
|
||||||
|
|
@ -329,7 +330,6 @@ useHead({
|
||||||
|
|
||||||
.cc-name {
|
.cc-name {
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
font-weight: 600;
|
|
||||||
color: var(--text-bright);
|
color: var(--text-bright);
|
||||||
}
|
}
|
||||||
.cc-name a {
|
.cc-name a {
|
||||||
|
|
@ -380,7 +380,6 @@ useHead({
|
||||||
|
|
||||||
.match-tag {
|
.match-tag {
|
||||||
color: var(--text);
|
color: var(--text);
|
||||||
font-weight: 600;
|
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -414,11 +413,11 @@ useHead({
|
||||||
.cc-slack {
|
.cc-slack {
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
color: var(--candle-dim);
|
color: var(--candle-dim);
|
||||||
font-family: "Commit Mono", monospace;
|
font-family: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-action {
|
.text-action {
|
||||||
font-family: "Commit Mono", monospace;
|
font-family: inherit;
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
color: var(--text-faint);
|
color: var(--text-faint);
|
||||||
background: none;
|
background: none;
|
||||||
|
|
@ -440,8 +439,8 @@ useHead({
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
.empty-title {
|
.empty-title {
|
||||||
font-family: "Brygada 1918", serif;
|
font-family: var(--font-display);
|
||||||
font-size: 18px;
|
font-size: 16px;
|
||||||
color: var(--text-dim);
|
color: var(--text-dim);
|
||||||
margin-bottom: 6px;
|
margin-bottom: 6px;
|
||||||
}
|
}
|
||||||
|
|
@ -463,13 +462,13 @@ useHead({
|
||||||
.filter-bar {
|
.filter-bar {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: stretch;
|
align-items: stretch;
|
||||||
padding: 14px 20px;
|
padding: 12px 20px;
|
||||||
}
|
}
|
||||||
.connections-section {
|
.connections-section {
|
||||||
padding: 16px 20px;
|
padding: 16px 20px;
|
||||||
}
|
}
|
||||||
.connection-card {
|
.connection-card {
|
||||||
padding: 14px 16px;
|
padding: 12px 16px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -75,7 +75,7 @@
|
||||||
:to="`/series/${series._id}`"
|
:to="`/series/${series._id}`"
|
||||||
class="series-box"
|
class="series-box"
|
||||||
>
|
>
|
||||||
<h3>{{ series.title }}</h3>
|
<h2>{{ series.title }}</h2>
|
||||||
<p class="series-desc">{{ series.description }}</p>
|
<p class="series-desc">{{ series.description }}</p>
|
||||||
<div class="series-meta">
|
<div class="series-meta">
|
||||||
<span
|
<span
|
||||||
|
|
@ -108,7 +108,7 @@
|
||||||
<div class="full-section">
|
<div class="full-section">
|
||||||
<div class="section-label">Have an idea?</div>
|
<div class="section-label">Have an idea?</div>
|
||||||
<DashedBox>
|
<DashedBox>
|
||||||
<h3>Propose an Event</h3>
|
<h2>Propose an Event</h2>
|
||||||
<p>
|
<p>
|
||||||
Members can propose events for any circle. Workshops, social hangs,
|
Members can propose events for any circle. Workshops, social hangs,
|
||||||
talks, or anything else that serves the community.
|
talks, or anything else that serves the community.
|
||||||
|
|
@ -187,11 +187,11 @@ const isAlmostFull = (event) => {
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.hero {
|
.hero {
|
||||||
padding: 32px 32px 24px;
|
padding: 32px 28px 24px;
|
||||||
border-bottom: 1px dashed var(--border);
|
border-bottom: 1px dashed var(--border);
|
||||||
}
|
}
|
||||||
.hero h1 {
|
.hero h1 {
|
||||||
font-family: "Brygada 1918", serif;
|
font-family: var(--font-display);
|
||||||
font-size: 28px;
|
font-size: 28px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
color: var(--text-bright);
|
color: var(--text-bright);
|
||||||
|
|
@ -207,7 +207,7 @@ const isAlmostFull = (event) => {
|
||||||
|
|
||||||
/* ---- EVENT LIST ---- */
|
/* ---- EVENT LIST ---- */
|
||||||
.event-list-full {
|
.event-list-full {
|
||||||
padding: 0 32px;
|
padding: 0 28px;
|
||||||
border-bottom: 1px dashed var(--border);
|
border-bottom: 1px dashed var(--border);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -272,7 +272,7 @@ const isAlmostFull = (event) => {
|
||||||
}
|
}
|
||||||
|
|
||||||
.cancelled-tag {
|
.cancelled-tag {
|
||||||
font-size: 9px;
|
font-size: 10px;
|
||||||
letter-spacing: 0.07em;
|
letter-spacing: 0.07em;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
color: var(--ember);
|
color: var(--ember);
|
||||||
|
|
@ -326,7 +326,7 @@ const isAlmostFull = (event) => {
|
||||||
gap: 4px;
|
gap: 4px;
|
||||||
}
|
}
|
||||||
.members-badge {
|
.members-badge {
|
||||||
font-size: 9px;
|
font-size: 10px;
|
||||||
letter-spacing: 0.07em;
|
letter-spacing: 0.07em;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
color: var(--text-faint);
|
color: var(--text-faint);
|
||||||
|
|
@ -338,7 +338,7 @@ const isAlmostFull = (event) => {
|
||||||
|
|
||||||
/* ---- FULL SECTION ---- */
|
/* ---- FULL SECTION ---- */
|
||||||
.full-section {
|
.full-section {
|
||||||
padding: 32px;
|
padding: 32px 28px;
|
||||||
border-bottom: 1px dashed var(--border);
|
border-bottom: 1px dashed var(--border);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -350,7 +350,7 @@ const isAlmostFull = (event) => {
|
||||||
border: 1px dashed var(--border);
|
border: 1px dashed var(--border);
|
||||||
}
|
}
|
||||||
.series-box {
|
.series-box {
|
||||||
padding: 20px;
|
padding: 20px 24px;
|
||||||
border-right: 1px dashed var(--border);
|
border-right: 1px dashed var(--border);
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
transition: background 0.15s;
|
transition: background 0.15s;
|
||||||
|
|
@ -361,8 +361,8 @@ const isAlmostFull = (event) => {
|
||||||
.series-box:hover {
|
.series-box:hover {
|
||||||
background: var(--surface-hover);
|
background: var(--surface-hover);
|
||||||
}
|
}
|
||||||
.series-box h3 {
|
.series-box h2 {
|
||||||
font-family: "Brygada 1918", serif;
|
font-family: var(--font-display);
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
color: var(--text-bright);
|
color: var(--text-bright);
|
||||||
|
|
@ -383,8 +383,8 @@ const isAlmostFull = (event) => {
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- PROPOSE ---- */
|
/* ---- PROPOSE ---- */
|
||||||
.full-section h3 {
|
.full-section h2 {
|
||||||
font-family: "Brygada 1918", serif;
|
font-family: var(--font-display);
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
color: var(--text-bright);
|
color: var(--text-bright);
|
||||||
|
|
@ -431,6 +431,12 @@ const isAlmostFull = (event) => {
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 768px) {
|
@media (max-width: 768px) {
|
||||||
|
.hero,
|
||||||
|
.event-list-full,
|
||||||
|
.full-section {
|
||||||
|
padding-left: 20px;
|
||||||
|
padding-right: 20px;
|
||||||
|
}
|
||||||
.event-row {
|
.event-row {
|
||||||
grid-template-columns: 70px 1fr;
|
grid-template-columns: 70px 1fr;
|
||||||
gap: 8px;
|
gap: 8px;
|
||||||
|
|
|
||||||
|
|
@ -860,7 +860,7 @@ onUnmounted(() => {
|
||||||
.form-submit {
|
.form-submit {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
background: var(--parch);
|
background: var(--parch);
|
||||||
color: var(--candle-faint);
|
color: var(--parch-accent);
|
||||||
font-family: 'Commit Mono', monospace;
|
font-family: 'Commit Mono', monospace;
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
|
|
@ -875,7 +875,7 @@ onUnmounted(() => {
|
||||||
.form-submit:hover {
|
.form-submit:hover {
|
||||||
background: var(--parch-hover);
|
background: var(--parch-hover);
|
||||||
border-color: var(--parch-hover);
|
border-color: var(--parch-hover);
|
||||||
color: var(--candle-dim);
|
color: var(--parch-text);
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
.form-submit:disabled {
|
.form-submit:disabled {
|
||||||
|
|
|
||||||
|
|
@ -89,6 +89,7 @@
|
||||||
<div class="ci-header">
|
<div class="ci-header">
|
||||||
<strong>How to Subscribe to Your Calendar</strong>
|
<strong>How to Subscribe to Your Calendar</strong>
|
||||||
<button
|
<button
|
||||||
|
type="button"
|
||||||
@click="showCalendarInstructions = false"
|
@click="showCalendarInstructions = false"
|
||||||
class="ci-close"
|
class="ci-close"
|
||||||
>
|
>
|
||||||
|
|
@ -435,7 +436,7 @@ useHead({
|
||||||
}
|
}
|
||||||
|
|
||||||
.unauth-state h2 {
|
.unauth-state h2 {
|
||||||
font-family: "Brygada 1918", serif;
|
font-family: var(--font-display);
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
color: var(--text-bright);
|
color: var(--text-bright);
|
||||||
|
|
@ -519,7 +520,7 @@ useHead({
|
||||||
|
|
||||||
/* ---- CALENDAR BUTTON ---- */
|
/* ---- CALENDAR BUTTON ---- */
|
||||||
.calendar-btn {
|
.calendar-btn {
|
||||||
font-family: "Commit Mono", monospace;
|
font-family: inherit;
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
color: var(--candle-dim);
|
color: var(--candle-dim);
|
||||||
background: none;
|
background: none;
|
||||||
|
|
@ -603,7 +604,7 @@ useHead({
|
||||||
/* ---- QUICK ACTIONS ---- */
|
/* ---- QUICK ACTIONS ---- */
|
||||||
.quick-action {
|
.quick-action {
|
||||||
border: 1px dashed var(--border);
|
border: 1px dashed var(--border);
|
||||||
padding: 14px 20px;
|
padding: 12px 20px;
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
transition: border-color 0.2s;
|
transition: border-color 0.2s;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
@ -697,7 +698,7 @@ useHead({
|
||||||
}
|
}
|
||||||
|
|
||||||
.content-block {
|
.content-block {
|
||||||
padding: 20px;
|
padding: 20px 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.event-item {
|
.event-item {
|
||||||
|
|
|
||||||
|
|
@ -503,7 +503,7 @@ useHead({
|
||||||
.row-2 {
|
.row-2 {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: 1fr 1fr;
|
grid-template-columns: 1fr 1fr;
|
||||||
gap: 14px;
|
gap: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- PRIVACY TOGGLE SPACING ---- */
|
/* ---- PRIVACY TOGGLE SPACING ---- */
|
||||||
|
|
@ -615,7 +615,7 @@ useHead({
|
||||||
/* ---- CONNECTIONS PANEL ---- */
|
/* ---- CONNECTIONS PANEL ---- */
|
||||||
.connections-panel {
|
.connections-panel {
|
||||||
border: 1px dashed var(--border);
|
border: 1px dashed var(--border);
|
||||||
padding: 12px 14px;
|
padding: 12px 16px;
|
||||||
margin-top: 4px;
|
margin-top: 4px;
|
||||||
margin-bottom: 12px;
|
margin-bottom: 12px;
|
||||||
background: var(--surface);
|
background: var(--surface);
|
||||||
|
|
@ -630,7 +630,7 @@ useHead({
|
||||||
/* ---- SAVE BAR ---- */
|
/* ---- SAVE BAR ---- */
|
||||||
.save-bar {
|
.save-bar {
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
padding: 24px 28px 24px;
|
padding: 24px 28px;
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
border-top: 1px dashed var(--border);
|
border-top: 1px dashed var(--border);
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
@ -644,7 +644,7 @@ useHead({
|
||||||
}
|
}
|
||||||
|
|
||||||
.save-msg-ok {
|
.save-msg-ok {
|
||||||
color: var(--green, var(--candle));
|
color: var(--green);
|
||||||
}
|
}
|
||||||
|
|
||||||
.save-msg-err {
|
.save-msg-err {
|
||||||
|
|
|
||||||
|
|
@ -468,6 +468,7 @@ useHead({
|
||||||
/* Bio: parch (inverted) block */
|
/* Bio: parch (inverted) block */
|
||||||
.profile-section--parch {
|
.profile-section--parch {
|
||||||
background: var(--parch);
|
background: var(--parch);
|
||||||
|
border-bottom-color: var(--parch-border);
|
||||||
}
|
}
|
||||||
.profile-section--parch .section-label {
|
.profile-section--parch .section-label {
|
||||||
color: var(--parch-text-dim);
|
color: var(--parch-text-dim);
|
||||||
|
|
@ -476,7 +477,7 @@ useHead({
|
||||||
color: var(--parch-text);
|
color: var(--parch-text);
|
||||||
}
|
}
|
||||||
.profile-section--parch .profile-bio :deep(a) {
|
.profile-section--parch .profile-bio :deep(a) {
|
||||||
color: var(--candle-faint);
|
color: var(--parch-accent);
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
text-underline-offset: 2px;
|
text-underline-offset: 2px;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
52
scripts/seed-welcome-tester.cjs
Normal file
52
scripts/seed-welcome-tester.cjs
Normal file
|
|
@ -0,0 +1,52 @@
|
||||||
|
/**
|
||||||
|
* Seed a fresh member in the right state to test the Welcome Workflow.
|
||||||
|
* All onboarding flags default to false/null, no craft tags, no ecology topics.
|
||||||
|
*
|
||||||
|
* Usage: node scripts/seed-welcome-tester.js
|
||||||
|
* Then pick "Welcome Tester" from the dev login dropdown.
|
||||||
|
*/
|
||||||
|
require("dotenv").config();
|
||||||
|
const mongoose = require("mongoose");
|
||||||
|
|
||||||
|
async function main() {
|
||||||
|
await mongoose.connect(process.env.MONGODB_URI);
|
||||||
|
|
||||||
|
const Member = mongoose.connection.model(
|
||||||
|
"Member",
|
||||||
|
new mongoose.Schema({}, { strict: false, collection: "members" }),
|
||||||
|
);
|
||||||
|
|
||||||
|
const email = "welcome-tester@ghostguild.dev";
|
||||||
|
|
||||||
|
const result = await Member.findOneAndUpdate(
|
||||||
|
{ email },
|
||||||
|
{
|
||||||
|
$set: {
|
||||||
|
name: "Welcome Tester",
|
||||||
|
email,
|
||||||
|
circle: "community",
|
||||||
|
contributionTier: "0",
|
||||||
|
role: "member",
|
||||||
|
status: "active",
|
||||||
|
craftTags: [],
|
||||||
|
communityEcology: { topics: [], offerPeerSupport: false },
|
||||||
|
onboarding: {
|
||||||
|
completedAt: null,
|
||||||
|
eventPageVisited: false,
|
||||||
|
ecologyPageVisited: false,
|
||||||
|
wikiClicked: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{ upsert: true, new: true },
|
||||||
|
);
|
||||||
|
|
||||||
|
console.log(`Seeded member: ${result.name} (${result.email}) — _id: ${result._id}`);
|
||||||
|
console.log("All onboarding flags reset. Pick 'Welcome Tester' from the dev dropdown.");
|
||||||
|
await mongoose.disconnect();
|
||||||
|
}
|
||||||
|
|
||||||
|
main().catch((err) => {
|
||||||
|
console.error(err);
|
||||||
|
process.exit(1);
|
||||||
|
});
|
||||||
|
|
@ -27,5 +27,6 @@ export default defineEventHandler(async (event) => {
|
||||||
notifications: member.notifications,
|
notifications: member.notifications,
|
||||||
privacy: member.privacy,
|
privacy: member.privacy,
|
||||||
createdAt: member.createdAt,
|
createdAt: member.createdAt,
|
||||||
|
onboarding: member.onboarding,
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -13,7 +13,7 @@ const wikiArticleSchema = new mongoose.Schema(
|
||||||
lastSyncedAt: Date,
|
lastSyncedAt: Date,
|
||||||
outlineUpdatedAt: Date
|
outlineUpdatedAt: Date
|
||||||
},
|
},
|
||||||
{ timestamps: true }
|
{ timestamps: true, suppressReservedKeysWarning: true }
|
||||||
)
|
)
|
||||||
|
|
||||||
export default mongoose.models.WikiArticle ||
|
export default mongoose.models.WikiArticle ||
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue