UI Job

# style
- UI Job di bagian user selesai

# fix
- Scroll data untuk beranda dan tampilan yang lain selesi

## No issue

src/app_modules/job/component/beranda/card_view.tsx

@@ -0,0 +1,70 @@
+"use client";
+
+import { RouterJob } from "@/app/lib/router_hipmi/router_job";
+import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/component_global/author_name_on_header";
+import {
+  MainColor,
+  AccentColor,
+} from "@/app_modules/component_global/color/color_pallet";
+import ComponentGlobal_CardLoadingOverlay from "@/app_modules/component_global/loading_card";
+import { Card, Grid, Center, Text } from "@mantine/core";
+import { MODEL_JOB } from "../../model/interface";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+
+export default function ComponentJob_BerandaCardView({
+  data,
+}: {
+  data: MODEL_JOB;
+}) {
+  const router = useRouter();
+  const [visible, setVisible] = useState(false);
+  const [jobId, setJobId] = useState("");
+
+  return (
+    <>
+      <Card
+        mb={"md"}
+        shadow="lg"
+        p={30}
+        radius={"md"}
+        style={{
+          backgroundColor: MainColor.darkblue,
+          border: `2px solid ${AccentColor.blue}`,
+        }}
+      >
+        <Card.Section style={{ zIndex: 99 }}>
+          <ComponentGlobal_AuthorNameOnHeader
+            authorName={data.Author.username}
+            imagesId={data.Author.Profile.imagesId}
+            profileId={data.Author.Profile.id}
+            isPembatas={true}
+          />
+        </Card.Section>
+        <Card.Section
+          onClick={() => {
+            visible ? "" : setJobId(data.id),
+              setVisible(true),
+              router.push(RouterJob.main_detail + data.id);
+          }}
+          mt={"lg"}
+        >
+          <Grid>
+            <Grid.Col span={"auto"}>
+              <Center h={"100%"}>
+                <Text fw={"bold"} fz={"xl"} lineClamp={1} c={"white"}>
+                  {data.title}
+                </Text>
+              </Center>
+            </Grid.Col>
+          </Grid>
+        </Card.Section>
+        {visible && data.id === jobId ? (
+          <ComponentGlobal_CardLoadingOverlay />
+        ) : (
+          ""
+        )}
+      </Card>
+    </>
+  );
+}