diff --git a/frontend/src/app/scripts/_components/ScriptItems/Alerts.tsx b/frontend/src/app/scripts/_components/ScriptItems/Alerts.tsx
index e4c56e16..8d84a52a 100644
--- a/frontend/src/app/scripts/_components/ScriptItems/Alerts.tsx
+++ b/frontend/src/app/scripts/_components/ScriptItems/Alerts.tsx
@@ -1,14 +1,26 @@
import TextCopyBlock from "@/components/TextCopyBlock";
+import { AlertColors } from "@/config/siteConfig";
import { Script } from "@/lib/types";
+import { cn } from "@/lib/utils";
import { Info } from "lucide-react";
+type NoteProps = {
+ text: string;
+ type: keyof typeof AlertColors;
+}
+
export default function Alerts({ item }: { item: Script }) {
return (
<>
{item?.notes?.length > 0 &&
- item.notes.map((note: any, index: number) => (
+ item.notes.map((note: NoteProps, index: number) => (
-
+
{TextCopyBlock(note.text)}
diff --git a/frontend/src/config/siteConfig.tsx b/frontend/src/config/siteConfig.tsx
index 301a08c6..5fa0a8ed 100644
--- a/frontend/src/config/siteConfig.tsx
+++ b/frontend/src/config/siteConfig.tsx
@@ -34,3 +34,10 @@ export const analytics = {
url: "analytics.proxmoxve-scripts.com",
token: "b60d3032-1a11-4244-a100-81d26c5c49a7",
};
+
+export const AlertColors = {
+ warning:
+ "border-yellow-400 bg-yellow-50 dark:border-yellow-900 dark:bg-yellow-900",
+ danger: "border-red-500/25 bg-destructive/25",
+ info: "border-cyan-500/25 bg-cyan-50 dark:border-cyan-900/25 dark:bg-cyan-900",
+};
\ No newline at end of file
diff --git a/frontend/src/lib/types.ts b/frontend/src/lib/types.ts
index 4f8d2ef2..3541d86a 100644
--- a/frontend/src/lib/types.ts
+++ b/frontend/src/lib/types.ts
@@ -1,3 +1,5 @@
+import { AlertColors } from "@/config/siteConfig";
+
export type Script = {
name: string;
slug: string;
@@ -29,7 +31,7 @@ export type Script = {
notes: [
{
text: string;
- type: string;
+ type: keyof typeof AlertColors;
},
];
};