fix ui tamplate job

src/app_modules/_global/ui/new_ui_footer.tsx

@@ -1,4 +1,4 @@
-import { Box } from "@mantine/core";
+import { Box, rem } from "@mantine/core";
 import { AccentColor } from "../color";
 
 export function NewUI_Footer({ children }: { children: React.ReactNode }) {
@@ -19,6 +19,8 @@ export function NewUI_Footer({ children }: { children: React.ReactNode }) {
           justifyContent: "center",
           maxWidth: "500px", // Batasi lebar maksimum untuk tampilan mobile
           margin: "0 auto", // Pusatkan di tengah layar desktop
+          borderRadius: "20px 20px 0px 0px",
+          width: "100%",
         }}
       >
         {children}

src/app_modules/_global/ui/new_ui_tamplate.tsx

@@ -10,22 +10,23 @@ export function NewUI_Tamplate({ children }: { children: React.ReactNode }) {
         width: "100%",
         height: "100vh",
         overflow: "hidden",
-        backgroundColor: MainColor.black,
+        backgroundColor: MainColor.darkblue,
         position: "relative",
         maxWidth: "500px", // Batasi lebar maksimum untuk tampilan mobile
         margin: "0 auto", // Pusatkan di tengah layar desktop
         border: "1px solid #ccc", // Garis tepi untuk visualisasi
       }}
     >
-      <Box
+      <BackgroundImage
+        src="/aset/global/main_background.png"
         style={{
+          // backgroundImage: "url(/aset/global/main_background.png)",
           position: "fixed",
           top: 0,
           left: 0,
           right: 0,
           bottom: 0,
           zIndex: 1, // Pastikan background di belakang konten
-          backgroundImage: "url(/aset/global/main_background.png)",
           backgroundSize: "cover",
           backgroundPosition: "center",
           maxWidth: "500px", // Batasi lebar maksimum untuk tampilan mobile
@@ -33,7 +34,7 @@ export function NewUI_Tamplate({ children }: { children: React.ReactNode }) {
         }}
       >
         {children}
-      </Box>
+      </BackgroundImage>
     </Box>
   );
 }