💄 style(globals): Refactor delete confirmation button and update badge styles in node and subscribe tables

apps/admin/app/dashboard/server/node-table.tsx

@@ -228,9 +228,24 @@ export default function NodeTable() {
               }
             }}
           />,
+          <ConfirmButton
+            key='delete'
+            trigger={<Button variant='destructive'>{t('delete')}</Button>}
+            title={t('confirmDelete')}
+            description={t('deleteWarning')}
+            onConfirm={async () => {
+              await deleteNode({
+                id: row.id,
+              });
+              toast.success(t('deleteSuccess'));
+              ref.current?.refresh();
+            }}
+            cancelText={t('cancel')}
+            confirmText={t('confirm')}
+          />,
           <Button
             key='copy'
-            variant='secondary'
+            variant='outline'
             onClick={async () => {
               setLoading(true);
               try {
@@ -251,21 +266,6 @@ export default function NodeTable() {
           >
             {t('copy')}
           </Button>,
-          <ConfirmButton
-            key='delete'
-            trigger={<Button variant='destructive'>{t('delete')}</Button>}
-            title={t('confirmDelete')}
-            description={t('deleteWarning')}
-            onConfirm={async () => {
-              await deleteNode({
-                id: row.id,
-              });
-              toast.success(t('deleteSuccess'));
-              ref.current?.refresh();
-            }}
-            cancelText={t('cancel')}
-            confirmText={t('confirm')}
-          />,
         ],
         batchRender(rows) {
           return [

apps/admin/app/dashboard/subscribe/subscribe-table.tsx

@@ -186,7 +186,7 @@ export default function SubscribeTable() {
         {
           accessorKey: 'sold',
           header: t('sold'),
-          cell: ({ row }) => <Badge variant='default'>{row.getValue('sold')}</Badge>,
+          cell: ({ row }) => <Badge variant='outline'>{row.getValue('sold')}</Badge>,
         },
       ]}
       actions={{
@@ -215,6 +215,21 @@ export default function SubscribeTable() {
               }
             }}
           />,
+          <ConfirmButton
+            key='delete'
+            trigger={<Button variant='destructive'>{t('delete')}</Button>}
+            title={t('confirmDelete')}
+            description={t('deleteWarning')}
+            onConfirm={async () => {
+              await deleteSubscribe({
+                id: row.id!,
+              });
+              toast.success(t('deleteSuccess'));
+              ref.current?.refresh();
+            }}
+            cancelText={t('cancel')}
+            confirmText={t('confirm')}
+          />,
           <Button
             key='copy'
             variant='secondary'
@@ -239,21 +254,6 @@ export default function SubscribeTable() {
           >
             {t('copy')}
           </Button>,
-          <ConfirmButton
-            key='delete'
-            trigger={<Button variant='destructive'>{t('delete')}</Button>}
-            title={t('confirmDelete')}
-            description={t('deleteWarning')}
-            onConfirm={async () => {
-              await deleteSubscribe({
-                id: row.id!,
-              });
-              toast.success(t('deleteSuccess'));
-              ref.current?.refresh();
-            }}
-            cancelText={t('cancel')}
-            confirmText={t('confirm')}
-          />,
         ],
         batchRender: (rows) => [
           <ConfirmButton

packages/ui/src/styles/globals.css

@@ -12,14 +12,14 @@
     --popover-foreground: 222.2 84% 4.9%;
     --primary: 221.2 83.2% 53.3%;
     --primary-foreground: 210 40% 98%;
-    --secondary: 142.1 76.2% 36.3%;
+    --secondary: 210 40% 96.1%;
-    --secondary-foreground: 355.7 100% 97.3%;
+    --secondary-foreground: 222.2 47.4% 11.2%;
     --muted: 210 40% 96.1%;
     --muted-foreground: 215.4 16.3% 46.9%;
     --accent: 210 40% 96.1%;
     --accent-foreground: 222.2 47.4% 11.2%;
-    --destructive: 346.8 77.2% 49.8%;
+    --destructive: 0 84.2% 60.2%;
-    --destructive-foreground: 355.7 100% 97.3%;
+    --destructive-foreground: 210 40% 98%;
     --border: 214.3 31.8% 91.4%;
     --input: 214.3 31.8% 91.4%;
     --ring: 221.2 83.2% 53.3%;
@@ -53,18 +53,17 @@
     --popover-foreground: 210 40% 98%;
     --primary: 217.2 91.2% 59.8%;
     --primary-foreground: 222.2 47.4% 11.2%;
-    --secondary: 142.1 70.6% 45.3%;
+    --secondary: 217.2 32.6% 17.5%;
-    --secondary-foreground: 144.9 80.4% 10%;
+    --secondary-foreground: 210 40% 98%;
     --muted: 217.2 32.6% 17.5%;
     --muted-foreground: 215 20.2% 65.1%;
     --accent: 217.2 32.6% 17.5%;
     --accent-foreground: 210 40% 98%;
-    --destructive: 346.8 77.2% 49.8%;
+    --destructive: 0 62.8% 30.6%;
-    --destructive-foreground: 355.7 100% 97.3%;
+    --destructive-foreground: 210 40% 98%;
     --border: 217.2 32.6% 17.5%;
     --input: 217.2 32.6% 17.5%;
     --ring: 224.3 76.3% 48%;
-    --radius: 0.5rem;
     --chart-1: 220 70% 50%;
     --chart-2: 160 60% 45%;
     --chart-3: 30 80% 55%;