feat: style broken imgs (#272)

Author: colinlienard

src/lib/components/dashboard/notifications/NotificationDescription.svelte

@@ -122,6 +122,8 @@
 		}
 
 		.image {
+			@include mixins.broken-img;
+
 			display: inline;
 			border-radius: 50%;
 			vertical-align: sub;

src/lib/components/dashboard/sidebar/WatchedPersons.svelte

@@ -189,6 +189,10 @@
 					color: variables.$bg-5;
 				}
 			}
+
+			&:not(.placeholder) {
+				@include mixins.broken-img;
+			}
 		}
 
 		.number {

src/lib/components/dashboard/sidebar/WatchedRepos.svelte

@@ -280,6 +280,10 @@
 			border-radius: variables.$small-radius;
 		}
 
+		.image {
+			@include mixins.broken-img;
+		}
+
 		.repo-icon {
 			display: flex;
 			align-items: center;

src/lib/components/settings/Settings.svelte

@@ -189,6 +189,8 @@
 		}
 
 		.image {
+			@include mixins.broken-img;
+
 			width: 2rem;
 			height: 2rem;
 			border-radius: 50%;

src/lib/components/settings/accounts/Account.svelte

@@ -68,6 +68,8 @@
 			gap: 0.5rem;
 
 			.image {
+				@include mixins.broken-img;
+
 				width: 2rem;
 				height: 2rem;
 				border-radius: 50%;

src/lib/components/settings/gitlab-settings/RepoInput.svelte

@@ -37,7 +37,7 @@
 				errorMessage = 'Repository already submitted';
 				return;
 			}
-			const regex = /^(http|https):\/\/[a-zA-Z0-9-]+\.[a-zA-Z]{2,}\/.*$/i;
+			const regex = /^(http|https):\/\/[a-zA-Z0-9-.]+\.[a-zA-Z]{2,}\/.*$/i;
 			if (regex.test(value)) {
 				try {
 					const url = new URL(value);

src/styles/_mixins.scss

@@ -160,3 +160,14 @@
 		opacity: 1;
 	}
 }
+
+@mixin broken-img() {
+	position: relative;
+
+	&::before {
+		position: absolute;
+		background: variables.$bg-4;
+		content: '';
+		inset: 0;
+	}
+}