chore/visual-fidelity-fixes #2

Merged
jennie merged 26 commits from chore/visual-fidelity-fixes into main 2026-04-30 12:36:10 +00:00
7 changed files with 19 additions and 21 deletions
Showing only changes of commit cb93f14160 - Show all commits

View file

@ -570,7 +570,7 @@ tbody td {
letter-spacing: 0.04em;
text-transform: uppercase;
color: var(--c-founder);
border: 1px dashed rgba(138, 68, 32, 0.3);
border: 1px dashed color-mix(in srgb, var(--ember) 30%, transparent);
padding: 2px 8px;
}
@ -583,7 +583,7 @@ tbody td {
font-size: 10px;
font-weight: 600;
color: var(--c-founder);
border: 1px dashed rgba(138, 68, 32, 0.4);
border: 1px dashed color-mix(in srgb, var(--ember) 40%, transparent);
border-radius: 50%;
}
@ -632,12 +632,12 @@ tbody td {
.status-upcoming {
color: var(--candle);
border-color: rgba(122, 90, 16, 0.3);
border-color: color-mix(in srgb, var(--candle) 30%, transparent);
}
.status-ongoing {
color: var(--green);
border-color: rgba(74, 106, 56, 0.3);
border-color: color-mix(in srgb, var(--green) 30%, transparent);
}
.status-past {
@ -647,7 +647,7 @@ tbody td {
.status-cancelled {
color: var(--ember);
border-color: rgba(138, 68, 32, 0.3);
border-color: color-mix(in srgb, var(--ember) 30%, transparent);
margin-top: 4px;
}

View file

@ -65,7 +65,7 @@
<span class="item-sub">{{ member.email }}</span>
</div>
<div class="item-meta">
<span class="badge" :class="member.circle">{{ member.circle }}</span>
<CircleBadge :circle="member.circle" />
<span class="item-date">{{ formatDate(member.createdAt) }}</span>
</div>
</div>

View file

@ -16,7 +16,7 @@
<p v-if="member" class="member-email">{{ member.email }}</p>
</div>
<div v-if="member" class="header-badges">
<span class="badge" :class="member.circle">{{ member.circle }}</span>
<CircleBadge :circle="member.circle" />
<span :class="statusClass(member.status)" class="status-badge">{{ member.status }}</span>
</div>
</div>

View file

@ -108,9 +108,7 @@
</td>
<td class="col-email">{{ member.email }}</td>
<td>
<span class="badge" :class="member.circle">{{
member.circle
}}</span>
<CircleBadge :circle="member.circle" />
</td>
<td class="col-mono">${{ member.contributionAmount ?? 0 }}/mo</td>
<td>
@ -1149,7 +1147,7 @@ th.sortable:hover {
text-transform: uppercase;
}
.badge.status-active {
color: var(--green, #3a6b3a);
color: var(--green);
border-color: rgba(58, 107, 58, 0.45);
}
.badge.status-pending_payment {
@ -1158,7 +1156,7 @@ th.sortable:hover {
}
.badge.status-suspended {
color: var(--ember);
border-color: rgba(138, 68, 32, 0.45);
border-color: color-mix(in srgb, var(--ember) 45%, transparent);
}
.badge.status-cancelled {
color: var(--text-faint);

View file

@ -643,8 +643,8 @@ tbody td {
}
.status-accepted {
color: var(--green, #4a7);
border-color: var(--green, #4a7);
color: var(--green);
border-color: var(--green);
}
.status-expired {
@ -671,7 +671,7 @@ tbody td {
/* ---- STATUS INDICATORS ---- */
.status-ok {
color: var(--green, #4a7);
color: var(--green);
font-size: 11px;
}

View file

@ -850,7 +850,7 @@ const exportSeriesData = () => {
font-size: 11px;
font-weight: 600;
color: var(--c-founder);
border: 1px dashed rgba(138, 68, 32, 0.4);
border: 1px dashed color-mix(in srgb, var(--ember) 40%, transparent);
border-radius: 50%;
flex-shrink: 0;
}
@ -931,12 +931,12 @@ const exportSeriesData = () => {
.status-active {
color: var(--green);
border-color: rgba(74, 106, 56, 0.3);
border-color: color-mix(in srgb, var(--green) 30%, transparent);
}
.status-upcoming {
color: var(--candle);
border-color: rgba(122, 90, 16, 0.3);
border-color: color-mix(in srgb, var(--candle) 30%, transparent);
}
.status-completed {
@ -946,7 +946,7 @@ const exportSeriesData = () => {
.status-ongoing {
color: var(--green);
border-color: rgba(74, 106, 56, 0.3);
border-color: color-mix(in srgb, var(--green) 30%, transparent);
}
/* ---- LINK BUTTONS ---- */

View file

@ -954,8 +954,8 @@ const applyBatchVisibility = async (hidden) => {
}
.sync-created {
color: var(--green, #4a7);
border-color: var(--green, #4a7);
color: var(--green);
border-color: var(--green);
}
.sync-updated {