# fix

- Merubah Appshell dengan tamplate layout sendiri di module berikut:
- Forum
- Job
- Event
- Voting
## No Issuee

src/app/dev/event/create/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/event/detail/draft/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/event/detail/kontribusi/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/event/detail/main/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/event/detail/publish/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/event/detail/reject/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/event/detail/review/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/event/detail/riwayat/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/event/edit/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/forum/create/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/forum/edit/komentar/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/forum/edit/posting/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/forum/komentar/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/forum/splash/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/job/create/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/job/detail/arsip/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/job/detail/draft/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/job/detail/main/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/job/detail/publish/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/job/detail/reject/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/job/detail/review/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/job/edit/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/job/main/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/job/non_user_view/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/job/splash/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/vote/create/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/vote/detail/draft/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/vote/detail/kontribusi/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/vote/detail/main/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/vote/detail/publish/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/vote/detail/reject/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/vote/detail/review/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/vote/detail/riwayat_saya/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/vote/detail/semua_riwayat/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/vote/edit/[id]/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/vote/main/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app/dev/vote/splash/loading.tsx

@@ -0,0 +1,9 @@
+import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+
+export default async function Page() {
+  return (
+    <>
+      <ComponentGlobal_V2_LoadingPage />
+    </>
+  );
+}

src/app_modules/component_global/component_layout_tamplate.tsx

