From 180961ec2036ea9e221a8cd19acf7bf60b0f7b3f Mon Sep 17 00:00:00 2001 From: Daria Golova Date: Thu, 26 May 2022 15:59:34 +0300 Subject: [PATCH 1/6] create table --- src/pages/digitalId/ProfileId.jsx | 54 ++--- src/partials/digitalId/ProfileTable.jsx | 222 ++++++++++++++++++++ src/partials/digitalId/ProfileTableItem.jsx | 4 +- 3 files changed, 247 insertions(+), 33 deletions(-) create mode 100644 src/partials/digitalId/ProfileTable.jsx diff --git a/src/pages/digitalId/ProfileId.jsx b/src/pages/digitalId/ProfileId.jsx index 4d85496..d74c2a7 100644 --- a/src/pages/digitalId/ProfileId.jsx +++ b/src/pages/digitalId/ProfileId.jsx @@ -2,25 +2,11 @@ import React, { useState } from 'react'; import Sidebar from '../../partials/Sidebar'; import Header from '../../partials/Header'; -import ProfileTableItem from '../../partials/digitalId/ProfileTableItem'; -import ProfileIcon from '../../images/profile-icon.svg'; -import Avatar01 from '../../images/avatar-01.jpg'; -import Avatar02 from '../../images/avatar-02.jpg'; -import Avatar03 from '../../images/avatar-03.jpg'; +import ProfileTable from '../../partials/digitalId/ProfileTable'; function Profile () { const [sidebarOpen, setSidebarOpen] = useState(false); - const data = { - id: '0', - image: ProfileIcon, - value: 'Passport', - property: 'Document type', - status: 'Progress', - transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], - avatars: [Avatar01, Avatar02, Avatar03] - }; - return (
{/* Sidebar */} @@ -32,25 +18,31 @@ function Profile () {
{/* Page header */} -
+
{/* Title */} -

Profile ✨

+
+
    +
  • + +
    • +
  • + +
    • +
  • + +
    • +
+
+ {/* Page content */} {/* Table */} - - - - -
+
diff --git a/src/partials/digitalId/ProfileTable.jsx b/src/partials/digitalId/ProfileTable.jsx new file mode 100644 index 0000000..f0f6b5f --- /dev/null +++ b/src/partials/digitalId/ProfileTable.jsx @@ -0,0 +1,222 @@ +import React from 'react'; +import ProfileTableItem from './ProfileTableItem'; +import ProfileIcon from '../../images/profile-icon.svg'; +import Avatar01 from '../../images/avatar-01.jpg'; +import Avatar02 from '../../images/avatar-02.jpg'; +import Avatar03 from '../../images/avatar-03.jpg'; + +function ProfileTable() { + + const userData = [ + { + id: '0', + category: 'General', + validated: true, + blockchained: true, + image: ProfileIcon, + value: 'Dominik', + property: 'First name', + status: 'Completed', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: [Avatar01, Avatar02, Avatar03] + }, + { + id: '1', + category: 'General', + validated: true, + blockchained: true, + image: ProfileIcon, + value: 'Lamakani', + property: 'Second name', + status: 'Progress', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: null + }, + { + id: '2', + category: 'General', + validated: true, + blockchained: true, + image: ProfileIcon, + value: '05.10.1983', + property: 'Birthdate', + status: 'Incorrect', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: null + }, + { + id: '3', + category: 'General', + validated: true, + blockchained: true, + image: ProfileIcon, + value: 'Male', + property: 'Gender', + status: 'Stored', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: null + }, + { + id: '4', + category: 'Nationality', + validated: true, + blockchained: true, + image: ProfileIcon, + value: 'United Kindom', + property: 'Residence', + status: 'Completed', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: [Avatar01, Avatar02, Avatar03] + }, + { + id: '5', + category: 'Nationality', + validated: true, + blockchained: true, + image: ProfileIcon, + value: 'Passport', + property: 'Document type', + status: 'Progress', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: [Avatar01, Avatar02, Avatar03] + }, + { + id: '6', + category: 'Nationality', + validated: true, + blockchained: true, + image: ProfileIcon, + value: 'A123B3143', + property: 'Document ID', + status: 'Incorrect', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: null + }, + { + id: '7', + category: 'Nationality', + validated: true, + blockchained: true, + image: ProfileIcon, + value: '05.10.2012', + property: 'Issue date', + status: 'Stored', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: null + }, + { + id: '8', + category: 'Nationality', + validated: true, + blockchained: true, + image: ProfileIcon, + value: '05.10.2032', + property: 'Expiry date', + status: 'Stored', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: null + }, + { + id: '9', + category: 'Social', + validated: true, + blockchained: true, + image: ProfileIcon, + value: '@lamakani', + property: 'Telegram', + status: 'Completed', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: null + }, + { + id: '10', + category: 'Social', + validated: true, + blockchained: true, + image: ProfileIcon, + value: '@lamakani', + property: 'Telegram', + status: 'Progress', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: [Avatar01, Avatar02, Avatar03] + }, + ] + + return ( + <> +

General 🖋️

+
+ + + {userData.filter(data => data.category === 'General') + .map(data => { + return ( + + ) + }) + } + +
+
+ +

Nationality 🖋️

+
+ + + {userData.filter(data => data.category === 'Nationality') + .map(data => { + return ( + + ) + }) + } + +
+
+ +

Social 🖋️

+
+ + + {userData.filter(data => data.category === 'Social') + .map(data => { + return ( + + ) + }) + } + +
+
+ + ) +} + +export default ProfileTable; diff --git a/src/partials/digitalId/ProfileTableItem.jsx b/src/partials/digitalId/ProfileTableItem.jsx index 5a17432..ccc8faa 100644 --- a/src/partials/digitalId/ProfileTableItem.jsx +++ b/src/partials/digitalId/ProfileTableItem.jsx @@ -5,7 +5,7 @@ function ProfileTableItem(props) { return ( <> - +
- +
From 99d235f5e7aa29e5b5d91af1162454a007f5d036 Mon Sep 17 00:00:00 2001 From: Daria Golova Date: Thu, 26 May 2022 18:05:07 +0300 Subject: [PATCH 2/6] create add field form --- src/pages/digitalId/ProfileId.jsx | 80 ++++++++++++++++++------- src/partials/digitalId/ProfileTable.jsx | 2 +- 2 files changed, 58 insertions(+), 24 deletions(-) diff --git a/src/pages/digitalId/ProfileId.jsx b/src/pages/digitalId/ProfileId.jsx index d74c2a7..731792e 100644 --- a/src/pages/digitalId/ProfileId.jsx +++ b/src/pages/digitalId/ProfileId.jsx @@ -6,6 +6,7 @@ import ProfileTable from '../../partials/digitalId/ProfileTable'; function Profile () { const [sidebarOpen, setSidebarOpen] = useState(false); + const [toggle, setToggle] = useState(true); return (
@@ -17,32 +18,65 @@ function Profile () {
- {/* Page header */} -
- {/* Title */} +
+ {/* Page header */}
-
    -
  • - -
    • -
  • - -
    • -
  • - -
    • -
+ {/* Title */} +
+
    +
  • + +
    • +
  • + +
    • +
  • + +
    • +
+
+ {/* Table */} + +
+ {/* Sidebar */} +
+
+
+
+ + +
+
+ + +
+
+ + +
+
+
+ Store data on blockchain + {/* Start */} +
+
+ setToggle(!toggle)} /> + +
+
+
+ {/* End */} +
- {/* Page content */} - {/* Table */} -
diff --git a/src/partials/digitalId/ProfileTable.jsx b/src/partials/digitalId/ProfileTable.jsx index f0f6b5f..095d624 100644 --- a/src/partials/digitalId/ProfileTable.jsx +++ b/src/partials/digitalId/ProfileTable.jsx @@ -147,7 +147,7 @@ function ProfileTable() {

General 🖋️

- + {userData.filter(data => data.category === 'General') .map(data => { return ( From d31a2f09d549d226c80ee5a17230fb564ed3c274 Mon Sep 17 00:00:00 2001 From: Daria Golova Date: Fri, 27 May 2022 12:35:36 +0300 Subject: [PATCH 3/6] fix form for adding fields --- src/pages/digitalId/ProfileId.jsx | 49 +++++++++++++++++++++++++++++-- 1 file changed, 46 insertions(+), 3 deletions(-) diff --git a/src/pages/digitalId/ProfileId.jsx b/src/pages/digitalId/ProfileId.jsx index 731792e..cc9898d 100644 --- a/src/pages/digitalId/ProfileId.jsx +++ b/src/pages/digitalId/ProfileId.jsx @@ -3,6 +3,7 @@ import React, { useState } from 'react'; import Sidebar from '../../partials/Sidebar'; import Header from '../../partials/Header'; import ProfileTable from '../../partials/digitalId/ProfileTable'; +import Image from '../../images/transactions-image-04.svg'; function Profile () { const [sidebarOpen, setSidebarOpen] = useState(false); @@ -46,6 +47,7 @@ function Profile () { {/* Sidebar */}
+ {/* Form */}
@@ -61,9 +63,8 @@ function Profile () {
-
+
Store data on blockchain - {/* Start */}
setToggle(!toggle)} /> @@ -73,7 +74,49 @@ function Profile () {
- {/* End */} + {/* Buttons */} +
+ + +
+
+ {/* Details */} +
+ {/* Top */} +
+
+ Transaction 04 +
+
0.012 IDN
+
Total amount fee
+
+ {/* Divider */} +
From a5a046f911b915b45ec2539613d7393f61b4071a Mon Sep 17 00:00:00 2001 From: Daria Golova Date: Fri, 27 May 2022 17:36:06 +0300 Subject: [PATCH 4/6] add other forms --- src/css/tailwind.config.js | 1 + src/pages/digitalId/ProfileId.jsx | 277 +++++++++++++++----- src/partials/digitalId/ProfileTable.jsx | 27 +- src/partials/digitalId/ProfileTableItem.jsx | 28 +- 4 files changed, 257 insertions(+), 76 deletions(-) diff --git a/src/css/tailwind.config.js b/src/css/tailwind.config.js index 4d79d5f..ca30b85 100644 --- a/src/css/tailwind.config.js +++ b/src/css/tailwind.config.js @@ -20,6 +20,7 @@ module.exports = { inter: ['Inter', 'sans-serif'], }, fontSize: { + descriptionSize: ['0.75rem', { lineHeight: '1.25' }], xxs: ['0.625rem', { lineHeight: '0.75' }], xs: ['0.75rem', { lineHeight: '1.5' }], sm: ['0.875rem', { lineHeight: '1.5715' }], diff --git a/src/pages/digitalId/ProfileId.jsx b/src/pages/digitalId/ProfileId.jsx index cc9898d..8a17a34 100644 --- a/src/pages/digitalId/ProfileId.jsx +++ b/src/pages/digitalId/ProfileId.jsx @@ -6,17 +6,49 @@ import ProfileTable from '../../partials/digitalId/ProfileTable'; import Image from '../../images/transactions-image-04.svg'; function Profile () { - const [sidebarOpen, setSidebarOpen] = useState(false); + const [leftSidebarOpen, setLeftSidebarOpen] = useState(false); + const [rightSidebarOpen, setRightSidebarOpen] = useState(true); + const [removeFormOpen, setRemoveFormOpen] = useState(false); + const [changeFormOpen, setChangeFormOpen] = useState(false); const [toggle, setToggle] = useState(true); + const [formOpen, setFormOpen] = useState(false); + const [selectedItems, setSelectedItems] = useState([]); + const handleSelectedItems = (selectedItems) => { + setSelectedItems([...selectedItems]); + if (selectedItems.length > 0) { + setRightSidebarOpen(false); + setChangeFormOpen(true); + } + }; + + const openAddForm = () => { + setFormOpen(true); + setRightSidebarOpen(false); + } + + const cancelAddForm = () => { + setFormOpen(false); + setRightSidebarOpen(true); + } + + const openRemoveForm = () => { + setRemoveFormOpen(true); + setChangeFormOpen(false); + } + + const canselRemoveForm = () => { + setRemoveFormOpen(false); + setRightSidebarOpen(true); + } return (
{/* Sidebar */} - + {/* Content area */}
{/* Site header */} -
+
@@ -43,78 +75,203 @@ function Profile () {
{/* Table */} - +
- {/* Sidebar */} + {/* left Sidebar */}
- {/* Form */} -
-
-
- - + {/* Form with button*/} +
+
+ +
+
+ {/* Add Form */} +
+
+
+
+ + +
+
+ + +
+
+ + +
-
- - +
+ Store data on blockchain +
+
+ setToggle(!toggle)} /> + +
+
-
- - + {/* Buttons */} +
+ +
-
- Store data on blockchain -
-
- setToggle(!toggle)} /> - + {/* Details */} +
+ {/* Top */} +
+
+ Transaction 04 +
+
0.012 IDN
+
Total amount fee
+
+ {/* Divider */} + - {/* Buttons */} -
- - +
+ {/* Field change form */} +
+
+ + +
- {/* Details */} -
- {/* Top */} -
-
- Transaction 04 + {/* Remove form */} +
+
+

Summary

+
+ Second name + Birthday +
+
+ On blockchain too +
+
+ setToggle(!toggle)} /> + +
+
+
+ {/* Buttons */} +
+ +
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do Terms.
-
0.012 IDN
-
Total amount fee
- {/* Divider */} -
From b40b59af3f497db78989f2408998cab2933da104 Mon Sep 17 00:00:00 2001 From: Daria Golova Date: Mon, 30 May 2022 16:07:22 +0300 Subject: [PATCH 5/6] fix left sidebar --- src/pages/digitalId/ProfileId.jsx | 338 ++++++++++++++++-------- src/partials/digitalId/ProfileTable.jsx | 147 +---------- 2 files changed, 228 insertions(+), 257 deletions(-) diff --git a/src/pages/digitalId/ProfileId.jsx b/src/pages/digitalId/ProfileId.jsx index 8a17a34..d68aa5d 100644 --- a/src/pages/digitalId/ProfileId.jsx +++ b/src/pages/digitalId/ProfileId.jsx @@ -1,60 +1,207 @@ import React, { useState } from 'react'; - import Sidebar from '../../partials/Sidebar'; import Header from '../../partials/Header'; import ProfileTable from '../../partials/digitalId/ProfileTable'; import Image from '../../images/transactions-image-04.svg'; +import ProfileIcon from '../../images/profile-icon.svg'; +import Avatar01 from '../../images/avatar-01.jpg'; +import Avatar02 from '../../images/avatar-02.jpg'; +import Avatar03 from '../../images/avatar-03.jpg'; function Profile () { - const [leftSidebarOpen, setLeftSidebarOpen] = useState(false); - const [rightSidebarOpen, setRightSidebarOpen] = useState(true); - const [removeFormOpen, setRemoveFormOpen] = useState(false); - const [changeFormOpen, setChangeFormOpen] = useState(false); + const [sidebarOpen, setSidebarOpen] = useState(false); + const [buttonPanelOpen, setButtonPanelOpen] = useState(true); + const [removePanelOpen, setRemovePanelOpen] = useState(false); + const [changePanelOpen, setChangePanelOpen] = useState(false); const [toggle, setToggle] = useState(true); - const [formOpen, setFormOpen] = useState(false); + const [addPanelOpen, setAddPanelOpen] = useState(false); const [selectedItems, setSelectedItems] = useState([]); const handleSelectedItems = (selectedItems) => { setSelectedItems([...selectedItems]); if (selectedItems.length > 0) { - setRightSidebarOpen(false); - setChangeFormOpen(true); + setButtonPanelOpen(false); + setAddPanelOpen(false); + setChangePanelOpen(true); + } + if (removePanelOpen === true) { + setChangePanelOpen(false); + } + if (selectedItems.length === 0) { + setRemovePanelOpen(false); + setButtonPanelOpen(true); + setChangePanelOpen(false); } }; - const openAddForm = () => { - setFormOpen(true); - setRightSidebarOpen(false); + const openAddPanel = () => { + setAddPanelOpen(true); + setButtonPanelOpen(false); } - const cancelAddForm = () => { - setFormOpen(false); - setRightSidebarOpen(true); + const cancelAddPanel = () => { + setAddPanelOpen(false); + setButtonPanelOpen(true); } - const openRemoveForm = () => { - setRemoveFormOpen(true); - setChangeFormOpen(false); + const openRemovePanel = () => { + setRemovePanelOpen(true); + setChangePanelOpen(false); } - const canselRemoveForm = () => { - setRemoveFormOpen(false); - setRightSidebarOpen(true); + const applyRemovePanel = () => { + setRemovePanelOpen(false); + setButtonPanelOpen(true); } + + const userData = [ + { + id: '0', + category: 'General', + validated: true, + blockchained: true, + image: ProfileIcon, + value: 'Dominik', + property: 'First name', + status: 'Completed', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: [Avatar01, Avatar02, Avatar03] + }, + { + id: '1', + category: 'General', + validated: true, + blockchained: true, + image: ProfileIcon, + value: 'Lamakani', + property: 'Second name', + status: 'Progress', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: null + }, + { + id: '2', + category: 'General', + validated: true, + blockchained: true, + image: ProfileIcon, + value: '05.10.1983', + property: 'Birthdate', + status: 'Incorrect', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: null + }, + { + id: '3', + category: 'General', + validated: true, + blockchained: true, + image: ProfileIcon, + value: 'Male', + property: 'Gender', + status: 'Stored', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: null + }, + { + id: '4', + category: 'Nationality', + validated: true, + blockchained: true, + image: ProfileIcon, + value: 'United Kindom', + property: 'Residence', + status: 'Completed', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: [Avatar01, Avatar02, Avatar03] + }, + { + id: '5', + category: 'Nationality', + validated: true, + blockchained: true, + image: ProfileIcon, + value: 'Passport', + property: 'Document type', + status: 'Progress', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: [Avatar01, Avatar02, Avatar03] + }, + { + id: '6', + category: 'Nationality', + validated: true, + blockchained: true, + image: ProfileIcon, + value: 'A123B3143', + property: 'Document ID', + status: 'Incorrect', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: null + }, + { + id: '7', + category: 'Nationality', + validated: true, + blockchained: true, + image: ProfileIcon, + value: '05.10.2012', + property: 'Issue date', + status: 'Stored', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: null + }, + { + id: '8', + category: 'Nationality', + validated: true, + blockchained: true, + image: ProfileIcon, + value: '05.10.2032', + property: 'Expiry date', + status: 'Stored', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: null + }, + { + id: '9', + category: 'Social', + validated: true, + blockchained: true, + image: ProfileIcon, + value: '@lamakani', + property: 'Telegram', + status: 'Completed', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: null + }, + { + id: '10', + category: 'Social', + validated: true, + blockchained: true, + image: ProfileIcon, + value: '@lamakani', + property: 'Telegram', + status: 'Progress', + transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], + avatars: [Avatar01, Avatar02, Avatar03] + }, + ] + return (
{/* Sidebar */} - + {/* Content area */}
{/* Site header */} -
+
-
+
{/* Page header */}
- {/* Title */}
  • @@ -75,16 +222,16 @@ function Profile () {
{/* Table */} - +
- {/* left Sidebar */} + {/* Left sidebar */}
- {/* Form with button*/} -
+ {/* Button panel*/} +
- {/* Add Form */} -
-
+
+ {/* Add panel */} +
@@ -125,26 +272,60 @@ function Profile () {
+ {/* Remove panel */} +
+

Summary

+
+ {userData.filter(({ id }) => selectedItems.includes(id)).map(item => ( + {item.property} + ))} +
+
+ On blockchain too +
+
+ setToggle(!toggle)} /> + +
+
+
+
+ +
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do Terms. +
+
{/* Details */} -
+
{/* Top */} -
+
Transaction 04
-
0.012 IDN
+
0.012 IDN
Total amount fee
{/* Divider */} @@ -159,8 +340,8 @@ function Profile () {
- -
+ {/* Bottom */} +
Validator: IT17 2207 1010 0504 0006 88 @@ -176,12 +357,12 @@ function Profile () {
- {/* Field change form */} -
+ {/* Change panel */} +
- {/* Remove form */} -
-
-

Summary

-
- Second name - Birthday -
-
- On blockchain too -
-
- setToggle(!toggle)} /> - -
-
-
- {/* Buttons */} -
- -
-
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do Terms. -
-
- {/* Details */} -
- {/* Top */} -
-
- Transaction 04 -
-
0.012 IDN
-
Total amount fee
-
- {/* Divider */} - -
diff --git a/src/partials/digitalId/ProfileTable.jsx b/src/partials/digitalId/ProfileTable.jsx index c2d1da1..cadad05 100644 --- a/src/partials/digitalId/ProfileTable.jsx +++ b/src/partials/digitalId/ProfileTable.jsx @@ -1,12 +1,9 @@ import React, {useState, useEffect} from 'react'; import ProfileTableItem from './ProfileTableItem'; -import ProfileIcon from '../../images/profile-icon.svg'; -import Avatar01 from '../../images/avatar-01.jpg'; -import Avatar02 from '../../images/avatar-02.jpg'; -import Avatar03 from '../../images/avatar-03.jpg'; function ProfileTable({ - selectedItems + selectedItems, + userData }) { const [isCheck, setIsCheck] = useState([]); @@ -24,143 +21,9 @@ function ProfileTable({ } }; - const userData = [ - { - id: '0', - category: 'General', - validated: true, - blockchained: true, - image: ProfileIcon, - value: 'Dominik', - property: 'First name', - status: 'Completed', - transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], - avatars: [Avatar01, Avatar02, Avatar03] - }, - { - id: '1', - category: 'General', - validated: true, - blockchained: true, - image: ProfileIcon, - value: 'Lamakani', - property: 'Second name', - status: 'Progress', - transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], - avatars: null - }, - { - id: '2', - category: 'General', - validated: true, - blockchained: true, - image: ProfileIcon, - value: '05.10.1983', - property: 'Birthdate', - status: 'Incorrect', - transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], - avatars: null - }, - { - id: '3', - category: 'General', - validated: true, - blockchained: true, - image: ProfileIcon, - value: 'Male', - property: 'Gender', - status: 'Stored', - transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], - avatars: null - }, - { - id: '4', - category: 'Nationality', - validated: true, - blockchained: true, - image: ProfileIcon, - value: 'United Kindom', - property: 'Residence', - status: 'Completed', - transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], - avatars: [Avatar01, Avatar02, Avatar03] - }, - { - id: '5', - category: 'Nationality', - validated: true, - blockchained: true, - image: ProfileIcon, - value: 'Passport', - property: 'Document type', - status: 'Progress', - transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], - avatars: [Avatar01, Avatar02, Avatar03] - }, - { - id: '6', - category: 'Nationality', - validated: true, - blockchained: true, - image: ProfileIcon, - value: 'A123B3143', - property: 'Document ID', - status: 'Incorrect', - transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], - avatars: null - }, - { - id: '7', - category: 'Nationality', - validated: true, - blockchained: true, - image: ProfileIcon, - value: '05.10.2012', - property: 'Issue date', - status: 'Stored', - transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], - avatars: null - }, - { - id: '8', - category: 'Nationality', - validated: true, - blockchained: true, - image: ProfileIcon, - value: '05.10.2032', - property: 'Expiry date', - status: 'Stored', - transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], - avatars: null - }, - { - id: '9', - category: 'Social', - validated: true, - blockchained: true, - image: ProfileIcon, - value: '@lamakani', - property: 'Telegram', - status: 'Completed', - transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], - avatars: null - }, - { - id: '10', - category: 'Social', - validated: true, - blockchained: true, - image: ProfileIcon, - value: '@lamakani', - property: 'Telegram', - status: 'Progress', - transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'], - avatars: [Avatar01, Avatar02, Avatar03] - }, - ] - return ( <> + {/* General */}

General 🖋️

{(props.status === 'Progress') ? ( -
- {props.status} -
) : - (props.status === 'Stored') ? ( -
- {props.status} -
) : - (props.status === 'Completed') ? ( -
- {props.status} -
) : ( -
- {props.status} -
) +
+ {props.status} +
) : + (props.status === 'Stored') ? ( +
+ {props.status} +
) : + (props.status === 'Completed') ? ( +
+ {props.status} +
) : ( +
+ {props.status} +
) }
@@ -186,7 +49,7 @@ function ProfileTable({
- + {/* Nationality */}

Nationality 🖋️

@@ -212,7 +75,7 @@ function ProfileTable({
- + {/* Social */}

Social 🖋️

From 3f3a56c3054edf9db0cb487973f116e5a7ad657c Mon Sep 17 00:00:00 2001 From: Daria Golova Date: Mon, 30 May 2022 16:17:11 +0300 Subject: [PATCH 6/6] rename sizes --- src/css/tailwind.config.js | 2 +- src/partials/digitalId/ProfileTableItem.jsx | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/css/tailwind.config.js b/src/css/tailwind.config.js index ca30b85..4f35c23 100644 --- a/src/css/tailwind.config.js +++ b/src/css/tailwind.config.js @@ -26,7 +26,7 @@ module.exports = { sm: ['0.875rem', { lineHeight: '1.5715' }], base: ['1rem', { lineHeight: '1.5', letterSpacing: '-0.01em' }], lg: ['1.125rem', { lineHeight: '1.5', letterSpacing: '-0.01em' }], - validateLg: ['1.125rem', { lineHeight: '1.875', letterSpacing: '-0.014em' }], + validateSize: ['1.125rem', { lineHeight: '1.875', letterSpacing: '-0.014em' }], xl: ['1.25rem', { lineHeight: '1.5', letterSpacing: '-0.01em' }], '2xl': ['1.5rem', { lineHeight: '1.33', letterSpacing: '-0.01em' }], '3xl': ['1.88rem', { lineHeight: '1.33', letterSpacing: '-0.01em' }], diff --git a/src/partials/digitalId/ProfileTableItem.jsx b/src/partials/digitalId/ProfileTableItem.jsx index d6e9168..4fd2e33 100644 --- a/src/partials/digitalId/ProfileTableItem.jsx +++ b/src/partials/digitalId/ProfileTableItem.jsx @@ -122,8 +122,8 @@ function ProfileTableItem(props) {

- Validate by - {data} + Validate by + {data}