chore/visual-fidelity-fixes #2
7 changed files with 19 additions and 21 deletions
|
|
@ -570,7 +570,7 @@ tbody td {
|
||||||
letter-spacing: 0.04em;
|
letter-spacing: 0.04em;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
color: var(--c-founder);
|
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;
|
padding: 2px 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -583,7 +583,7 @@ tbody td {
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
color: var(--c-founder);
|
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%;
|
border-radius: 50%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -632,12 +632,12 @@ tbody td {
|
||||||
|
|
||||||
.status-upcoming {
|
.status-upcoming {
|
||||||
color: var(--candle);
|
color: var(--candle);
|
||||||
border-color: rgba(122, 90, 16, 0.3);
|
border-color: color-mix(in srgb, var(--candle) 30%, transparent);
|
||||||
}
|
}
|
||||||
|
|
||||||
.status-ongoing {
|
.status-ongoing {
|
||||||
color: var(--green);
|
color: var(--green);
|
||||||
border-color: rgba(74, 106, 56, 0.3);
|
border-color: color-mix(in srgb, var(--green) 30%, transparent);
|
||||||
}
|
}
|
||||||
|
|
||||||
.status-past {
|
.status-past {
|
||||||
|
|
@ -647,7 +647,7 @@ tbody td {
|
||||||
|
|
||||||
.status-cancelled {
|
.status-cancelled {
|
||||||
color: var(--ember);
|
color: var(--ember);
|
||||||
border-color: rgba(138, 68, 32, 0.3);
|
border-color: color-mix(in srgb, var(--ember) 30%, transparent);
|
||||||
margin-top: 4px;
|
margin-top: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -65,7 +65,7 @@
|
||||||
<span class="item-sub">{{ member.email }}</span>
|
<span class="item-sub">{{ member.email }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="item-meta">
|
<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>
|
<span class="item-date">{{ formatDate(member.createdAt) }}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -16,7 +16,7 @@
|
||||||
<p v-if="member" class="member-email">{{ member.email }}</p>
|
<p v-if="member" class="member-email">{{ member.email }}</p>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="member" class="header-badges">
|
<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>
|
<span :class="statusClass(member.status)" class="status-badge">{{ member.status }}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -108,9 +108,7 @@
|
||||||
</td>
|
</td>
|
||||||
<td class="col-email">{{ member.email }}</td>
|
<td class="col-email">{{ member.email }}</td>
|
||||||
<td>
|
<td>
|
||||||
<span class="badge" :class="member.circle">{{
|
<CircleBadge :circle="member.circle" />
|
||||||
member.circle
|
|
||||||
}}</span>
|
|
||||||
</td>
|
</td>
|
||||||
<td class="col-mono">${{ member.contributionAmount ?? 0 }}/mo</td>
|
<td class="col-mono">${{ member.contributionAmount ?? 0 }}/mo</td>
|
||||||
<td>
|
<td>
|
||||||
|
|
@ -1149,7 +1147,7 @@ th.sortable:hover {
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
}
|
}
|
||||||
.badge.status-active {
|
.badge.status-active {
|
||||||
color: var(--green, #3a6b3a);
|
color: var(--green);
|
||||||
border-color: rgba(58, 107, 58, 0.45);
|
border-color: rgba(58, 107, 58, 0.45);
|
||||||
}
|
}
|
||||||
.badge.status-pending_payment {
|
.badge.status-pending_payment {
|
||||||
|
|
@ -1158,7 +1156,7 @@ th.sortable:hover {
|
||||||
}
|
}
|
||||||
.badge.status-suspended {
|
.badge.status-suspended {
|
||||||
color: var(--ember);
|
color: var(--ember);
|
||||||
border-color: rgba(138, 68, 32, 0.45);
|
border-color: color-mix(in srgb, var(--ember) 45%, transparent);
|
||||||
}
|
}
|
||||||
.badge.status-cancelled {
|
.badge.status-cancelled {
|
||||||
color: var(--text-faint);
|
color: var(--text-faint);
|
||||||
|
|
|
||||||
|
|
@ -643,8 +643,8 @@ tbody td {
|
||||||
}
|
}
|
||||||
|
|
||||||
.status-accepted {
|
.status-accepted {
|
||||||
color: var(--green, #4a7);
|
color: var(--green);
|
||||||
border-color: var(--green, #4a7);
|
border-color: var(--green);
|
||||||
}
|
}
|
||||||
|
|
||||||
.status-expired {
|
.status-expired {
|
||||||
|
|
@ -671,7 +671,7 @@ tbody td {
|
||||||
|
|
||||||
/* ---- STATUS INDICATORS ---- */
|
/* ---- STATUS INDICATORS ---- */
|
||||||
.status-ok {
|
.status-ok {
|
||||||
color: var(--green, #4a7);
|
color: var(--green);
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -850,7 +850,7 @@ const exportSeriesData = () => {
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
color: var(--c-founder);
|
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%;
|
border-radius: 50%;
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
}
|
}
|
||||||
|
|
@ -931,12 +931,12 @@ const exportSeriesData = () => {
|
||||||
|
|
||||||
.status-active {
|
.status-active {
|
||||||
color: var(--green);
|
color: var(--green);
|
||||||
border-color: rgba(74, 106, 56, 0.3);
|
border-color: color-mix(in srgb, var(--green) 30%, transparent);
|
||||||
}
|
}
|
||||||
|
|
||||||
.status-upcoming {
|
.status-upcoming {
|
||||||
color: var(--candle);
|
color: var(--candle);
|
||||||
border-color: rgba(122, 90, 16, 0.3);
|
border-color: color-mix(in srgb, var(--candle) 30%, transparent);
|
||||||
}
|
}
|
||||||
|
|
||||||
.status-completed {
|
.status-completed {
|
||||||
|
|
@ -946,7 +946,7 @@ const exportSeriesData = () => {
|
||||||
|
|
||||||
.status-ongoing {
|
.status-ongoing {
|
||||||
color: var(--green);
|
color: var(--green);
|
||||||
border-color: rgba(74, 106, 56, 0.3);
|
border-color: color-mix(in srgb, var(--green) 30%, transparent);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- LINK BUTTONS ---- */
|
/* ---- LINK BUTTONS ---- */
|
||||||
|
|
|
||||||
|
|
@ -954,8 +954,8 @@ const applyBatchVisibility = async (hidden) => {
|
||||||
}
|
}
|
||||||
|
|
||||||
.sync-created {
|
.sync-created {
|
||||||
color: var(--green, #4a7);
|
color: var(--green);
|
||||||
border-color: var(--green, #4a7);
|
border-color: var(--green);
|
||||||
}
|
}
|
||||||
|
|
||||||
.sync-updated {
|
.sync-updated {
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue