wibu/hipmi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add All Skeleton Except Collaboration

Browse Source
This commit is contained in:
nico
2024-12-30 17:37:44 +08:00
parent 82a55d7148
commit a74a32b422
55 changed files with 305 additions and 219 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/app_modules/vote/component/card_view_publish.tsx
View File

@@ -1,6 +1,6 @@
"use client";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { AccentColor, MainColor } from "@/app_modules/_global/color/color_pallet";
import {
ComponentGlobal_AvatarAndUsername,
ComponentGlobal_CardLoadingOverlay,
@@ -66,7 +66,7 @@ export default function ComponentVote_CardViewPublish({
root: {
backgroundColor: AccentColor.blue,
border: `1px solid ${AccentColor.skyblue}`,
color: "white",
color: MainColor.white,
width: "70%",
},
}}

4
src/app_modules/vote/component/card_view_status.tsx
View File

@@ -1,6 +1,6 @@
"use client";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { AccentColor, MainColor } from "@/app_modules/_global/color/color_pallet";
import {
ComponentGlobal_CardLoadingOverlay,
ComponentGlobal_CardStyles,
@@ -46,7 +46,7 @@ export default function ComponentVote_CardViewStatus({
root: {
backgroundColor: AccentColor.blue,
border: `1px solid ${AccentColor.skyblue}`,
color: "white",
color: MainColor.white,
width: "70%",
},
}}

11
src/app_modules/vote/component/detail/comp_layout_header_detail_publish.tsx
View File

@@ -1,5 +1,5 @@
import { RouterVote } from "@/app/lib/router_hipmi/router_vote";
import { AccentColor } from "@/app_modules/_global/color";
import { AccentColor, MainColor } from "@/app_modules/_global/color";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil";
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal";
@@ -26,6 +26,7 @@ import { voting_funUpdateIsArsipById } from "../../fun";
import { MODEL_VOTING } from "../../model/interface";
import { voting_funGetOneVotingbyId } from "../../fun/get/fun_get_one_by_id";
export function Voting_ComponentLayoutHeaderDetailPublish({
votingId,
title,
@@ -177,7 +178,7 @@ function BoxIsAuthor({
{/* Daftar Kontributor */}
<ActionIcon
variant="transparent"
c="white"
c={MainColor.white}
onClick={() => {
setIsLoading(true);
router.push(RouterVote.daftar_kontributor + votingId, {
@@ -187,7 +188,7 @@ function BoxIsAuthor({
>
{isLoading ? <ComponentGlobal_Loader /> : <IconUsersGroup />}
</ActionIcon>
<Text fz={"sm"} align="center" color="white">
<Text fz={"sm"} align="center" color={MainColor.white}>
Daftar Kontributor
</Text>
</Stack>
@@ -195,7 +196,7 @@ function BoxIsAuthor({
{/* Arsip button */}
<ActionIcon
variant="transparent"
c="white"
c={MainColor.white}
onClick={() => {
onSetDrawer({
drawer: false,
@@ -206,7 +207,7 @@ function BoxIsAuthor({
>
<IconArchive />
</ActionIcon>
<Text fz={"sm"} align="center" color="white">
<Text fz={"sm"} align="center" color={MainColor.white}>
Update Arsip
</Text>
</Stack>

6
src/app_modules/vote/component/detail/detail_data_sebelum_publish.tsx
View File

@@ -10,7 +10,7 @@ import {
} from "@mantine/core";
import { IconCircle } from "@tabler/icons-react";
import { MODEL_VOTING } from "../../model/interface";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { AccentColor, MainColor } from "@/app_modules/_global/color/color_pallet";
export default function ComponentVote_DetailDataSebelumPublish
({
@@ -26,7 +26,7 @@ export default function ComponentVote_DetailDataSebelumPublish
backgroundColor: AccentColor.darkblue,
borderRadius: "10px",
border: `2px solid ${AccentColor.blue}`,
color: "white",
color: MainColor.white,
}}
>
<Card.Section px={"xs"}>
@@ -49,7 +49,7 @@ export default function ComponentVote_DetailDataSebelumPublish
root: {
backgroundColor: AccentColor.blue,
border: `1px solid ${AccentColor.skyblue}`,
color: "white",
color: MainColor.white,
width: "80%",
},
}}

4
src/app_modules/vote/component/detail/detail_data_setelah_publish.tsx
View File

@@ -1,5 +1,5 @@
"use client";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { AccentColor, MainColor } from "@/app_modules/_global/color/color_pallet";
import {
ComponentGlobal_AvatarAndUsername,
ComponentGlobal_CardStyles,
@@ -43,7 +43,7 @@ export default function ComponentVote_DetailDataSetelahPublish({
root: {
backgroundColor: AccentColor.blue,
border: `1px solid ${AccentColor.skyblue}`,
color: "white",
color: MainColor.white,
width: "80%",
},
}}

4
src/app_modules/vote/component/detail/detail_hasil_voting.tsx
View File

@@ -1,6 +1,6 @@
"use client";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { AccentColor, MainColor } from "@/app_modules/_global/color/color_pallet";
import {
Avatar,
Card,
@@ -25,7 +25,7 @@ export default function ComponentVote_HasilVoting({
backgroundColor: AccentColor.darkblue,
borderRadius: "10px",
border: `2px solid ${AccentColor.blue}`,
color: "white",
color: MainColor.white,
}}
>
<Card.Section>

79
src/app_modules/vote/component/skeleton_view.tsx
View File

@@ -1,5 +1,6 @@
import { ComponentGlobal_CardStyles } from "@/app_modules/_global/component";
import { Center, Grid, Group, Skeleton, Stack } from "@mantine/core";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
import { Center, Grid, Group, Stack } from "@mantine/core";
export {
Voting_ComponentSkeletonDetail,
@@ -17,25 +18,25 @@ function Voting_ComponentSkeletonViewPublish() {
<Stack spacing={"lg"}>
<Grid align="center">
<Grid.Col span={"content"}>
<Skeleton circle height={40} />
<CustomSkeleton circle height={40} />
</Grid.Col>
<Grid.Col span={4}>
<Skeleton height={20} w={150} />
<CustomSkeleton height={20} w={150} />
</Grid.Col>
</Grid>
<Stack align="center">
<Skeleton height={20} w={150} />
<Skeleton height={20} w={300} />
{/* <Skeleton height={20} w={70} /> */}
<CustomSkeleton height={20} w={150} />
<CustomSkeleton height={20} w={300} />
{/* <CustomSkeleton height={20} w={70} /> */}
</Stack>
<Grid grow>
{Array.from({ length: 2 }).map((e, i) => (
<Grid.Col span={4} key={i}>
<Stack align="center">
<Skeleton circle height={70} />
<Skeleton height={20} w={50} />
<CustomSkeleton circle height={70} />
<CustomSkeleton height={20} w={50} />
</Stack>
</Grid.Col>
))}
@@ -53,8 +54,8 @@ function Voting_ComponentSkeletonViewStatus() {
{Array.from({ length: 2 }).map((e, i) => (
<ComponentGlobal_CardStyles key={i}>
<Stack align="center" spacing="lg">
<Skeleton height={20} w={150} />
<Skeleton height={20} w={300} />
<CustomSkeleton height={20} w={150} />
<CustomSkeleton height={20} w={300} />
</Stack>
</ComponentGlobal_CardStyles>
))}
@@ -70,31 +71,31 @@ function Voting_ComponentSkeletonViewKontribusi() {
<Stack spacing={"lg"}>
<Grid align="center">
<Grid.Col span={"content"}>
<Skeleton circle height={40} />
<CustomSkeleton circle height={40} />
</Grid.Col>
<Grid.Col span={4}>
<Skeleton height={20} w={150} />
<CustomSkeleton height={20} w={150} />
</Grid.Col>
</Grid>
<Stack align="center">
<Skeleton height={20} w={150} />
<Skeleton height={20} w={300} />
<CustomSkeleton height={20} w={150} />
<CustomSkeleton height={20} w={300} />
</Stack>
<Group position="center" spacing={100}>
<Stack align="center">
<Skeleton circle height={70} />
<Skeleton height={20} w={50} />
<CustomSkeleton circle height={70} />
<CustomSkeleton height={20} w={50} />
</Stack>
<Stack align="center">
<Skeleton circle height={70} />
<Skeleton height={20} w={50} />
<CustomSkeleton circle height={70} />
<CustomSkeleton height={20} w={50} />
</Stack>
</Group>
<Stack align="center">
<Skeleton height={15} w={50} /> <Skeleton height={20} w={50} />
<CustomSkeleton height={15} w={50} /> <CustomSkeleton height={20} w={50} />
</Stack>
</Stack>
</ComponentGlobal_CardStyles>
@@ -111,30 +112,30 @@ function Voting_ComponentSkeletonDetail() {
<Stack spacing={"xl"}>
<Grid align="center">
<Grid.Col span={"content"}>
<Skeleton circle height={40} />
<CustomSkeleton circle height={40} />
</Grid.Col>
<Grid.Col span={4}>
<Skeleton height={20} w={150} />
<CustomSkeleton height={20} w={150} />
</Grid.Col>
</Grid>
<Stack align="center">
<Skeleton height={20} w={150} />
<Skeleton height={20} w={"100%"} />
<Skeleton height={20} w={"100%"} />
<Skeleton height={20} w={"100%"} />
<Skeleton height={20} w={50} />
<Skeleton height={20} w={200} />
<CustomSkeleton height={20} w={150} />
<CustomSkeleton height={20} w={"100%"} />
<CustomSkeleton height={20} w={"100%"} />
<CustomSkeleton height={20} w={"100%"} />
<CustomSkeleton height={20} w={50} />
<CustomSkeleton height={20} w={200} />
</Stack>
{/* <Stack>
<Skeleton height={20} w={70} />
<Skeleton height={20} w={150} />
<Skeleton height={20} w={150} />
<CustomSkeleton height={20} w={70} />
<CustomSkeleton height={20} w={150} />
<CustomSkeleton height={20} w={150} />
</Stack> */}
<Stack align="center">
<Skeleton height={20} w={70} />
<CustomSkeleton height={20} w={70} />
</Stack>
</Stack>
</ComponentGlobal_CardStyles>
@@ -142,17 +143,17 @@ function Voting_ComponentSkeletonDetail() {
<ComponentGlobal_CardStyles>
<Stack>
<Center>
<Skeleton h={20} w={"30%"} />
<CustomSkeleton h={20} w={"30%"} />
</Center>
<Group position="center" spacing={50}>
<Stack align="center">
<Skeleton circle height={70} />
<Skeleton height={20} w={50} />
<CustomSkeleton circle height={70} />
<CustomSkeleton height={20} w={50} />
</Stack>
<Stack align="center">
<Skeleton circle height={70} />
<Skeleton height={20} w={50} />
<CustomSkeleton circle height={70} />
<CustomSkeleton height={20} w={50} />
</Stack>
</Group>
</Stack>
@@ -169,13 +170,13 @@ function Voting_ComponentSkeletonDaftarKontributor(){
<Stack spacing={"xl"}>
<Grid align="center" gutter={"md"}>
<Grid.Col span={"content"}>
<Skeleton circle height={40} />
<CustomSkeleton circle height={40} />
</Grid.Col>
<Grid.Col span={3}>
<Skeleton height={20} w={150} />
<CustomSkeleton height={20} w={150} />
</Grid.Col>
<Grid.Col span={3} offset={3}>
<Skeleton height={20} w={150} />
<CustomSkeleton height={20} w={150} />
</Grid.Col>
</Grid>
</Stack>

3
src/app_modules/vote/main/beranda.tsx
View File

@@ -2,7 +2,7 @@
import { gs_votingTiggerBeranda } from "@/app/lib/global_state";
import { RouterVote } from "@/app/lib/router_hipmi/router_vote";
import { AccentColor } from "@/app_modules/_global/color";
import { AccentColor, MainColor } from "@/app_modules/_global/color";
import ComponentGlobal_CreateButton from "@/app_modules/_global/component/button_create";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import { clientLogger } from "@/util/clientLogger";
@@ -119,6 +119,7 @@ export default function Vote_Beranda() {
radius={"xl"}
placeholder="Masukan judul voting"
onChange={(val) => onSearch(val.target.value)}
styles={{ input: { backgroundColor: MainColor.white } }}
/>
<ComponentGlobal_CreateButton path={RouterVote.create} />

2
src/app_modules/vote/main/layout.tsx
View File

@@ -70,7 +70,7 @@ export default function LayoutVote_Main({
<ActionIcon
// disabled={e.path === "" ? true : false}
variant="transparent"
c={hotMenu === e.id ? MainColor.yellow : "white"}
c={hotMenu === e.id ? MainColor.yellow : MainColor.white}
onClick={() =>
e.path === ""
? ComponentGlobal_NotifikasiPeringatan("Cooming Soon")

4
src/app_modules/vote/main/riwayat/index.tsx
View File

@@ -60,11 +60,11 @@ export default function Vote_Riwayat() {
style={{
transition: "0.5s",
backgroundColor:
params.id === e.id ? MainColor.yellow : "white",
params.id === e.id ? MainColor.yellow : MainColor.white,
border:
params.id === e.id
? `1px solid ${AccentColor.yellow}`
: `1px solid white`,
: `1px solid ${MainColor.white}`,
}}
>
{e.label}

2
src/app_modules/vote/main/status/draft.tsx
View File

@@ -69,7 +69,7 @@ export default function Vote_StatusDraft() {
{(item) => (
<ComponentVote_CardViewStatus
data={item}
path={RouterVote.detail_review}
path={RouterVote.detail_draft}
/>
)}
</ScrollOnly>

2
src/app_modules/vote/main/status/index.tsx
View File

@@ -68,7 +68,7 @@ export default function Vote_Status() {
style={{
transition: "0.5s",
backgroundColor:
params.id === e.id ? MainColor.yellow : "white",
params.id === e.id ? MainColor.yellow : MainColor.white,
border:
params.id === e.id
? `1px solid ${AccentColor.yellow}`

2
src/app_modules/vote/main/status/reject.tsx
View File

@@ -69,7 +69,7 @@ export default function Vote_StatusReject() {
{(item) => (
<ComponentVote_CardViewStatus
data={item}
path={RouterVote.detail_review}
path={RouterVote.detail_reject}
/>
)}
</ScrollOnly>