diff --git a/src/views/mod-queue/mod-queue.module.css b/src/views/mod-queue/mod-queue.module.css index 5434324c..ee96e5f7 100644 --- a/src/views/mod-queue/mod-queue.module.css +++ b/src/views/mod-queue/mod-queue.module.css @@ -5,6 +5,15 @@ } .header { + margin-bottom: 10px; +} + +.title { + font-size: 1.5em; + font-weight: bold; +} + +.controls { display: flex; justify-content: space-between; align-items: center; @@ -13,9 +22,14 @@ gap: 10px; } -.title { - font-size: 1.5em; - font-weight: bold; +.controlsLeft { + display: flex; + align-items: center; +} + +.controlsRight { + display: flex; + align-items: center; } .alertThresholdSetting { @@ -270,7 +284,6 @@ span.reject:hover { /* ModQueueBoardFilter styles */ .filterContainer { - margin-bottom: 10px; display: flex; align-items: center; gap: 8px; @@ -354,6 +367,10 @@ span.reject:hover { } .header { + margin-bottom: 10px; + } + + .controls { flex-direction: column; align-items: flex-start; } diff --git a/src/views/mod-queue/mod-queue.tsx b/src/views/mod-queue/mod-queue.tsx index aabe579f..b2d1075f 100644 --- a/src/views/mod-queue/mod-queue.tsx +++ b/src/views/mod-queue/mod-queue.tsx @@ -475,42 +475,63 @@ export const ModQueueView = ({ boardIdentifier: propBoardIdentifier }: ModQueueV [hasMore, subplebbitAddresses], ); + const alertThresholdControl = ( +
+ +
+ ); + return (
-
-
{t('moderation_queue')}
-
- + {!resolvedAddress && ( +
+
{t('moderation_queue')}
-
+ )} - {!resolvedAddress && } +
+ {!resolvedAddress ? ( + <> +
+ +
+
{alertThresholdControl}
+ + ) : ( + <> +
+
{t('moderation_queue')}
+
+
{alertThresholdControl}
+ + )} +
{feed.length === 0 && !hasMore ? (
{t('queue_is_empty')}