diff --git a/src/Pages/ManageGroups/AddGroup.tsx b/src/Pages/ManageGroups/AddGroup.tsx new file mode 100644 index 0000000..fa2f5f4 --- /dev/null +++ b/src/Pages/ManageGroups/AddGroup.tsx @@ -0,0 +1,67 @@ +import { Button } from "../../components/ui/button" +import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog" +import { Avatar, Box, Field, Heading, Input, Stack, Text } from "@chakra-ui/react" +import { Switch } from "../../components/ui/switch"; +import { IoMdAdd } from "react-icons/io"; +function AddGroup() { + return ( + + + + + + + + + + Add + + + + + + + Group Name + + + Group Introduction + + + + + + + + + + + + public/Private + + + + + + + + + + + ) +} + +export default AddGroup \ No newline at end of file diff --git a/src/Pages/ManageGroups/EditDetailGroup.tsx b/src/Pages/ManageGroups/EditDetailGroup.tsx new file mode 100644 index 0000000..e81f7b2 --- /dev/null +++ b/src/Pages/ManageGroups/EditDetailGroup.tsx @@ -0,0 +1,85 @@ +import { Button } from "../../components/ui/button" +import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog" +import { Avatar, Box, Field, Heading, Input, Stack, Text } from "@chakra-ui/react" +import { Switch } from "../../components/ui/switch"; +import { FaRegEdit } from "react-icons/fa"; +import { AvatarGroup } from "../../components/ui/avatar"; +function EditDetailGroups() { + return ( + + + + + {/* */} + + + + + + Edit details + + + + + + + Group Name + + + Description + + + Members + + + + + + + + + + + + + + + + + + + +3 + + + + + public/Private + + + + + + + + + + ) +} + +export default EditDetailGroups \ No newline at end of file diff --git a/src/Pages/ManageGroups/ManageGroups.tsx b/src/Pages/ManageGroups/ManageGroups.tsx index 871c889..f055d68 100644 --- a/src/Pages/ManageGroups/ManageGroups.tsx +++ b/src/Pages/ManageGroups/ManageGroups.tsx @@ -1,11 +1,107 @@ +import { Box, HStack, Image, Input, Text } from "@chakra-ui/react" import MainFrame from "../../components/MainFrame" +import { InputGroup } from "../../components/ui/input-group" +import { LuSearch } from "react-icons/lu" +import DataTable from "../../components/DataTable" +import AlertDailog from "../../components/AlertDailog" +import { RiDeleteBin5Line } from "react-icons/ri"; +import AddModel from "../SubAdmin/AddModel" +import EditSubAdmin from "../../components/EditSubAdmin" +import ViewManageGroup from "./ViewManageGroup" +import EditDetailGroups from "./EditDetailGroup" +import AddGroup from "./AddGroup" +// import ViewSubAdmin from "./ViewSubAdmin" + +// table data + +const tableHeadRow = [ + "Sr. No", + "Group Name", + "Description", + "Date", + "Group type", + "Action", +]; + +const managepost: any[] = [ + ...Array.from({ length: 12 }, (_, i) => ({ + "Sr. No": i + 1, + "Group Name": "ABC", + "Description": "Lorem ipsum", + "Date": "12/01/1987", + "Group type": "Private", + "Action": ( + + + {/* */} + + + + {/* */} + } + alertCaption="are you sure you want to delete ?" + onConfirm={() => { + console.log("User deleted:", i + 1); + }} + /> + + ), + })), +]; const ManageGroups = () => { return ( + - ManageGroups - + + + + Manage Groups + + + + + } + color={"#000"} + > + + + {/* */} + + + + + ) } - export default ManageGroups \ No newline at end of file diff --git a/src/Pages/ManageGroups/ViewManageGroup.tsx b/src/Pages/ManageGroups/ViewManageGroup.tsx new file mode 100644 index 0000000..61c6971 --- /dev/null +++ b/src/Pages/ManageGroups/ViewManageGroup.tsx @@ -0,0 +1,93 @@ +import { Button } from "../../components/ui/button" +import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog" +import { Avatar, Box, Field, Grid, Heading, Input, Stack, Text } from "@chakra-ui/react" +import { Checkbox } from "../../components/ui/checkbox" +import { MdOutlineRemoveRedEye } from "react-icons/md"; +import { Switch } from "../../components/ui/switch"; +import { AvatarGroup } from "../../components/ui/avatar"; +function ViewManageGroup() { + return ( + + + + + {/* */} + + + + + + View details + + + + + + + Group Name + + + Description + + + Members + + + + + + + + + + + + + + + + + + + +3 + + + + + + + + + + public/Private + + + + + + + + + ) +} + +export default ViewManageGroup \ No newline at end of file diff --git a/src/Pages/ManageJobs/ManageJobs.tsx b/src/Pages/ManageJobs/ManageJobs.tsx index 62b3355..0f7bc00 100644 --- a/src/Pages/ManageJobs/ManageJobs.tsx +++ b/src/Pages/ManageJobs/ManageJobs.tsx @@ -1,13 +1,16 @@ -import { Box, HStack, Image, Input, Text } from "@chakra-ui/react"; +import { Box, createListCollection, HStack, Image, Input, Text } from "@chakra-ui/react"; import MainFrame from "../../components/MainFrame" -import ViewSubAdmin from "../../components/ViewSubAdmin"; +import ViewSubAdmin from "../SubAdmin/ViewSubAdmin"; import EditSubAdmin from "../../components/EditSubAdmin"; import AlertDailog from "../../components/AlertDailog"; import { InputGroup } from "../../components/ui/input-group"; import { LuSearch } from "react-icons/lu"; -import AddModel from "../../components/AddModel"; +import AddModel from "../SubAdmin/AddModel"; import DataTable from "../../components/DataTable"; import { RiDeleteBin5Line } from "react-icons/ri"; +import ManageJobsAdd from "./ManageJobsAdd"; +import { SelectContent, SelectItem, SelectLabel, SelectRoot, SelectTrigger, SelectValueText } from "../../components/ui/select"; +import ViewManageJob from "./ViewManageJob"; // table data @@ -37,9 +40,8 @@ const managepost: any[] = [ style={{ cursor: "pointer", fontSize: "16px" }} /> */} {/* */} - - - + + {/* */} + + + + + + + Add Details + + + + + + Job title + + + Workspace mode + + + Category + + + Sub-Category + + + Salary + + + Experience + + + Job Location + + + {/* Country Selection + */} + + Country Selection + + + + + {frameworks.items.map((movie) => ( + + {movie.label} + + ))} + + + + + Job type + + + Skills required + + + Job Description* + + + + + + + + + + + + + + ) +} + +export default ManageJobsAdd \ No newline at end of file diff --git a/src/Pages/ManageJobs/ViewManageJob.tsx b/src/Pages/ManageJobs/ViewManageJob.tsx new file mode 100644 index 0000000..c8b574b --- /dev/null +++ b/src/Pages/ManageJobs/ViewManageJob.tsx @@ -0,0 +1,112 @@ +import { Button } from "../../components/ui/button" +import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog" +import { createListCollection, Field, Input, SelectValueText, Stack, } from "@chakra-ui/react" + +import { FaRegEdit } from "react-icons/fa" +import { SelectContent, SelectItem, SelectLabel, SelectRoot, SelectTrigger } from "../../components/ui/select" +import { MdOutlineRemoveRedEye } from "react-icons/md" + +const frameworks = createListCollection({ + items: [ + { label: "React.js", value: "react" }, + { label: "Vue.js", value: "vue" }, + { label: "Angular", value: "angular" }, + { label: "Svelte", value: "svelte" }, + ], +}) +function ViewManageJob() { + return ( + + + + + + + + + + Add Details + + + + + + Job title + + + Workspace mode + + + Category + + + Sub-Category + + + Salary + + + Experience + + + Job Location + + + {/* Country Selection + */} + + Country Selection + + + + + {frameworks.items.map((movie) => ( + + {movie.label} + + ))} + + + + + Job type + + + Skills required + + + Job Description* + + Upload Image + + + + + + + + + + + + + + ) +} + +export default ViewManageJob \ No newline at end of file diff --git a/src/Pages/ManagePost/ManagePost.tsx b/src/Pages/ManagePost/ManagePost.tsx index 7522180..ec47225 100644 --- a/src/Pages/ManagePost/ManagePost.tsx +++ b/src/Pages/ManagePost/ManagePost.tsx @@ -8,7 +8,8 @@ import AlertDailog from '../../components/AlertDailog' import { Switch } from '../../components/ui/switch' import img from "../../assets/waterfall.jpg" import { RiDeleteBin5Line } from "react-icons/ri"; -import ViewDailog from '../../components/ViewDailog' +import ViewDailog from './ViewDailog' +// import ViewDailog from './ViewDailog' // table data diff --git a/src/Pages/ManagePost/ViewDailog.tsx b/src/Pages/ManagePost/ViewDailog.tsx new file mode 100644 index 0000000..446b26a --- /dev/null +++ b/src/Pages/ManagePost/ViewDailog.tsx @@ -0,0 +1,51 @@ +import { MdOutlineRemoveRedEye } from "react-icons/md" +import { Button } from "../../components/ui/button" +import { DialogBody, DialogCloseTrigger, DialogContent, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog" +import { Field, Image, Input, Stack } from "@chakra-ui/react" +import img from "../../assets/waterfall.jpg" +function ViewDailog() { + return ( + + + + + + + + + View Details + + + + + + Title + + + Subtitle + + + Description + + + Image + + + + + + + + + + ) +} + +export default ViewDailog \ No newline at end of file diff --git a/src/Pages/SubAdmin/AddModel.tsx b/src/Pages/SubAdmin/AddModel.tsx new file mode 100644 index 0000000..6395eeb --- /dev/null +++ b/src/Pages/SubAdmin/AddModel.tsx @@ -0,0 +1,80 @@ +import { Button } from "../../components/ui/button" +import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog" +import { Field, Grid, Heading, Input, Stack, Text } from "@chakra-ui/react" +import { IoMdAdd } from "react-icons/io" +import { Checkbox } from "../../components/ui/checkbox" + +function AddModel() { + return ( + + + + {/* */} + + + + + + + Add Sub Admin Account + + + + + + + First Name + + + Last Name + + + DOB + + + Gender + + Permissions + + + Dashboard + Manage contact us + manage User + Manage CMS + Manage Post + Manage Reports + manage Sub-Admin + My profile + Manage Jobs + manage feedbacks + Manage community + Notification + + + + + + + + + + + + ) +} + +export default AddModel \ No newline at end of file diff --git a/src/Pages/SubAdmin/SubAdmin.tsx b/src/Pages/SubAdmin/SubAdmin.tsx index 3484b81..28c943d 100644 --- a/src/Pages/SubAdmin/SubAdmin.tsx +++ b/src/Pages/SubAdmin/SubAdmin.tsx @@ -3,12 +3,11 @@ import MainFrame from "../../components/MainFrame" import { InputGroup } from "../../components/ui/input-group" import { LuSearch } from "react-icons/lu" import DataTable from "../../components/DataTable" -import ViewDailog from "../../components/ViewDailog" import AlertDailog from "../../components/AlertDailog" import { RiDeleteBin5Line } from "react-icons/ri"; -import AddModel from "../../components/AddModel" +import AddModel from "./AddModel" import EditSubAdmin from "../../components/EditSubAdmin" -import ViewSubAdmin from "../../components/ViewSubAdmin" +import ViewSubAdmin from "./ViewSubAdmin" // table data diff --git a/src/Pages/SubAdmin/ViewSubAdmin.tsx b/src/Pages/SubAdmin/ViewSubAdmin.tsx new file mode 100644 index 0000000..dbe4f88 --- /dev/null +++ b/src/Pages/SubAdmin/ViewSubAdmin.tsx @@ -0,0 +1,84 @@ +import { Button } from "../../components/ui/button" +import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog" +import { Field, Grid, Heading, Input, Stack, Text } from "@chakra-ui/react" +import { Checkbox } from "../../components/ui/checkbox" +import { MdOutlineRemoveRedEye } from "react-icons/md"; +function ViewSubAdmin() { + return ( + + + + + {/* */} + + + + + + View Sub Admin Account + + + + + + + First Name + + + Last Name + + + ID + + + DOB + + + Gender + + Permissions + + + Dashboard + Manage contact us + manage User + Manage CMS + Manage Post + Manage Reports + manage Sub-Admin + My profile + Manage Jobs + manage feedbacks + Manage community + Notification + + + + {/* + + */} + + + + + + ) +} + +export default ViewSubAdmin \ No newline at end of file diff --git a/src/components/AddModel.tsx b/src/components/AddModel.tsx deleted file mode 100644 index e6a7e87..0000000 --- a/src/components/AddModel.tsx +++ /dev/null @@ -1,76 +0,0 @@ -import { Button } from "./ui/button" -import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "./ui/dialog" -import { Field, Grid, Input, Stack, Text } from "@chakra-ui/react" -import { IoMdAdd } from "react-icons/io" -import { Checkbox } from "./ui/checkbox" - -function AddModel() { - return ( - - - - {/* */} - - - - - - - Add Sub Admin Account - - - - - - - First Name - - - Last Name - - - DOB - - - Gender - - permission - - - Dashboard - Manage contact us - manage User - Manage CMS - Manage Post - Manage Reports - manage Sub-Admin - My profile - Manage Jobs - manage feedbacks - Manage community - Notification - - - - - - - - - - - - ) -} - -export default AddModel \ No newline at end of file diff --git a/src/components/AlertDailog.tsx b/src/components/AlertDailog.tsx index f7799e5..efee69c 100644 --- a/src/components/AlertDailog.tsx +++ b/src/components/AlertDailog.tsx @@ -1,6 +1,6 @@ import React from "react"; -import { DialogBody, HStack, Icon, Text } from "@chakra-ui/react"; +import { DialogBody, HStack, Icon, Image, Text } from "@chakra-ui/react"; import { Button } from "./ui/button"; import { DialogActionTrigger, @@ -54,7 +54,7 @@ const AlertDailog: React.FC = ({ {/* */} - {/* */} + {/* */} {/* */} - - Edit Sub Admin Account + + Edit Sub Admin Account - + - First Name - + First Name + - Last Name - + Last Name + - DOB - + DOB + + + Gender + + Permissions - Gender - - permission - - Dashboard - Manage contact us - manage User - Manage CMS - Manage Post - Manage Reports - manage Sub-Admin - My profile - Manage Jobs - manage feedbacks - Manage community - Notification + + Dashboard + Manage contact us + manage User + Manage CMS + Manage Post + Manage Reports + manage Sub-Admin + My profile + Manage Jobs + manage feedbacks + Manage community + Notification diff --git a/src/components/ViewDailog.tsx b/src/components/ViewDailog.tsx deleted file mode 100644 index fa39063..0000000 --- a/src/components/ViewDailog.tsx +++ /dev/null @@ -1,87 +0,0 @@ -import { MdOutlineRemoveRedEye } from "react-icons/md" -import { Button } from "./ui/button" -import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "./ui/dialog" -import { Field, Image, Input, Stack } from "@chakra-ui/react" -import img from "../assets/waterfall.jpg" -function ViewDailog() { - return ( - // - // - // - // - // - // - // View Details - // - // - // - // - // Title - // - // Title - // - // Title - // - // Image - // - // - - // - // - // {/* - // - // - // - // - // */} - // - // - // - - - - - - - - View Details - - - - - - Title - - - Subtitle - - - Description - - - Image - - - - - - - - - - ) -} - -export default ViewDailog \ No newline at end of file diff --git a/src/components/ViewSubAdmin.tsx b/src/components/ViewSubAdmin.tsx deleted file mode 100644 index cf79d72..0000000 --- a/src/components/ViewSubAdmin.tsx +++ /dev/null @@ -1,76 +0,0 @@ -import { Button } from "./ui/button" -import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "./ui/dialog" -import { Field, Grid, Input, Stack, Text } from "@chakra-ui/react" -import { Checkbox } from "./ui/checkbox" -import { FaRegEdit } from "react-icons/fa"; -import { MdOutlineRemoveRedEye } from "react-icons/md"; -function ViewSubAdmin() { - return ( - - - - - {/* */} - - - - - - View Sub Admin Account - - - - - - - First Name - - - Last Name - - - DOB - - - Gender - - permission - - - Dashboard - Manage contact us - manage User - Manage CMS - Manage Post - Manage Reports - manage Sub-Admin - My profile - Manage Jobs - manage feedbacks - Manage community - Notification - - - - {/* - - */} - - - - - - ) -} - -export default ViewSubAdmin \ No newline at end of file diff --git a/src/index.css b/src/index.css index 0afb1ee..ff86a1b 100644 --- a/src/index.css +++ b/src/index.css @@ -3,7 +3,7 @@ -*{ +* { margin: 0; padding: 0; box-sizing: border-box; @@ -16,8 +16,8 @@ body { font-family: "Roboto", serif; } -.Oxygen{ - font-family: "Oxygen", serif +.Oxygen { + font-family: "Oxygen", serif } @@ -39,12 +39,12 @@ body { -.linkChild:hover{ +.linkChild:hover { color: #02A0A0 !important; transition: all 0.5s; } -.activeChild{ +.activeChild { color: #02A0A0 !important; /* border: 1px solid #02A0A0 !important; */ @@ -52,7 +52,7 @@ body { border-radius: 8px; } -.link{ +.link { transition: all 0.5s; } @@ -69,8 +69,8 @@ body { /* ✅ Red Spheres */ .red-sphere-1, -.red-sphere-2, -.red-sphere-3{ +.red-sphere-2, +.red-sphere-3 { position: absolute; border-radius: 50%; background-color: #D90B2E46; @@ -81,7 +81,7 @@ body { /* ✅ Blue Spheres */ .blue-sphere-1, .blue-sphere-2, -.blue-sphere-3{ +.blue-sphere-3 { position: absolute; border-radius: 50%; background-color: #009DAB46; @@ -125,7 +125,7 @@ body { left: 40%; } -.blue-sphere-3{ +.blue-sphere-3 { width: 300px; height: 300px; bottom: 10%; @@ -135,8 +135,10 @@ body { /* Style the scrollbar */ ::-webkit-scrollbar { - width: 6px; /* Width of the vertical scrollbar */ - height: 12px; /* Height of the horizontal scrollbar */ + width: 6px; + /* Width of the vertical scrollbar */ + height: 12px; + /* Height of the horizontal scrollbar */ } /* Style the scrollbar track (the background area) */ @@ -150,14 +152,20 @@ body { background-color: #c8c8c8cf; /* Gray color for the thumb */ border-radius: 10px; - border: 1px solid #f1f1f1; /* Border around the thumb */ + border: 1px solid #f1f1f1; + /* Border around the thumb */ } /* Style the scrollbar thumb on hover */ ::-webkit-scrollbar-thumb:hover { - background-color: #555; /* Darker gray when hovered */ + background-color: #555; + /* Darker gray when hovered */ } input:focus-visible { border: none !important; } + +.css-1ilznyv { + border: none; +} \ No newline at end of file