From 3960327a43b7c160bff0f223334363b0588c58be Mon Sep 17 00:00:00 2001
From: f0x <f0x@cthu.lu>
Date: Thu, 26 Jan 2023 16:39:25 +0100
Subject: [PATCH] checkbox-list styling with taller <p> element

---
 web/source/settings/components/check-list.jsx |  2 +-
 web/source/settings/style.css                 | 13 +++++++++----
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/web/source/settings/components/check-list.jsx b/web/source/settings/components/check-list.jsx
index 1276d5dbf..bcf5ce5c4 100644
--- a/web/source/settings/components/check-list.jsx
+++ b/web/source/settings/components/check-list.jsx
@@ -23,7 +23,7 @@ const React = require("react");
 module.exports = function CheckList({ field, Component, header = " All", ...componentProps }) {
 	return (
 		<div className="checkbox-list list">
-			<label className="header">
+			<label className="header entry">
 				<input
 					ref={field.toggleAll.ref}
 					type="checkbox"
diff --git a/web/source/settings/style.css b/web/source/settings/style.css
index 745021418..eaf869a4f 100644
--- a/web/source/settings/style.css
+++ b/web/source/settings/style.css
@@ -370,7 +370,8 @@ span.form-info {
 
 .checkbox-list {
 	.header, .entry {
-		gap: 1rem;
+		display: grid;
+		gap: 0 1rem;
 	}
 }
 
@@ -625,7 +626,6 @@ span.form-info {
 
 		.checkbox-list {
 			.entry {
-				display: grid;
 				grid-template-columns: auto auto 1fr;
 			}
 
@@ -684,9 +684,14 @@ button.with-padding {
 
 .suspend-import-list {
 	.checkbox-list {
-		.header, .entry {
-			display: grid;
+		.entry {
 			grid-template-columns: auto 25ch auto 1fr;
+			grid-template-rows: auto 1fr;
+
+			p {
+				grid-column: 4;
+				grid-row: 1 / span 2;
+			}
 		}
 	}