wibu/sistem-desa-mandiri
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style : update style

Browse Source
This commit is contained in:
lukman
2024-09-13 17:15:46 +08:00
parent 5d72c78aba
commit e4175d17f8
7 changed files with 166 additions and 168 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
src/module/task/ui/tabs_division_task.tsx
View File

@@ -1,5 +1,5 @@
'use client'
import { Box, Button, rem, Tabs } from "@mantine/core";
import { Box, Button, Flex, rem, Tabs } from "@mantine/core";
import { IoIosCheckmarkCircleOutline } from "react-icons/io";
import { IoCloseCircleOutline } from "react-icons/io5";
import { RiProgress3Line } from "react-icons/ri";
@@ -42,60 +42,40 @@ export default function TabsDivisionTask() {
return (
<Box p={20}>
{/* <Tabs variant="pills" color='#FF9861' radius="xl" defaultValue={(status == "1" || status == "2" || status == "3") ? status : "0"}>
<Tabs.List grow bg={"white"} style={{
border: `1px solid ${"#EDEDED"}`,
padding: 5,
borderRadius: 100
}}>
<Tabs.Tab value="0" w={"23%"}
leftSection={<TbClockPause style={iconStyle} />}
onClick={() => { router.push("?status=0") }}>
Segera
</Tabs.Tab>
<Tabs.Tab value="1" w={"28%"}
leftSection={<RiProgress3Line style={iconStyle} />}
onClick={() => { router.push("?status=1") }}>
Dikerjakan
</Tabs.Tab>
<Tabs.Tab value="2" w={"23%"}
leftSection={<IoIosCheckmarkCircleOutline style={iconStyle} />}
onClick={() => { router.push("?status=2") }}>
Selesai
</Tabs.Tab>
<Tabs.Tab value="3" w={"20%"}
leftSection={<IoCloseCircleOutline style={iconStyle} />}
onClick={() => { router.push("?status=3") }}>
Batal
</Tabs.Tab>
</Tabs.List>
<ListDivisionTask />
</Tabs> */}
<Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withIndicators withControls={false}>
<Box
style={{
display: "flex",
gap: "20px",
position: "relative",
overflowX: "scroll",
scrollbarWidth: "none",
maxWidth: "550px"
}}
>
<Flex gap={"md"} justify={"space-between"}>
{dataStatus.map((item, index) => (
<Carousel.Slide key={index}>
<Button
variant="subtle"
color={
status == item.id
? "white"
: (status == null && item.id == "0") ? "white" : tema.get().utama
}
onClick={() => { router.push("?status=" + item.id) }}
defaultValue={(status == "1" || status == "2" || status == "3") ? status : "0"}
radius={"xl"}
bg={
status == item.id
? tema.get().bgFiturDivisi
: (status == null && item.id == "0") ? tema.get().bgFiturDivisi : "transparent"
}
>
{item.icon}
<Box ml={10}>{item.title}</Box>
</Button>
</Carousel.Slide>
<Button
variant="subtle"
color={
status == item.id
? "white"
: (status == null && item.id == "0") ? "white" : tema.get().utama
}
onClick={() => { router.push("?status=" + item.id) }}
defaultValue={(status == "1" || status == "2" || status == "3") ? status : "0"}
radius={"xl"}
bg={
status == item.id
? tema.get().bgFiturDivisi
: (status == null && item.id == "0") ? tema.get().bgFiturDivisi : "transparent"
}
leftSection={item.icon}
>
{item.title}
</Button>
))}
</Carousel>
</Flex>
</Box>
<ListDivisionTask />
</Box>
)