fix: notification dropdown unread state toggle

less/header.less

@@ -34,37 +34,32 @@
 				}
 			}
 
-			&.unread {
-				.bg-variant(@state-warning-bg);
-
-				.mark-read:after {
-					content: "\f111";
-				}
-
-				.mark-read:hover:after {
-					content: "\f10c";
-				}
-			}
-
 			.mark-read {
 				color: @text-muted;
 
 				&:after {
-					font-family: "FontAwesome";
+					font-family: "Font Awesome 5 Free";
-					content: "\f10c";
+					content: @fa-var-circle;
+					font-weight: 400;
 					padding: 4px 1rem;
 					position: relative;
 					top: 1px;
 				}
 
 				&:hover {
-					color: @gray-dark;
+					color: darken(@text-muted, 10%);
 					.pointer;
-
-					&:after {
-						content: "\f111";
 				}
 			}
+			
+			&.unread {
+				.bg-variant(@state-warning-bg);
+
+				.mark-read:after {
+					font-family: "Font Awesome 5 Free";
+					content: @fa-var-circle;
+					font-weight: 900;
+				}
 			}
 		}
 	}