Merge pull request #27 from bipproduction/amalia/8-jul-24

upd: tampilan

src/module/_global/index.ts

@@ -4,6 +4,7 @@ import LayoutIconBack from "./layout/layout_icon_back";
 import LoadingPage from "./layout/layout_loading_page";
 import LayoutLogin from "./layout/layout_login";
 import LayoutNavbarHome from "./layout/layout_navbar_home";
+import LayoutNavbarNew from "./layout/layout_navbar_new";
 import { isDrawer } from "./val/isDrawer";
 import { isModal } from "./val/isModal";
 
@@ -14,4 +15,5 @@ export { LayoutIconBack }
 export { LoadingPage }
 export { LayoutDrawer }
 export { isDrawer }
-export { isModal }
+export { isModal }
+export { LayoutNavbarNew }

src/module/_global/layout/layout_drawer.tsx

@@ -10,6 +10,8 @@ export default function LayoutDrawer({ opened, onClose, title, children, size }:
           content: {
             backgroundColor: "white",
             borderRadius: "20px 20px 0px 0px",
+            maxWidth: 550,
+            margin: "0 auto",
           },
         }}
       >

src/module/_global/layout/layout_navbar_home.tsx

@@ -8,7 +8,8 @@ export const LayoutNavbarHome = ({ children }: { children: React.ReactNode }) =>
         style={{
           borderBottomLeftRadius: 20,
           borderBottomRightRadius: 20,
-          zIndex: 100
+          zIndex: 100,
+          boxShadow: "0px 4px 4px rgba(0, 0, 0, 0.25)"
         }}
       >
         {children}

src/module/_global/layout/layout_navbar_new.tsx

@@ -0,0 +1,35 @@
+'use client'
+import { ActionIcon, Box, Grid, Group, Text, Title } from '@mantine/core';
+import React from 'react';
+import { WARNA } from '../fun/WARNA';
+import LayoutIconBack from './layout_icon_back';
+import _ from 'lodash';
+
+export const LayoutNavbarNew = ({ back, title, menu }: { back: string, title: string, menu: React.ReactNode }) => {
+   return (
+      <Box pt={25} pl={20} pr={20} m={0} pos={'sticky'} top={0} pb={25} bg={WARNA.biruTua}
+         style={{
+            borderBottomLeftRadius: 20,
+            borderBottomRightRadius: 20,
+            zIndex: 100,
+            boxShadow: "0px 4px 4px rgba(0, 0, 0, 0.25)"
+         }}
+      >
+         <Grid justify='center' align='center'>
+            <Grid.Col span="auto">
+               <LayoutIconBack back={back} />
+            </Grid.Col>
+            <Grid.Col span={6}>
+               {/* <Text ta={'center'} fw={'bold'} c={'white'}>GROUP</Text> */}
+               <Title c={WARNA.bgWhite} ta={'center'} order={3}>{_.startCase(title)}</Title>
+            </Grid.Col>
+            <Grid.Col span="auto">
+               <Group justify='flex-end'>
+                  {menu}
+               </Group>
+            </Grid.Col>
+         </Grid>
+      </Box>
+   );
+}
+export default LayoutNavbarNew

src/module/announcement/component/ui/navbar_announcement.tsx

@@ -1,5 +1,5 @@
 "use client"
-import { isDrawer, LayoutDrawer, LayoutIconBack, LayoutNavbarHome, WARNA } from '@/module/_global';
+import { isDrawer, LayoutDrawer, LayoutIconBack, LayoutNavbarHome, LayoutNavbarNew, WARNA } from '@/module/_global';
 import { ActionIcon, Box, Drawer, Grid, Group, Text } from '@mantine/core';
 import { useRouter } from 'next/navigation';
 import React from 'react';
@@ -11,23 +11,12 @@ export default function NavbarAnnouncement() {
   const openDrawer = useHookstate(isDrawer)
   return (
     <>
-      <LayoutNavbarHome>
-        <Grid justify='center' align='center'>
-          <Grid.Col span="auto">
-            <LayoutIconBack back='/home' />
-          </Grid.Col>
-          <Grid.Col span={6}>
-            <Text ta={'center'} fw={'bold'} c={'white'}>PENGUMUMAN</Text>
-          </Grid.Col>
-          <Grid.Col span="auto">
-            <Group justify='flex-end'>
-              <ActionIcon onClick={() => openDrawer.set(true)} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
-                <HiMenu size={20} color='white' />
-              </ActionIcon>
-            </Group>
-          </Grid.Col>
-        </Grid>
-      </LayoutNavbarHome>
+      <LayoutNavbarNew back='/home' title='pengumuman'
+        menu={
+          <ActionIcon onClick={() => openDrawer.set(true)} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
+            <HiMenu size={20} color='white' />
+          </ActionIcon>
+        } />
       <LayoutDrawer opened={openDrawer.get()} title={'MENU'} onClose={() => openDrawer.set(false)}>
         <DrawerAnnouncement />
       </LayoutDrawer>

src/module/auth/welcome/view_welcome.tsx

@@ -1,6 +1,7 @@
 "use client";
 import {
   Anchor,
+  Box,
   Button,
   Center,
   Flex,
@@ -37,8 +38,8 @@ export function ViewWelcome() {
 
   function onLanjutkan() {
     if (index === listTextWellcome.length - 1) {
-      // return router.push("/home");
-      return window.location.href = "/home"
+      return router.replace("/home");
+      // return window.location.href = "/home"
     }
     setIndex(index + 1);
   }
@@ -51,9 +52,10 @@ export function ViewWelcome() {
   }
   return (
     <Stack>
-      <Group pos={"absolute"} top={20} right={40}>
-        <Anchor>Lewati</Anchor>
-      </Group>
+      <Flex justify={'right'} mr={30} mt={20}>
+        <Anchor onClick={() => router.replace("/home")}>Lewati</Anchor>
+      </Flex>
+
       <Stack gap={"xl"} p={"xl"} pt={50}>
         <WelcomeItem index={index} listTextWellcome={listTextWellcome} />
       </Stack>
@@ -66,6 +68,8 @@ export function ViewWelcome() {
         right={0}
         p={"xl"}
         align={"center"}
+        maw={550}
+        m={"0 auto"}
       >
         <Button
           display={index === 0 ? "none" : "block"}