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

Merge pull request #217 from bipproduction/lukman/11-september-2024

Browse Source 
style : update style
This commit is contained in:
Amalia
2024-09-11 11:12:50 +08:00
committed by GitHub
parent c974954385 5a9b1c079f
commit 5882eee29a
5 changed files with 47 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@@ -23,7 +23,7 @@
"@mantine/form": "^7.11.0", "@mantine/form": "^7.11.0",
"@mantine/hooks": "^7.11.0", "@mantine/hooks": "^7.11.0",
"@mantine/modals": "^7.11.0", "@mantine/modals": "^7.11.0",
"@mantine/notifications": "^7.11.0", "@mantine/notifications": "^7.12.2",
"@mantine/nprogress": "^7.11.0", "@mantine/nprogress": "^7.11.0",
"@mantine/spotlight": "^7.11.0", "@mantine/spotlight": "^7.11.0",
"@mantine/tiptap": "^7.11.0", "@mantine/tiptap": "^7.11.0",

3
src/app/layout.tsx
View File

@@ -11,6 +11,8 @@ import { Lato } from "next/font/google";
import '@mantine/carousel/styles.css'; import '@mantine/carousel/styles.css';
import { Toaster } from 'react-hot-toast'; import { Toaster } from 'react-hot-toast';
import '@mantine/dates/styles.css'; import '@mantine/dates/styles.css';
import '@mantine/notifications/styles.css';
import { Notifications } from '@mantine/notifications'
export const metadata = { export const metadata = {
title: "SISTEM DESA MANDIRI", title: "SISTEM DESA MANDIRI",
@@ -35,6 +37,7 @@ export default function RootLayout({
</head> </head>
<body className={`${LatoFont.className}`} suppressHydrationWarning> <body className={`${LatoFont.className}`} suppressHydrationWarning>
<MantineProvider> <MantineProvider>
<Notifications />
<Box bg={'#252A2F'} pos={"fixed"} w={"100%"} h={"100%"} style={{ <Box bg={'#252A2F'} pos={"fixed"} w={"100%"} h={"100%"} style={{
overflowY: "auto", overflowY: "auto",
}}> }}>

6
src/module/home/ui/icon_navbar.tsx
View File

@@ -1,6 +1,6 @@
"use client" "use client"
import { WARNA } from '@/module/_global'; import { WARNA } from '@/module/_global';
import { ActionIcon, Box, Group } from '@mantine/core'; import { ActionIcon, Box, Group, Indicator, Text } from '@mantine/core';
import { useRouter } from 'next/navigation'; import { useRouter } from 'next/navigation';
import React from 'react'; import React from 'react';
import { HiMagnifyingGlass, HiOutlineBell, HiOutlineUser } from 'react-icons/hi2'; import { HiMagnifyingGlass, HiOutlineBell, HiOutlineUser } from 'react-icons/hi2';
@@ -13,9 +13,11 @@ export default function IconNavbar() {
<ActionIcon onClick={() => router.push('/home?cat=search')} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings"> <ActionIcon onClick={() => router.push('/home?cat=search')} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
<HiMagnifyingGlass size={20} color='white' /> <HiMagnifyingGlass size={20} color='white' />
</ActionIcon> </ActionIcon>
<Indicator inline label={"9"} size={18} color={"red"} offset={3}>
<ActionIcon onClick={() => router.push('/home?cat=notification')} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings"> <ActionIcon onClick={() => router.push('/home?cat=notification')} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
<HiOutlineBell size={20} color='white' /> <HiOutlineBell size={20} color='white' />
</ActionIcon> </ActionIcon>
</Indicator>
<ActionIcon onClick={() => router.push('/profile')} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings"> <ActionIcon onClick={() => router.push('/profile')} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
<HiOutlineUser size={20} color='white' /> <HiOutlineUser size={20} color='white' />
</ActionIcon> </ActionIcon>

32
src/module/home/ui/view_home.tsx
View File

@@ -1,6 +1,7 @@
import { LayoutNavbarHome } from '@/module/_global'; "use client"
import { Box, Group, Stack, Text } from '@mantine/core'; import { LayoutNavbarHome, WARNA } from '@/module/_global';
import React from 'react'; import { Box, Group, Notification, Stack, Text } from '@mantine/core';
import React, { useState } from 'react';
import Carosole from './carosole'; import Carosole from './carosole';
import Features from './features'; import Features from './features';
import IconNavbar from './icon_navbar'; import IconNavbar from './icon_navbar';
@@ -10,9 +11,34 @@ import ListDiscussion from './list_discussion';
import ListEventHome from './list_event'; import ListEventHome from './list_event';
import ChartProgressHome from './chart_progress_tugas'; import ChartProgressHome from './chart_progress_tugas';
import ChartDocumentHome from './chart_document'; import ChartDocumentHome from './chart_document';
import { useShallowEffect } from '@mantine/hooks';
import { notifications, Notifications } from '@mantine/notifications';
import { IoNotifications } from 'react-icons/io5';
import { ImCheckboxUnchecked } from 'react-icons/im';
export default function ViewHome() { export default function ViewHome() {
const [isNotif, setIsNotif] = useState(true);
useShallowEffect(() => {
if (isNotif) {
notifications.show({
color: WARNA.biruTua,
title: <Text lineClamp={1}>Pengumuman Upacara bendera Upacara bendera Upacara bendera Upacara bendera</Text>,
message: <Text lineClamp={1}>Upacara bendera Upacara bendera Upacara bendera Upacara bendera Upacara bendera</Text>,
icon: <IoNotifications/>,
loading: false,
autoClose: 5000,
position: "top-center",
radius: 'lg',
bg: "white",
style: {
border: `1px solid #0A8072FF`,
},
onClose: () => setIsNotif(false)
});
}
}, [isNotif]);
return ( return (
<> <>
<LayoutNavbarHome> <LayoutNavbarHome>

15
yarn.lock
View File

@@ -232,12 +232,12 @@
resolved "https://registry.yarnpkg.com/@mantine/modals/-/modals-7.11.1.tgz#6759e8422f84acf63d4e32a3376bb06050efa870" resolved "https://registry.yarnpkg.com/@mantine/modals/-/modals-7.11.1.tgz#6759e8422f84acf63d4e32a3376bb06050efa870"
integrity sha512-SDHhpt7O+Y8rTW5RaXFqIIjuD87efUqhC5kxqLyRsuivQ+tk4gMY37R5gR8o0yC6vifKBzjjYVFeeGTLocRTBg== integrity sha512-SDHhpt7O+Y8rTW5RaXFqIIjuD87efUqhC5kxqLyRsuivQ+tk4gMY37R5gR8o0yC6vifKBzjjYVFeeGTLocRTBg==
"@mantine/notifications@^7.11.0": "@mantine/notifications@^7.12.2":
version "7.11.1" version "7.12.2"
resolved "https://registry.yarnpkg.com/@mantine/notifications/-/notifications-7.11.1.tgz#27eae093259b438bc9ffd26a0c87a498176e1372" resolved "https://registry.yarnpkg.com/@mantine/notifications/-/notifications-7.12.2.tgz#531a6a3f23adc579b0a8f322ccf42b1789327698"
integrity sha512-4MpuePstpWvCwiEX75oUAdxp3SXWsiq0+fd4zb5YMu+CaqiaDbUIOupEpi/uCez3lYhY0ojHyjNgYsqZ7cy1Fg== integrity sha512-gTvLHkoAZ42v5bZxibP9A50djp5ndEwumVhHSa7mxQ8oSS23tt3It/6hOqH7M+9kHY0a8s+viMiflUzTByA9qg==
dependencies: dependencies:
"@mantine/store" "7.11.1" "@mantine/store" "7.12.2"
react-transition-group "4.4.5" react-transition-group "4.4.5"
"@mantine/nprogress@^7.11.0": "@mantine/nprogress@^7.11.0":
@@ -259,6 +259,11 @@
resolved "https://registry.yarnpkg.com/@mantine/store/-/store-7.11.1.tgz#3e833cffacbc964cb5fe71707c6dafdbf4f4c55e" resolved "https://registry.yarnpkg.com/@mantine/store/-/store-7.11.1.tgz#3e833cffacbc964cb5fe71707c6dafdbf4f4c55e"
integrity sha512-5xOompA7pADDvYlw6KEr0YIr95bdFI0W/KZizi8E/BKOLVUpku1UvqcClodq4U0Xjz5eZt/Jf3gEV9lyJbt8Zw== integrity sha512-5xOompA7pADDvYlw6KEr0YIr95bdFI0W/KZizi8E/BKOLVUpku1UvqcClodq4U0Xjz5eZt/Jf3gEV9lyJbt8Zw==
"@mantine/store@7.12.2":
version "7.12.2"
resolved "https://registry.yarnpkg.com/@mantine/store/-/store-7.12.2.tgz#da576a63d860d44525bd18c9dd3977b6d2840011"
integrity sha512-NqL31sO/KcAETEWP/CiXrQOQNoE4168vZsxyXacQHGBueVMJa64WIDQtKLHrCnFRMws3vsXF02/OO4bH4XGcMQ==
"@mantine/tiptap@^7.11.0": "@mantine/tiptap@^7.11.0":
version "7.11.1" version "7.11.1"
resolved "https://registry.yarnpkg.com/@mantine/tiptap/-/tiptap-7.11.1.tgz#faff7bdc369457c9c8cf9c690b97db234e94c1d9" resolved "https://registry.yarnpkg.com/@mantine/tiptap/-/tiptap-7.11.1.tgz#faff7bdc369457c9c8cf9c690b97db234e94c1d9"