From 4e99bfe1878620769d48532b182692e51c7266ef Mon Sep 17 00:00:00 2001 From: rohan09-raj Date: Sun, 14 Aug 2022 00:19:58 +0530 Subject: admin panel and api integration --- admin/src/components/Accordion/Accordion.jsx | 35 ++++++++++++++++++++++ .../src/components/Accordion/Accordion.module.css | 29 ++++++++++++++++++ 2 files changed, 64 insertions(+) create mode 100644 admin/src/components/Accordion/Accordion.jsx create mode 100644 admin/src/components/Accordion/Accordion.module.css (limited to 'admin/src/components/Accordion') diff --git a/admin/src/components/Accordion/Accordion.jsx b/admin/src/components/Accordion/Accordion.jsx new file mode 100644 index 0000000..fefd39b --- /dev/null +++ b/admin/src/components/Accordion/Accordion.jsx @@ -0,0 +1,35 @@ +import React, {useState} from 'react'; + +import styles from './Accordion.module.css'; + +const Accordion = ({name, user}) => { + const [isActive, setIsActive] = useState(false); + + return ( +
+
setIsActive(!isActive)} + > +

{name}

+
+
+ {isActive && ( +
+
Indian Resident : {user.indianResident}
+
Name : {user.name}
+
Gender : {user.gender}
+
Date of Birth : {user.dob}
+
Mobile Number : {user.mobile}
+
Email : {user.email}
+
Address : {user.address}
+
Photograph : {user.photo}
+
Documents : {user.documents.doc1}
+
Biometrics : {user.biometrics.bio1}
+
+ )} +
+ ); +}; + +export default Accordion; diff --git a/admin/src/components/Accordion/Accordion.module.css b/admin/src/components/Accordion/Accordion.module.css new file mode 100644 index 0000000..86a1c7b --- /dev/null +++ b/admin/src/components/Accordion/Accordion.module.css @@ -0,0 +1,29 @@ +.accordion { + width: 600px; + margin: 2rem auto; +} + +.accordion__title { + display: flex; + flex-direction: row; + justify-content: space-between; + cursor: pointer; + background-color: #2c3e50; + color: #ecf0f1; + border-radius: 10px; + box-shadow: 0 4px 4px -2px rgba(0, 0, 0, 0.5); +} + +.accordion__title:hover { + background-color: #17212b; +} + +.accordion__title, +.accordion__content { + padding: 1rem; +} + +.accordion__content { + background-color: #ecf0f1; + border-radius: 10px; +} -- cgit