diff --git a/app/javascript/flavours/glitch/styles/mastodon/admin.scss b/app/javascript/flavours/glitch/styles/mastodon/admin.scss index 7a9170fdeb..5950bc32cb 100644 --- a/app/javascript/flavours/glitch/styles/mastodon/admin.scss +++ b/app/javascript/flavours/glitch/styles/mastodon/admin.scss @@ -467,6 +467,22 @@ $content-width: 840px; background-color: var(--color-bg-brand-soft); } + &.variantWarning { + background-color: var(--color-bg-warning-softest); + + .icon { + background-color: var(--color-bg-warning-soft); + } + } + + &.variantError { + background-color: var(--color-bg-error-softest); + + .icon { + background-color: var(--color-bg-error-soft); + } + } + .content { display: flex; flex-direction: column; @@ -2466,4 +2482,46 @@ a.sparkline { background: var(--color-bg-success-softest); font-size: 13px; font-weight: 600; + + &.positive { + background: var(--color-bg-success-softest); + } + + &.negative { + background: var(--color-bg-error-softest); + } +} + +.metadata { + display: flex; + gap: 40px; + margin: 16px 0; + + & > div { + display: flex; + flex-direction: column; + gap: 4px; + flex-shrink: 0; + } + + dt { + font-size: 13px; + color: var(--color-text-secondary); + } + + dd { + font-size: 16px; + font-weight: 600; + line-height: 22.4px; + + .status-badge { + box-sizing: border-box; + padding: 4px; + font-size: inherit; + height: 24px; + display: flex; + align-items: center; + justify-content: center; + } + } } diff --git a/app/javascript/flavours/glitch/styles/mastodon/tables.scss b/app/javascript/flavours/glitch/styles/mastodon/tables.scss index 0023ea353c..ff2935a46a 100644 --- a/app/javascript/flavours/glitch/styles/mastodon/tables.scss +++ b/app/javascript/flavours/glitch/styles/mastodon/tables.scss @@ -129,6 +129,10 @@ color: var(--color-text-primary); font-weight: 600; } + + .status-badge { + padding: 0; + } } &.batch-table { @@ -194,6 +198,12 @@ a.table-action-link { justify-content: center; padding: 4px; aspect-ratio: 1; + + &.table-icon-link--danger { + border-radius: 8px; + border: 1px solid var(--color-border-primary); + color: var(--color-text-error); + } } .batch-table {