Use generic class for error message/no resource found

src/assets/scss/elementStyles.scss

@@ -201,4 +201,22 @@ b, strong {
 			font-size: 1.25rem;
 		}
 	}
+}
+
+.overlay_message {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	padding-right: 5rem;
+	font-size: 2rem;
+	user-select: none;
+	cursor: default;
+	transition: none;
+	color: $color__gray--darkest;
+
+	span {
+		font-size: 4rem;
+		color: $color__gray--darker;
+	}
 }

src/components/routes/AdminModerationBannedUsers.vue

@@ -32,7 +32,7 @@
 			</tr>
 		</table>
 
-		<div class='admin_moderation__no_bans' v-else>
+		<div class='overlay_message' v-else>
 			<span class='fa fa-thumbs-up'></span>
 			No banned users
 		</div>
@@ -251,23 +251,5 @@
 			}
 			
 		}
-
-		@at-root #{&}__no_bans {
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-			justify-content: center;
-			padding-top: 5rem;
-			font-size: 2rem;
-			user-select: none;
-			cursor: default;
-			transition: none;
-			color: $color__gray--darkest;
-
-			span {
-				font-size: 4rem;
-				color: $color__gray--darker;
-			}
-		}
 	}
 </style>

src/components/routes/AdminModerationReports.vue

@@ -49,7 +49,7 @@
 				</div>
 			</div>
 		</div>
-		<div class='admin_moderation__no_reports' v-else>
+		<div class='overlay_message' v-else>
 			<span class='fa fa-thumbs-up'></span>
 			No user reports
 		</div>
@@ -165,24 +165,6 @@
 				border-radius: 0 0 0.25rem 0.25rem;
 			}
 		}
-		@at-root #{&}__no_reports {
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-			justify-content: center;
-			padding-top: 5rem;
-			font-size: 2rem;
-			user-select: none;
-			cursor: default;
-			transition: none;
-			color: $color__gray--darkest;
-
-			span {
-				font-size: 4rem;
-				color: $color__gray--darker;
-			}
-		}
-
 
 		@at-root #{&}__report {
 			display: flex;

src/components/routes/Index.vue

@@ -44,7 +44,7 @@
 				<thread-display v-for='thread in filteredThreads' :thread='thread'></thread-display>
 				<thread-display-placeholder v-for='n in nextThreadsCount' v-if='loading'></thread-display-placeholder>
 			</scroll-load>
-			<div v-else class='threads_main__threads thread--empty'>
+			<div v-else class='threads_main__threads overlay_message'>
 				<span class='fa fa-exclamation-circle'></span>
 				No threads or posts.
 			</div>
@@ -355,24 +355,6 @@
 			}
 		}
 
-		@at-root #{&}--empty {
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-			justify-content: center;
-			padding-right: 5rem;
-			font-size: 2rem;
-			user-select: none;
-			cursor: default;
-			transition: none;
-			color: $color__gray--darkest;
-
-			span {
-				font-size: 4rem;
-				color: $color__gray--darker;
-			}
-		}
-
 		@at-root #{&}__section {
 			padding: 0 0.5rem;
 		}