Fix Ui Admin & User to Mobile && QC Menu Landing Page, PPID, Desa

src/app/admin/(dashboard)/landing-page/profile/media-sosial/[id]/page.tsx

@@ -51,8 +51,10 @@ function DetailMediaSosial() {
       </Button>
 
       <Paper
-      withBorder
-        w={{ base: "100%", md: "60%" }}
+        withBorder
+        w="100%"
+        maw={500} // <= tambahkan ini, biar tidak lebih dari 500px
+        mx="auto" // center di layar
         bg={colors['white-1']}
         p="lg"
         radius="md"
@@ -70,9 +72,9 @@ function DetailMediaSosial() {
                 <Text fz="md" c="dimmed">{data.name || '-'}</Text>
               </Box>
 
-              <Box>
+              <Box >
                 <Text fz="lg" fw="bold">Link / Nomor Telepon</Text>
-                <Text fz="md" c="dimmed">{data.iconUrl || '-'}</Text>
+                <Text fz="md" c="dimmed" style={{ wordBreak: "break-all", whiteSpace: "pre-wrap" }}>{data.iconUrl || '-'}</Text>
               </Box>
 
               <Box>
@@ -81,12 +83,14 @@ function DetailMediaSosial() {
                   <Image
                     src={data.image.link}
                     alt={data.name || 'Gambar Media Sosial'}
-                    w={120}
-                    h={120}
+                    w="100%"
+                    maw={120} // max width biar tidak keluar layar
+                    h="auto"
                     radius="md"
                     fit="cover"
                     loading="lazy"
                   />
+
                 ) : (
                   <Text fz="sm" c="dimmed">Tidak ada gambar</Text>
                 )}

src/app/admin/(dashboard)/landing-page/profile/pejabat-desa/[id]/page.tsx

@@ -224,7 +224,7 @@ function EditPejabatDesa() {
                       alt="Preview"
                       style={{
                         maxWidth: '100%',
-                        maxHeight: '200px',
+                        maxHeight: '150px',
                         objectFit: 'contain',
                         borderRadius: '8px',
                         border: '1px solid #ddd',

src/app/admin/(dashboard)/landing-page/profile/pejabat-desa/page.tsx

@@ -72,7 +72,7 @@ function Page() {
                     <Image
                       pt={{ base: 0, md: 60 }}
                       src={item.image?.link || "/perbekel.png"}
-                      w={{ base: 250, md: 350 }}
+                      w={{ base: 150, md: 350 }}
                       alt="Foto Profil Pejabat"
                       radius="md"
                       onError={(e) => { e.currentTarget.src = "/perbekel.png"; }}
@@ -87,7 +87,7 @@ function Page() {
                     className="glass3"
                     style={{ mt: -30, boxShadow: '0 4px 20px rgba(0,0,0,0.15)' }}
                   >
-                    <Text ta="center" c={colors['white-1']} fw="bolder" fz={{ base: "1.2rem", md: "1.6rem" }}>
+                    <Text ta="center" c={colors['white-1']} fw="bolder" fz={{ base: "1rem", md: "1.6rem" }}>
                       {item.name}
                     </Text>
                   </Paper>

src/app/admin/(dashboard)/landing-page/profile/program-inovasi/page.tsx

@@ -1,6 +1,6 @@
 'use client'
 import colors from '@/con/colors';
-import { Box, Button, Center, Pagination, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title, Tooltip } from '@mantine/core';
+import { Box, Button, Center, Group, Pagination, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title, Tooltip } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import { IconDeviceImacCog, IconPlus, IconSearch } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
@@ -49,9 +49,7 @@ function ListProgramInovasi({ search }: { search: string }) {
   return (
     <Box py={15}>
       <Paper bg={colors['white-1']} withBorder p="lg" radius="md" shadow="sm">
-        <Box mb="md" display="flex"
-          style={{ justifyContent: 'space-between', alignItems: 'center' }}
-        >
+        <Group justify='space-between'>
           <Title order={4}>Daftar Program Inovasi</Title>
           <Tooltip label="Tambah Program Inovasi" withArrow>
             <Button
@@ -64,7 +62,7 @@ function ListProgramInovasi({ search }: { search: string }) {
               Tambah Program
             </Button>
           </Tooltip>
-        </Box>
+        </Group>
         <Box style={{ overflowX: 'auto' }}>
           <Table highlightOnHover striped verticalSpacing="sm">
             <TableThead>