External/5chan
1
0
Fork 0
mirror of https://github.com/bitsocialnet/5chan.git synced 2026-08-03 07:41:04 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix(mod queue): adjust styling

Browse Source
This commit is contained in:
plebeius
2026-01-11 16:57:09 +01:00
parent 823731cb2d
commit 4fd0820d94
2 changed files with 55 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/mod-queue/mod-queue.module.css
+53 -14
View File
@@ -53,14 +53,21 @@
.tableHeader {
display: flex;
padding: 5px;
border-bottom: var(--mod-queue-header-border-bottom);
background: var(--mod-queue-header-background-color);
gap: 1px;
font-weight: bold;
font-size: 9pt;
text-transform: capitalize;
}
.numberHeader,
.boardHeader,
.excerptHeader,
.timeHeader,
.actionsHeader {
background: var(--mod-queue-header-background-color);
padding: 5px;
}
.numberHeader {
width: 60px;
flex-shrink: 0;
@@ -76,7 +83,7 @@
}
.timeHeader {
width: auto;
width: 210px;
text-align: right;
flex-shrink: 0;
white-space: nowrap;
@@ -97,36 +104,68 @@
/* ModQueueRow styles */
.row {
display: flex;
padding: 2px;
border: none;
align-items: center;
gap: 8px;
gap: 1px;
margin-top: 1px;
color: var(--body-font-color);
font-size: 9pt;
}
/* Odd rows - theme-specific background colors */
:global(body.yotsuba) .rowOdd {
.number,
.board,
.excerpt,
.time,
.actions {
padding: 2px 5px;
}
/* Odd rows - theme-specific background colors applied to cells */
:global(body.yotsuba) .rowOdd .number,
:global(body.yotsuba) .rowOdd .board,
:global(body.yotsuba) .rowOdd .excerpt,
:global(body.yotsuba) .rowOdd .time,
:global(body.yotsuba) .rowOdd .actions {
background-color: #ede2d4;
}
:global(body.yotsuba-b) .rowOdd {
:global(body.yotsuba-b) .rowOdd .number,
:global(body.yotsuba-b) .rowOdd .board,
:global(body.yotsuba-b) .rowOdd .excerpt,
:global(body.yotsuba-b) .rowOdd .time,
:global(body.yotsuba-b) .rowOdd .actions {
background-color: #e0e5f6;
}
:global(body.futaba) .rowOdd {
:global(body.futaba) .rowOdd .number,
:global(body.futaba) .rowOdd .board,
:global(body.futaba) .rowOdd .excerpt,
:global(body.futaba) .rowOdd .time,
:global(body.futaba) .rowOdd .actions {
background-color: #ede2d4;
}
:global(body.burichan) .rowOdd {
:global(body.burichan) .rowOdd .number,
:global(body.burichan) .rowOdd .board,
:global(body.burichan) .rowOdd .excerpt,
:global(body.burichan) .rowOdd .time,
:global(body.burichan) .rowOdd .actions {
background-color: #e0e5f6;
}
:global(body.tomorrow) .rowOdd {
:global(body.tomorrow) .rowOdd .number,
:global(body.tomorrow) .rowOdd .board,
:global(body.tomorrow) .rowOdd .excerpt,
:global(body.tomorrow) .rowOdd .time,
:global(body.tomorrow) .rowOdd .actions {
background-color: rgba(255, 255, 255, 0.1);
}
:global(body.photon) .rowOdd {
:global(body.photon) .rowOdd .number,
:global(body.photon) .rowOdd .board,
:global(body.photon) .rowOdd .excerpt,
:global(body.photon) .rowOdd .time,
:global(body.photon) .rowOdd .actions {
background-color: #888;
}
@@ -160,7 +199,7 @@
}
.time {
width: auto;
width: 210px;
flex-shrink: 0;
text-align: right;
white-space: nowrap;
src/views/mod-queue/mod-queue.tsx
+2 -2
View File
@@ -531,13 +531,13 @@ export const ModQueueView = ({ boardIdentifier: propBoardIdentifier }: ModQueueV
totalCount={feed.length}
endReached={loadMore}
increaseViewportBy={{ bottom: 1200, top: 1200 }}
itemContent={(index, comment) => <ModQueueRow key={comment.cid} comment={comment} showBoardColumn={showBoardColumn} isOdd={index % 2 === 1} />}
itemContent={(index, comment) => <ModQueueRow key={comment.cid} comment={comment} showBoardColumn={showBoardColumn} isOdd={index % 2 === 0} />}
components={footerComponents}
/>
) : (
<>
{feed.map((comment, index) => (
<ModQueueRow key={comment.cid} comment={comment} showBoardColumn={showBoardColumn} isOdd={index % 2 === 1} />
<ModQueueRow key={comment.cid} comment={comment} showBoardColumn={showBoardColumn} isOdd={index % 2 === 0} />
))}
<ModQueueFooter hasMore={hasMore} subplebbitAddresses={subplebbitAddresses} />
</>