@@ -46,6 +46,7 @@ export default function AppComponentGlobal_LayoutTamplate({
         {/* Children */}
         <Box p={"sm"} pos={"static"}>
           <Stack>
+            
             {children}
             <Box
               style={{

src/app_modules/donasi/detail/detail_main/layout.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { AppShell, Box, Button, Center, Footer } from "@mantine/core";
+import { AppShell, Box, Button, Center, Footer, Stack } from "@mantine/core";
 import React from "react";
 import ComponentDonasi_HeaderTamplate from "../../component/header_tamplate";
 import ButtonDonasi from "../../component/footer_button_donasi";
@@ -17,7 +17,13 @@ export default function LayoutDetailMainDonasi({
     <>
       <AppComponentGlobal_LayoutTamplate
         header={<ComponentDonasi_HeaderTamplate title="Detail Donasi" />}
-        footer={<ButtonDonasi donasiId={donasiId} />}
+        footer={
+          <Footer height={"10vh"}>
+            <Stack justify="center" h={"100%"}>
+              <ButtonDonasi donasiId={donasiId} />
+            </Stack>
+          </Footer>
+        }
       >
         {children}
       </AppComponentGlobal_LayoutTamplate>

src/app_modules/donasi/main/layout.tsx

@@ -119,7 +119,7 @@ export default function LayoutDonasi({
                       >
                         {e.icon}
                       </ActionIcon>
-                      <Text c={active === i ? "orange" : "white"}>
+                      <Text c={active === i ? "orange" : "white"} fz={"xs"}>
                         {e.name}
                       </Text>
                     </Flex>

src/app_modules/event/create/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentEvent_HeaderTamplate from "../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutEvent_Create({
   children,
@@ -11,9 +12,9 @@ export default function LayoutEvent_Create({
 }) {
   return (
     <>
-      <AppShell header={<ComponentEvent_HeaderTamplate title="Tambah Event" />}>
+      <AppComponentGlobal_LayoutTamplate header={<ComponentEvent_HeaderTamplate title="Tambah Event" />}>
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/event/detail/draft/layout.tsx

@@ -5,6 +5,7 @@ import React from "react";
 import ComponentEvent_HeaderTamplate from "../../component/header_tamplate";
 import { IconEdit } from "@tabler/icons-react";
 import { RouterEvent } from "@/app/lib/router_hipmi/router_event";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutEvent_DetailDraft({
   children,
@@ -15,11 +16,11 @@ export default function LayoutEvent_DetailDraft({
 }) {
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={<ComponentEvent_HeaderTamplate title="Detail Draft" icon={<IconEdit/>} route2={RouterEvent.edit + eventId}/>}
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/event/detail/kontribusi/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentEvent_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutEvent_DetailKontribusi({
   children,
@@ -11,11 +12,11 @@ export default function LayoutEvent_DetailKontribusi({
 }) {
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={<ComponentEvent_HeaderTamplate title="Detail Kontibutor" />}
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/event/detail/main_detail/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentEvent_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutEvent_DetailMain({
   children,
@@ -11,9 +12,11 @@ export default function LayoutEvent_DetailMain({
 }) {
   return (
     <>
-      <AppShell header={<ComponentEvent_HeaderTamplate title="Detail Event" />}>
+      <AppComponentGlobal_LayoutTamplate
+        header={<ComponentEvent_HeaderTamplate title="Detail Event" />}
+      >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/event/detail/publish/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentEvent_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutEvent_DetailPublish({
   children,
@@ -11,11 +12,11 @@ export default function LayoutEvent_DetailPublish({
 }) {
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={<ComponentEvent_HeaderTamplate title="Detail Publish" />}
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/event/detail/reject/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentEvent_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutEvent_DetailReject({
   children,
@@ -11,11 +12,11 @@ export default function LayoutEvent_DetailReject({
 }) {
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={<ComponentEvent_HeaderTamplate title="Detail Reject" />}
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/event/detail/review/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentEvent_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutEvent_DetailReview({
   children,
@@ -11,11 +12,11 @@ export default function LayoutEvent_DetailReview({
 }) {
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={<ComponentEvent_HeaderTamplate title="Detail Review" />}
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/event/detail/riwayat/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentEvent_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutEvent_DetailRiwayat({
   children,
@@ -11,9 +12,9 @@ export default function LayoutEvent_DetailRiwayat({
 }) {
   return (
     <>
-      <AppShell header={<ComponentEvent_HeaderTamplate title="Detail Riwayat" />}>
+      <AppComponentGlobal_LayoutTamplate header={<ComponentEvent_HeaderTamplate title="Detail Riwayat" />}>
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/event/edit/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentEvent_HeaderTamplate from "../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutEvent_Edit({
   children,
@@ -11,9 +12,9 @@ export default function LayoutEvent_Edit({
 }) {
   return (
     <>
-      <AppShell header={<ComponentEvent_HeaderTamplate title="Edit Event" />}>
+      <AppComponentGlobal_LayoutTamplate header={<ComponentEvent_HeaderTamplate title="Edit Event" />}>
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/event/main/beranda.tsx

@@ -37,6 +37,7 @@ export default function Event_Beranda({
   dataEvent: MODEL_EVENT[];
 }) {
   const router = useRouter();
+  const [loading, setLoading] = useState(false);
 
   // if (_.isEmpty(dataEvent))
   //   return (
@@ -48,13 +49,17 @@ export default function Event_Beranda({
   //   );
   return (
     <>
-      <Affix position={{ bottom: rem(100), right: rem(30) }}>
+      <Affix position={{ bottom: rem(150), right: rem(30) }}>
         <ActionIcon
+          loading={loading ? true : false}
           size={"xl"}
           radius={"xl"}
           variant="transparent"
           bg={"blue"}
-          onClick={() => router.push(RouterEvent.create)}
+          onClick={() => {
+            setLoading(true);
+            router.push(RouterEvent.create);
+          }}
         >
           <IconCirclePlus color="white" size={40} />
         </ActionIcon>

src/app_modules/event/main/layout.tsx

@@ -25,6 +25,7 @@ import { useAtom } from "jotai";
 import { gs_event_hotMenu, gs_event_status } from "../global_state";
 import { RouterEvent } from "@/app/lib/router_hipmi/router_event";
 import { RouterHome } from "@/app/lib/router_hipmi/router_home";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutEvent_Main({
   children,
@@ -62,7 +63,7 @@ export default function LayoutEvent_Main({
   ];
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={
           <ComponentEvent_HeaderTamplate
             title="Event"
@@ -70,40 +71,45 @@ export default function LayoutEvent_Main({
           />
         }
         footer={
-          <Footer height={70} bg={"dark"} sx={{ borderTop: "px solid blue" }}>
-          
-            <Grid>
-              {listFooter.map((e, i) => (
-                <Grid.Col
-                  key={e.id}
-                  span={"auto"}
-                  pt={"md"}
-                  onClick={() => {
-                    router.replace(e.path);
-                    setHotMenu(i);
-                  }}
-                >
-                  <Center>
-                    <Stack align="center" spacing={0}>
-                      <ActionIcon
-                        variant="transparent"
-                        c={hotMenu === i ? "blue" : "white"}
-                      >
-                        {e.icon}
-                      </ActionIcon>
-                      <Text fz={10} c={hotMenu === i ? "blue" : "white"}>
-                        {e.name}
-                      </Text>
-                    </Stack>
-                  </Center>
-                </Grid.Col>
-              ))}
-            </Grid>
+          <Footer
+            height={"10vh"}
+            bg={"dark"}
+            sx={{ borderTop: "px solid blue" }}
+          >
+            <Stack justify="center" h={"100%"}>
+              <Grid >
+                {listFooter.map((e, i) => (
+                  <Grid.Col
+                    key={e.id}
+                    span={"auto"}
+                    pt={"md"}
+                    onClick={() => {
+                      router.replace(e.path);
+                      setHotMenu(i);
+                    }}
+                  >
+                    <Center>
+                      <Stack align="center" spacing={0}>
+                        <ActionIcon
+                          variant="transparent"
+                          c={hotMenu === i ? "blue" : "white"}
+                        >
+                          {e.icon}
+                        </ActionIcon>
+                        <Text fz={10} c={hotMenu === i ? "blue" : "white"}>
+                          {e.name}
+                        </Text>
+                      </Stack>
+                    </Center>
+                  </Grid.Col>
+                ))}
+              </Grid>
+            </Stack>
           </Footer>
         }
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/forum/create/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentForum_HeaderTamplate from "../component/header/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutForum_Create({
   children,
@@ -11,9 +12,9 @@ export default function LayoutForum_Create({
 }) {
   return (
     <>
-      <AppShell header={<ComponentForum_HeaderTamplate title="Tambah Postingan" />}>
+      <AppComponentGlobal_LayoutTamplate header={<ComponentForum_HeaderTamplate title="Tambah Postingan" />}>
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/forum/detail/layout.tsx

@@ -7,6 +7,7 @@ import { useRouter } from "next/navigation";
 import { IconChevronLeft } from "@tabler/icons-react";
 import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
 import { revalidatePath } from "next/cache";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export const dynamic = "force-dynamic";
 export default function LayoutForum_Detail({
@@ -21,7 +22,7 @@ export default function LayoutForum_Detail({
 
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={
           <Header height={50} sx={{ borderStyle: "none" }}>
             <Group h={50} px={"md"}>
@@ -42,7 +43,7 @@ export default function LayoutForum_Detail({
         }
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/forum/edit/komentar/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentForum_HeaderTamplate from "../../component/header/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutForum_EditKomentar({
   children,
@@ -11,11 +12,11 @@ export default function LayoutForum_EditKomentar({
 }) {
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={<ComponentForum_HeaderTamplate title="Edit Komentar" />}
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/forum/edit/posting/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentForum_HeaderTamplate from "../../component/header/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutForum_EditPosting({
   children,
@@ -11,11 +12,11 @@ export default function LayoutForum_EditPosting({
 }) {
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={<ComponentForum_HeaderTamplate title="Edit Postingan" />}
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/forum/forumku/layout.tsx

@@ -5,6 +5,7 @@ import React from "react";
 import ComponentForum_HeaderTamplate from "../component/header/header_tamplate";
 import { MODEL_USER } from "@/app_modules/home/model/interface";
 import { IconX } from "@tabler/icons-react";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutForum_Forumku({
   children,
@@ -15,11 +16,16 @@ export default function LayoutForum_Forumku({
 }) {
   return (
     <>
-      <AppShell
-        header={<ComponentForum_HeaderTamplate title={`${username}`} changeIconBack={<IconX/>}/>}
+      <AppComponentGlobal_LayoutTamplate
+        header={
+          <ComponentForum_HeaderTamplate
+            title={`${username}`}
+            changeIconBack={<IconX />}
+          />
+        }
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/forum/komentar/layout.tsx

@@ -12,6 +12,7 @@ import { IconChevronLeft } from "@tabler/icons-react";
 import { useRouter } from "next/navigation";
 import React from "react";
 import ComponentForum_HeaderTamplate from "../component/header/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutForum_Komentar({
   children,
@@ -21,7 +22,7 @@ export default function LayoutForum_Komentar({
   const router = useRouter();
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={
           <Header height={50} sx={{ borderStyle: "none" }}>
             <Group h={50} px={"md"}>
@@ -40,7 +41,7 @@ export default function LayoutForum_Komentar({
         // header={<ComponentForum_HeaderTamplate title="Komentar" />}
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/forum/main/layout.tsx

@@ -24,6 +24,7 @@ import { title } from "process";
 import { MODEL_USER } from "@/app_modules/home/model/interface";
 import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
 import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutForum_Main({
   children,
@@ -56,7 +57,7 @@ export default function LayoutForum_Main({
 
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={
           <Header height={50} sx={{ borderStyle: "none" }}>
             <Group h={50} position="apart" px={"md"}>
@@ -131,7 +132,7 @@ export default function LayoutForum_Main({
         // }
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/forum/report/komentar/layout.tsx

@@ -6,6 +6,7 @@ import ComponentForum_HeaderTamplate from "../../component/header/header_tamplat
 import { IconChevronLeft, IconX } from "@tabler/icons-react";
 import router from "next/router";
 import ComponentForum_HeaderRataKiri from "../../component/header/header_rata_kiri";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutForum_ReportKomentar({
   children,
@@ -14,13 +15,13 @@ export default function LayoutForum_ReportKomentar({
 }) {
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={
           <ComponentForum_HeaderRataKiri title="Mengumpulkan Informasi Komentar"/>
         }
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/forum/report/posting/layout.tsx

@@ -6,6 +6,7 @@ import ComponentForum_HeaderTamplate from "../../component/header/header_tamplat
 import { IconChevronLeft, IconX } from "@tabler/icons-react";
 import router from "next/router";
 import ComponentForum_HeaderRataKiri from "../../component/header/header_rata_kiri";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutForum_ReportPosting({
   children,
@@ -14,13 +15,13 @@ export default function LayoutForum_ReportPosting({
 }) {
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={
           <ComponentForum_HeaderRataKiri title="Mengumpulkan Informasi Posting" />
         }
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/job/create/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentJob_HeaderTamplate from "../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutJob_Create({
   children,
@@ -11,11 +12,11 @@ export default function LayoutJob_Create({
 }) {
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={<ComponentJob_HeaderTamplate title="Tambah Job" />}
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/job/detail/arsip/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentJob_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutJob_DetailArsip({
   children,
@@ -11,9 +12,9 @@ export default function LayoutJob_DetailArsip({
 }) {
   return (
     <>
-      <AppShell header={<ComponentJob_HeaderTamplate title="Detail Arsip" />}>
+      <AppComponentGlobal_LayoutTamplate header={<ComponentJob_HeaderTamplate title="Detail Arsip" />}>
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/job/detail/draft/layout.tsx

@@ -5,6 +5,7 @@ import React from "react";
 import ComponentJob_HeaderTamplate from "../../component/header_tamplate";
 import { IconEdit } from "@tabler/icons-react";
 import { RouterJob } from "@/app/lib/router_hipmi/router_job";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutJob_DetailDraft({
   children,
@@ -15,7 +16,7 @@ export default function LayoutJob_DetailDraft({
 }) {
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={
           <ComponentJob_HeaderTamplate
             title="Detail Draft"
@@ -25,7 +26,7 @@ export default function LayoutJob_DetailDraft({
         }
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/job/detail/main/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentJob_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutJob_MainDetail({
   children,
@@ -11,9 +12,9 @@ export default function LayoutJob_MainDetail({
 }) {
   return (
     <>
-      <AppShell header={<ComponentJob_HeaderTamplate title=" Detail Job" />}>
+      <AppComponentGlobal_LayoutTamplate header={<ComponentJob_HeaderTamplate title=" Detail Job" />}>
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/job/detail/publish/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentJob_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutJob_DetailPublish({
   children,
@@ -11,9 +12,9 @@ export default function LayoutJob_DetailPublish({
 }) {
   return (
     <>
-      <AppShell header={<ComponentJob_HeaderTamplate title="Detail Publish" />}>
+      <AppComponentGlobal_LayoutTamplate header={<ComponentJob_HeaderTamplate title="Detail Publish" />}>
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/job/detail/reject/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentJob_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutJob_DetailReject({
   children,
@@ -11,9 +12,9 @@ export default function LayoutJob_DetailReject({
 }) {
   return (
     <>
-      <AppShell header={<ComponentJob_HeaderTamplate title="Detail Reject" />}>
+      <AppComponentGlobal_LayoutTamplate header={<ComponentJob_HeaderTamplate title="Detail Reject" />}>
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/job/detail/review/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentJob_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutJob_DetailReview({
   children,
@@ -11,9 +12,9 @@ export default function LayoutJob_DetailReview({
 }) {
   return (
     <>
-      <AppShell header={<ComponentJob_HeaderTamplate title="Detail Review" />}>
+      <AppComponentGlobal_LayoutTamplate header={<ComponentJob_HeaderTamplate title="Detail Review" />}>
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/job/edit/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentJob_HeaderTamplate from "../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutJob_Edit({
   children,
@@ -11,9 +12,11 @@ export default function LayoutJob_Edit({
 }) {
   return (
     <>
-      <AppShell header={<ComponentJob_HeaderTamplate title="Edit Job" />}>
+      <AppComponentGlobal_LayoutTamplate
+        header={<ComponentJob_HeaderTamplate title="Edit Job" />}
+      >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/job/main/beranda.tsx

@@ -28,7 +28,7 @@ export default function Job_Beranda({ listJob }: { listJob: MODEL_JOB[] }) {
   const router = useRouter();
   return (
     <>
-      <Affix position={{ bottom: rem(100), right: rem(30) }}>
+      <Affix position={{ bottom: rem(150), right: rem(30) }}>
         <ActionIcon
           size={"xl"}
           radius={"xl"}

src/app_modules/job/main/layout.tsx

@@ -17,6 +17,7 @@ import { RouterJob } from "@/app/lib/router_hipmi/router_job";
 import { useAtom } from "jotai";
 import { gs_job_hot_menu } from "../global_state";
 import { RouterHome } from "@/app/lib/router_hipmi/router_home";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutJob_Main({
   children,
@@ -50,7 +51,7 @@ export default function LayoutJob_Main({
 
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={
           <ComponentJob_HeaderTamplate
             title="Job Vacancy"
@@ -58,39 +59,41 @@ export default function LayoutJob_Main({
           />
         }
         footer={
-          <Footer height={70} bg={"dark"}>
-            <Grid>
-              {listFooter.map((e) => (
-                <Grid.Col
-                  key={e.id}
-                  span={"auto"}
-                  pt={"md"}
-                  onClick={() => {
-                    router.replace(e.path);
-                    setHotMenu(e.id);
-                  }}
-                >
-                  <Center>
-                    <Stack align="center" spacing={0}>
-                      <ActionIcon
-                        variant="transparent"
-                        c={hotMenu === e.id ? "blue" : "white"}
-                      >
-                        {e.icon}
-                      </ActionIcon>
-                      <Text fz={10} c={hotMenu === e.id ? "blue" : "white"}>
-                        {e.name}
-                      </Text>
-                    </Stack>
-                  </Center>
-                </Grid.Col>
-              ))}
-            </Grid>
+          <Footer height={"10vh"} bg={"dark"}>
+            <Stack justify="center" h={"100%"}>
+              <Grid>
+                {listFooter.map((e) => (
+                  <Grid.Col
+                    key={e.id}
+                    span={"auto"}
+                    pt={"md"}
+                    onClick={() => {
+                      router.replace(e.path);
+                      setHotMenu(e.id);
+                    }}
+                  >
+                    <Center>
+                      <Stack align="center" spacing={0}>
+                        <ActionIcon
+                          variant="transparent"
+                          c={hotMenu === e.id ? "blue" : "white"}
+                        >
+                          {e.icon}
+                        </ActionIcon>
+                        <Text fz={10} c={hotMenu === e.id ? "blue" : "white"}>
+                          {e.name}
+                        </Text>
+                      </Stack>
+                    </Center>
+                  </Grid.Col>
+                ))}
+              </Grid>
+            </Stack>
           </Footer>
         }
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/job/non_user_view/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentJob_HeaderTamplate from "../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutJob_NonUserView({
   children,
@@ -11,7 +12,7 @@ export default function LayoutJob_NonUserView({
 }) {
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={
           <ComponentJob_HeaderTamplate
             hideBack={true}
@@ -20,7 +21,7 @@ export default function LayoutJob_NonUserView({
         }
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/vote/create/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentVote_HeaderTamplate from "../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutVote_Create({
   children,
@@ -11,9 +12,9 @@ export default function LayoutVote_Create({
 }) {
   return (
     <>
-      <AppShell header={<ComponentVote_HeaderTamplate title="Tambah Vote" />}>
+      <AppComponentGlobal_LayoutTamplate header={<ComponentVote_HeaderTamplate title="Tambah Vote" />}>
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/vote/detail/draft/layout.tsx

@@ -5,6 +5,7 @@ import React from "react";
 import ComponentVote_HeaderTamplate from "../../component/header_tamplate";
 import { IconEdit } from "@tabler/icons-react";
 import { RouterVote } from "@/app/lib/router_hipmi/router_vote";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutVote_DetailDraft({
   children,
@@ -15,7 +16,7 @@ export default function LayoutVote_DetailDraft({
 }) {
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={
           <ComponentVote_HeaderTamplate
             title="Detail Draft"
@@ -25,7 +26,7 @@ export default function LayoutVote_DetailDraft({
         }
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/vote/detail/kontribusi/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentVote_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutVote_DetailKontribusi({
   children,
@@ -11,11 +12,11 @@ export default function LayoutVote_DetailKontribusi({
 }) {
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={<ComponentVote_HeaderTamplate title="Detail Kontribusi" />}
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/vote/detail/main/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentVote_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutVote_MainDetail({
   children,
@@ -11,9 +12,11 @@ export default function LayoutVote_MainDetail({
 }) {
   return (
     <>
-      <AppShell header={<ComponentVote_HeaderTamplate title="Detail Voting" />}>
+      <AppComponentGlobal_LayoutTamplate
+        header={<ComponentVote_HeaderTamplate title="Detail Voting" />}
+      >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/vote/detail/publish/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentVote_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutVote_DetailPublish({
   children,
@@ -11,9 +12,11 @@ export default function LayoutVote_DetailPublish({
 }) {
   return (
     <>
-      <AppShell header={<ComponentVote_HeaderTamplate title="Detail Publish" />}>
+      <AppComponentGlobal_LayoutTamplate
+        header={<ComponentVote_HeaderTamplate title="Detail Publish" />}
+      >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/vote/detail/reject/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentVote_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutVote_DetailReject({
   children,
@@ -11,9 +12,11 @@ export default function LayoutVote_DetailReject({
 }) {
   return (
     <>
-      <AppShell header={<ComponentVote_HeaderTamplate title="Detail Reject" />}>
+      <AppComponentGlobal_LayoutTamplate
+        header={<ComponentVote_HeaderTamplate title="Detail Reject" />}
+      >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/vote/detail/review/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentVote_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutVote_DetailReview({
   children,
@@ -11,9 +12,11 @@ export default function LayoutVote_DetailReview({
 }) {
   return (
     <>
-      <AppShell header={<ComponentVote_HeaderTamplate title="Detail Review" />}>
+      <AppComponentGlobal_LayoutTamplate
+        header={<ComponentVote_HeaderTamplate title="Detail Review" />}
+      >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/vote/detail/riwayat_saya/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentVote_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutVote_DetailRiwayatSaya({
   children,
@@ -11,11 +12,11 @@ export default function LayoutVote_DetailRiwayatSaya({
 }) {
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={<ComponentVote_HeaderTamplate title="Detail Riwayat" />}
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/vote/detail/semua_riwayat/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentVote_HeaderTamplate from "../../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutVote_DetailSemuaRiwayat({
   children,
@@ -11,11 +12,11 @@ export default function LayoutVote_DetailSemuaRiwayat({
 }) {
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={<ComponentVote_HeaderTamplate title="Detail Riwayat" />}
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/vote/edit/layout.tsx

@@ -3,6 +3,7 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentVote_HeaderTamplate from "../component/header_tamplate";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutVote_Edit({
   children,
@@ -11,9 +12,9 @@ export default function LayoutVote_Edit({
 }) {
   return (
     <>
-      <AppShell header={<ComponentVote_HeaderTamplate title="Edit Vote" />}>
+      <AppComponentGlobal_LayoutTamplate header={<ComponentVote_HeaderTamplate title="Edit Vote" />}>
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }

src/app_modules/vote/index.tsx

@@ -20,9 +20,9 @@ import Vote_MainDetail from "./detail/main";
 import LayoutVote_MainDetail from "./detail/main/layout";
 import Vote_DetailKontribusi from "./detail/kontribusi";
 import LayoutVote_DetailKontribusi from "./detail/kontribusi/layout";
-import Vote_DetailSemuaRiwayat from "./detail/semua_riwayat/page";
+import Vote_DetailSemuaRiwayat from "./detail/semua_riwayat";
 import LayoutVote_DetailSemuaRiwayat from "./detail/semua_riwayat/layout";
-import Vote_DetailRiwayatSaya from "./detail/riwayat_saya/page";
+import Vote_DetailRiwayatSaya from "./detail/riwayat_saya";
 import LayoutVote_DetailRiwayatSaya from "./detail/riwayat_saya/layout";
 
 export {

src/app_modules/vote/main/beranda.tsx

@@ -37,7 +37,7 @@ export default function Vote_Beranda({
 
   return (
     <>
-      <Affix position={{ bottom: rem(100), right: rem(30) }}>
+      <Affix position={{ bottom: rem(150), right: rem(30) }}>
         <ActionIcon
           size={"xl"}
           radius={"xl"}

src/app_modules/vote/main/layout.tsx

@@ -22,6 +22,7 @@ import {
 import { gs_vote_hotMenu } from "../global_state";
 import { useAtom } from "jotai";
 import { RouterHome } from "@/app/lib/router_hipmi/router_home";
+import AppComponentGlobal_LayoutTamplate from "@/app_modules/component_global/component_layout_tamplate";
 
 export default function LayoutVote_Main({
   children,
@@ -61,7 +62,7 @@ export default function LayoutVote_Main({
 
   return (
     <>
-      <AppShell
+      <AppComponentGlobal_LayoutTamplate
         header={
           <ComponentVote_HeaderTamplate
             title="Voting"
@@ -69,39 +70,42 @@ export default function LayoutVote_Main({
           />
         }
         footer={
-          <Footer height={70} bg={"dark"} sx={{ borderTop: "px solid blue" }}>
-            <Grid>
-              {listFooter.map((e, i) => (
-                <Grid.Col
-                  key={e.id}
-                  span={"auto"}
-                  pt={"md"}
-                  onClick={() => {
-                    router.replace(e.path);
-                    setHotMenu(i);
-                  }}
-                >
-                  <Center>
-                    <Stack align="center" spacing={0}>
-                      <ActionIcon
-                        variant="transparent"
-                        c={hotMenu === i ? "blue" : "white"}
-                      >
-                        {e.icon}
-                      </ActionIcon>
-                      <Text fz={10} c={hotMenu === i ? "blue" : "white"}>
-                        {e.name}
-                      </Text>
-                    </Stack>
-                  </Center>
-                </Grid.Col>
-              ))}
-            </Grid>
+          <Footer
+            height={"10vh"}
+            bg={"dark"}
+            sx={{ borderTop: "px solid blue" }}
+          >
+            <Stack h={"100%"} justify="center">
+              <Grid>
+                {listFooter.map((e, i) => (
+                  <Grid.Col key={e.id} span={"auto"} pt={"md"}>
+                    <Center
+                      onClick={() => {
+                        router.replace(e.path);
+                        setHotMenu(i);
+                      }}
+                    >
+                      <Stack align="center" spacing={0}>
+                        <ActionIcon
+                          variant="transparent"
+                          c={hotMenu === i ? "blue" : "white"}
+                        >
+                          {e.icon}
+                        </ActionIcon>
+                        <Text fz={10} c={hotMenu === i ? "blue" : "white"}>
+                          {e.name}
+                        </Text>
+                      </Stack>
+                    </Center>
+                  </Grid.Col>
+                ))}
+              </Grid>
+            </Stack>
           </Footer>
         }
       >
         {children}
-      </AppShell>
+      </AppComponentGlobal_LayoutTamplate>
     </>
   );
 }