jbourdon/social-media
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: centralize frontend Vuetify styling
All checks were successful
deploy-socialize / image (push) Successful in 50s
Details
deploy-socialize / deploy (push) Successful in 19s
Details

Browse Source
This commit is contained in:
Jonathan Bourdon
2026-05-08 13:45:42 -04:00
parent e81c9f42c9
commit 1ca6ab7117
54 changed files with 1461 additions and 1304 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
frontend/src/features/content/components/ContentApprovalPanel.vue
View File

@@ -255,7 +255,7 @@
class="approval-step"
:class="`is-${step.status}`"
>
<button
<v-btn variant="text" :ripple="false"
class="step-circle"
type="button"
:disabled="step.kind !== 'approval' || !canRecordDecision(step.approval) || isSubmittingDecision"
@@ -263,7 +263,7 @@
@click="submitDecision(step.approval.id)"
>
{{ index + 1 }}
</button>
</v-btn>
<div class="step-popover">
<div class="popover-heading">
@@ -342,7 +342,7 @@
.popover-heading strong,
.popover-meta strong,
.decision-row strong {
color: #172033;
color: var(--app-color-on-surface);
}
.approval-empty span,
@@ -352,7 +352,7 @@
.decision-row span,
.decision-row small {
@apply text-sm leading-6;
color: #526178;
color: var(--app-text-muted);
}
.approval-stepper,
@@ -378,9 +378,9 @@
.step-circle {
@apply relative z-10 flex h-9 w-9 items-center justify-center rounded-full border text-xs font-black transition;
background: #fffdf8;
background: var(--app-color-surface);
border-color: rgba(23, 32, 51, 0.16);
color: #526178;
color: var(--app-text-muted);
}
button.step-circle:not(:disabled) {
@@ -397,37 +397,37 @@
}
.step-circle.is-muted {
background: rgba(23, 32, 51, 0.04);
background: var(--app-control-subtle);
}
.approval-step.is-approved .step-circle {
background: #0f766e;
border-color: #0f766e;
color: #fffaf2;
background: var(--app-color-on-tertiary);
border-color: var(--app-color-on-tertiary);
color: var(--app-color-on-primary);
}
.approval-step.is-scheduled .step-circle {
background: #b45309;
border-color: #b45309;
color: #fffaf2;
color: var(--app-color-on-primary);
}
.approval-step.is-published .step-circle {
background: #7c3aed;
border-color: #7c3aed;
color: #fffaf2;
color: var(--app-color-on-primary);
}
.approval-step.is-current .step-circle {
background: #172033;
border-color: #172033;
color: #fffaf2;
background: var(--app-color-on-surface);
border-color: var(--app-color-on-surface);
color: var(--app-color-on-primary);
}
.step-popover {
@apply pointer-events-none absolute left-[calc(100%+0.75rem)] top-0 z-20 flex w-[18rem] translate-y-2 flex-col gap-3 rounded-[1rem] border p-4 opacity-0 shadow-xl transition;
background: #ffffff;
border-color: rgba(23, 32, 51, 0.12);
border-color: var(--app-border-subtle);
}
.approval-step:hover .step-popover,
@@ -447,7 +447,7 @@
.decision-row {
@apply flex items-start gap-3 rounded-[0.875rem] border p-3;
background: #f8fafc;
border-color: rgba(23, 32, 51, 0.08);
border-color: var(--app-border-subtle);
}
.decision-row div {