style : update style

Deskripsi:
- update group
- update home
- update position
- update user profile

No Issue

src/module/home/ui/list_notification.tsx

@@ -1,6 +1,6 @@
 "use client"
 import { WARNA } from '@/module/_global';
-import { ActionIcon, Box, Center, Grid, Group, Text } from '@mantine/core';
+import { ActionIcon, Box, Center, Grid, Group, Spoiler, Text } from '@mantine/core';
 import { useRouter } from 'next/navigation';
 import React from 'react';
 import { FaBell } from 'react-icons/fa6';
@@ -8,58 +8,58 @@ import { FaBell } from 'react-icons/fa6';
 const dataNotification = [
   {
     id: 1,
-    title: 'Rapat Kamis',
-    description: 'Dipta menambahkan berkas di document dan file.',
+    title: 'Rapat Kamis Kamis Kamis Kamis Kamis Kamis Kamis Kamis ',
+    description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
   },
   {
     id: 2,
     title: 'Rapat Jumat',
-    description: 'Dipta menambahkan berkas di document dan file.',
+    description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
   },
   {
     id: 3,
     title: 'Rapat Senin',
-    description: 'Dipta menambahkan berkas di document dan file.',
+    description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
   },
   {
     id: 4,
     title: 'Rapat Selasa',
-    description: 'Dipta menambahkan berkas di document dan file.',
+    description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
   },
   {
     id: 5,
     title: 'Rapat Rabu',
-    description: 'Dipta menambahkan berkas di document dan file.',
+    description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
   },
   {
     id: 5,
     title: 'Rapat Rabu',
-    description: 'Dipta menambahkan berkas di document dan file.',
+    description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
   },
   {
     id: 5,
     title: 'Rapat Rabu',
-    description: 'Dipta menambahkan berkas di document dan file.',
+    description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
   },
   {
     id: 5,
     title: 'Rapat Rabu',
-    description: 'Dipta menambahkan berkas di document dan file.',
+    description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
   },
   {
     id: 5,
     title: 'Rapat Rabu',
-    description: 'Dipta menambahkan berkas di document dan file.',
+    description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
   },
   {
     id: 5,
     title: 'Rapat Rabu',
-    description: 'Dipta menambahkan berkas di document dan file.',
+    description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
   },
   {
     id: 5,
     title: 'Rapat Rabu',
-    description: 'Dipta menambahkan berkas di document dan file.',
+    description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
   },
 ]
 
@@ -79,9 +79,18 @@ export default function ListNotification() {
                 <ActionIcon variant="light" bg={WARNA.biruTua} size={35} radius={100} aria-label="icon">
                   <FaBell size={20} color='white' />
                 </ActionIcon>
-                <Text fw={'bold'} fz={18}>{v.title}</Text>
+                <Box
+                  w={{
+                    base: 240,
+                    xl: 380
+                }}
+                >
+                <Text fw={'bold'} fz={18} lineClamp={1}>{v.title}</Text>
+                </Box>
               </Group>
-              <Text mt={10} fz={15}>{v.description}</Text>
+              <Spoiler maxHeight={60} showLabel="Lebih banyak" hideLabel="Lebih sedikit">
+                <Text mt={10} fz={15}>{v.description}</Text>
+              </Spoiler>
             </Box>
           </Box>
         )