From c7007a5965291763e258d249e7ba86902b10d80b Mon Sep 17 00:00:00 2001
From: escapedcat <github@htmlcss.de>
Date: Fri, 27 Sep 2024 11:50:14 +0200
Subject: [PATCH] refactor(apps): use alert for btcpay warning (#780)

- fix: alert colors
---
 src/components/Alert.tsx   | 4 ++--
 src/pages/Apps/AppInfo.tsx | 7 ++++---
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/components/Alert.tsx b/src/components/Alert.tsx
index 9ae973f0..ba8ecc02 100644
--- a/src/components/Alert.tsx
+++ b/src/components/Alert.tsx
@@ -9,8 +9,8 @@ export interface Props extends HTMLAttributes<HTMLElement> {
 
 const colors = {
   success: "text-success border-success bg-green-900",
-  warning: "text-warning border-warning bg-red-900",
-  danger: "text-danger border-danger bg-yellow-900",
+  warning: "text-warning border-warning bg-yellow-900",
+  danger: "text-danger border-danger bg-red-900",
   info: "text-primary border-primary bg-blue-900",
 };
 
diff --git a/src/pages/Apps/AppInfo.tsx b/src/pages/Apps/AppInfo.tsx
index 2ff3fbb3..38d05c0f 100644
--- a/src/pages/Apps/AppInfo.tsx
+++ b/src/pages/Apps/AppInfo.tsx
@@ -1,4 +1,5 @@
 import ImageCarousel from "./ImageCarousel";
+import { Alert } from "@/components/Alert";
 import AppIcon from "@/components/AppIcon";
 import { SSEContext } from "@/context/sse-context";
 import PageLoadingScreen from "@/layouts/PageLoadingScreen";
@@ -150,9 +151,9 @@ export const AppInfo: FC = () => {
       </section>
 
       {showBtcPayWarning && (
-        <p className="text-center text-warning py-2">
-          {t("appInfo.btcpayserver.ram_warning")}
-        </p>
+        <div className="m-5">
+          <Alert color="warning">{t("appInfo.btcpayserver.ram_warning")}</Alert>
+        </div>
       )}
 
       <section className="text-center">