1 files changed, 91 insertions, 91 deletions

diff --git a/web/source/settings/style.css b/web/source/settings/style.css
index d2420bdfc..cdae6b972 100644
--- a/web/source/settings/style.css
+++ b/web/source/settings/style.css
@@ -1045,62 +1045,62 @@ button.with-padding {
 	}
 }
 
-.reports {
-	p {
-		margin: 0;
-	}
-
+.reports-view {
 	.report {
 		display: flex;
 		flex-direction: column;
+		flex-wrap: nowrap;
 		gap: 0.5rem;
-		margin: 0.5rem 0;
-
-		text-decoration: none;
 		color: $fg;
-
-		padding: 1rem;
-
-		border: none;
 		border-left: 0.3rem solid $border-accent;
 
-		.usernames {
-			line-height: 2rem;
-		}
-
-		.byline {
-			display: grid;
-			grid-template-columns: 1fr auto;
-			gap: 0.5rem;
+		.username-lozenge {
+			display: flex;
+			flex-wrap: nowrap;
+			height: 100%;
+			align-items: center;
+			padding-top: 0;
+			padding-bottom: 0;
 
-			.report-status {
-				color: $border-accent;
+			.fa {
+				flex-shrink: 0;
 			}
 		}
 
-		.details {
-			display: grid;
-			grid-template-columns: auto 1fr;
-			gap: 0.2rem 0.5rem;
-			padding: 0.5rem;
-
-			justify-items: start;
+		.report-byline {
+			max-width: fit-content;
 		}
 
-		h3 {
-			margin: 0;
+		.info-list {
+			border: none;
+
+			.info-list-entry {
+				background: none;
+				padding: 0;
+
+				.report-target .username-lozenge {
+					color: $bg;
+				}
+
+				.reported-by .username-lozenge {
+					color: $fg;
+					font-weight: initial;
+					border-radius: 0;
+					background: none;
+				}
+			}
 		}
 
 		&.resolved {
-			color: $fg-reduced;
-			border-left: 0.4rem solid $bg;
+			border-left: 0.3rem solid $list-entry-bg;
 
-			.byline .report-status {
+			.info-list,
+			.info-list .info-list-entry .reported-by .username-lozenge {
 				color: $fg-reduced;
 			}
-			
-			.user {
-				opacity: 0.8;
+
+			&:hover {
+				border-color: $fg-accent;
 			}
 		}
 
@@ -1109,72 +1109,42 @@ button.with-padding {
 			padding: 0;
 		}
 	}
+}
 
-	.report.detail {
-		display: flex;
-		flex-direction: column;
-		margin-top: 1rem;
-		gap: 1rem;
-
-		.info-block {
-			padding: 0.5rem;
-			background: $gray2;
-		}
-
-		.info {
-			display: block;
-		}
-
-		.reported-toots {
-			margin-top: 0.5rem;
+.report-detail {
+	.info-list {
+		
+		&.overview {
+			margin-top: 1rem;
 		}
 
-		.toot .toot-info {
-			padding: 0.5rem;
-			background: $toot-info-bg;
-
-			a {
-				color: $fg-reduced;
-			}
+		.username-lozenge {
+			display: flex;
+			flex-wrap: nowrap;
+			height: 100%;
+			align-items: center;
+			padding-top: 0;
+			padding-bottom: 0;
+			max-width: fit-content;
 
-			&:last-child {
-				border-bottom-left-radius: $br;
-				border-bottom-right-radius: $br;
+			.fa {
+				flex-shrink: 0;
 			}
 		}
 	}
-}
-
-.username-lozenge {
-	line-height: 1.3rem;
-	display: inline-block;
-	background: $fg-accent;
-	color: $bg;
-	border-radius: $br;
-	padding: 0.15rem;
-	font-weight: bold;
-	text-decoration: none;
-	
-	.acct {
-		word-break: break-all;
-	}
 
-	&.suspended {
-		background: $bg-accent;
-		color: $fg;
-		text-decoration: line-through;
-	}
+	.report-statuses {
+		width: min(100%, 50rem);
 
-	&.local {
-		background: $green1;
+		.thread {
+			display: flex;
+			flex-direction: column;
+			gap: 2rem;
+			padding: 0;
+		}
 	}
 }
 
-.spanlink {
-	cursor: pointer;
-	text-decoration: none;
-}
-
 .accounts-view {
 	.pageable-list {
 		.username-lozenge {
@@ -1223,6 +1193,36 @@ button.with-padding {
 	}
 }
 
+.username-lozenge {
+	line-height: 1.3rem;
+	display: inline-block;
+	background: $fg-accent;
+	color: $bg;
+	border-radius: $br;
+	padding: 0.15rem;
+	font-weight: bold;
+	text-decoration: none;
+	
+	.acct {
+		word-break: break-all;
+	}
+
+	&.suspended {
+		background: $bg-accent;
+		color: $fg;
+		text-decoration: line-through;
+	}
+
+	&.local {
+		background: $green1;
+	}
+}
+
+.pseudolink {
+	cursor: pointer;
+	text-decoration: none;
+}
+
 .info-list {
 	border: 0.1rem solid $gray1;
 	display: flex;