fix(Alert): moved type styling to defaultClass so it can be overriden

src/lib/components/alert/Alert.svelte

@@ -13,20 +13,20 @@
 		type
 	});
 
-	const defaultClass =
-		'rounded-md p-4 bg-opacity-20 dark:bg-opacity-20 transition-all duration-150';
+	let defaultClass = 'rounded-md p-4 bg-opacity-20 dark:bg-opacity-20 transition-all duration-150';
+	if (type === 'info') {
+		defaultClass += ' bg-info-background';
+	} else if (type === 'warn') {
+		defaultClass += ' bg-warn-background';
+	} else if (type === 'success') {
+		defaultClass += ' bg-success-background';
+	} else if (type === 'error') {
+		defaultClass += ' bg-error-background';
+	}
 	const finalClass = twMerge(defaultClass, $$props.class);
 </script>
 
-<!-- TODO: pull out the type and add to defaultClass -->
-<div
-	class={finalClass}
-	class:bg-info-background={type === 'info'}
-	class:bg-warn-background={type === 'warn'}
-	class:bg-success-background={type === 'success'}
-	class:bg-error-background={type === 'error'}
-	style={$$props.style}
->
+<div class={finalClass} style={$$props.style}>
 	<div class="flex">
 		<slot name="icon" />
 		<div class="flex items-start justify-start flex-col w-full" class:ml-3={$$slots.icon}>