From 0f6f522fcd3ef8c8a40a97b2c8bb1daa259de94b Mon Sep 17 00:00:00 2001
From: amsyarasyiq <82711525+amsyarasyiq@users.noreply.github.com>
Date: Thu, 23 May 2024 19:55:00 +0800
Subject: [PATCH] ui(safemode): update ui

---
 src/lib/ui/components/Codeblock.tsx |  4 ++--
 src/lib/ui/safeMode.tsx             | 15 ++++++++++++---
 2 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/src/lib/ui/components/Codeblock.tsx b/src/lib/ui/components/Codeblock.tsx
index fade249..7b37a9a 100644
--- a/src/lib/ui/components/Codeblock.tsx
+++ b/src/lib/ui/components/Codeblock.tsx
@@ -11,13 +11,13 @@ export interface CodeblockProps {
 
 const useStyles = createStyles({
     codeBlock: {
-        fontFamily: constants.Fonts.CODE_SEMIBOLD,
+        fontFamily: constants.Fonts.CODE_NORMAL,
         fontSize: 12,
         textAlignVertical: "center",
         backgroundColor: semanticColors.BACKGROUND_SECONDARY,
         color: semanticColors.TEXT_NORMAL,
         borderWidth: 1,
-        borderRadius: 4,
+        borderRadius: 12,
         borderColor: semanticColors.BACKGROUND_TERTIARY,
         padding: 10,
     },
diff --git a/src/lib/ui/safeMode.tsx b/src/lib/ui/safeMode.tsx
index 8f83657..7c7cb38 100644
--- a/src/lib/ui/safeMode.tsx
+++ b/src/lib/ui/safeMode.tsx
@@ -5,7 +5,7 @@ import { toggleSafeMode } from "@lib/debug";
 import { settings } from "@lib/settings";
 import { lazyDestructure } from "@lib/utils/lazy";
 import { ButtonColors } from "@lib/utils/types";
-import { Button, SafeAreaView } from "@metro/common/components";
+import { Button, CompatButton, SafeAreaView } from "@metro/common/components";
 import { findByNameProxy, findByProps } from "@metro/utils";
 import { semanticColors } from "@ui/color";
 import { Codeblock, ErrorBoundary as _ErrorBoundary } from "@ui/components";
@@ -117,12 +117,21 @@ export default () => after.proxy("render", [ErrorBoundary, r => r.prototype], fu
                     {buttons.map(button => {
                         const buttonIndex = buttons.indexOf(button) !== 0 ? 8 : 0;
 
-                        return <Button
+                        return <CompatButton
                             text={button.text}
                             color={button.color ?? ButtonColors.BRAND}
                             size={button.size ?? "small"}
                             onPress={button.onPress}
-                            style={DeviceManager.isTablet ? { flex: `0.${buttons.length}`, marginLeft: buttonIndex } : { marginTop: buttonIndex }}
+                            style={{
+                                ...(DeviceManager.isTablet ? {
+                                    flex: `0.${buttons.length}`,
+                                    marginLeft: buttonIndex
+                                } : {
+                                    marginTop: buttonIndex
+                                }),
+
+                                borderRadius: 16
+                            }}
                         />;
                     })}
                 </View>