Merge pull request #400 from credebl/dashboard-UI-changes

fix:Dashboard UI changes
credebl · Nov 1, 2023 · 06a91f6 · 06a91f6
2 parents 7294645 + 7f04068
commit 06a91f6
Show file tree

Hide file tree

Showing 6 changed files with 18 additions and 18 deletions.
diff --git a/src/app/SideBar.astro b/src/app/SideBar.astro
@@ -162,19 +162,20 @@ import { pathRoutes } from '../config/pathRoutes';
 						>
 							<svg
 								xmlns="http://www.w3.org/2000/svg"
-								class="flex-shrink-0 w-6 h-6 pt-1 text-gray-500 transition duration-75 group-hover:text-gray-900 dark:text-gray-400 dark:group-hover:text-white"
+								width="21"
+								height="22"
 								fill="none"
-								viewBox="0 0 22 22"
+								viewBox="0 0 21 22"
 							>
 								<path
-									fill="currentColor"
-									d="M7.042.03a3.545 3.545 0 0 0-1.15.425c-.636.395-1.064.89-1.38 1.608a3.47 3.47 0 0 0-.302 1.363c-.042.988.257 1.855.88 2.569.319.368.59.586.99.792.277.143.885.338 1.059.338h.083v1.337l-.545.432c-.702.552-.633.515-.733.387-.66-.856-1.407-1.307-2.328-1.4C1.17 7.635-.651 10.234.222 12.72c.378 1.075 1.327 1.95 2.397 2.209.382.09 1.07.079 1.459-.027 1.195-.326 2.112-1.307 2.429-2.595.08-.323.11-1.111.059-1.45a6.061 6.061 0 0 0-.146-.593c-.056-.184-.09-.35-.077-.364.063-.06 1.098-.868 1.136-.883.028-.011 1.095.796 1.196.902.003.007-.039.161-.094.345-.153.492-.188.785-.167 1.326.031.781.226 1.382.65 1.99.854 1.221 2.32 1.717 3.665 1.24.507-.18.84-.402 1.244-.819.535-.552.851-1.194.98-1.99.212-1.3-.3-2.656-1.303-3.46a4.054 4.054 0 0 0-1.098-.578c-.48-.139-1.195-.139-1.689 0-.656.18-1.323.654-1.754 1.243l-.14.192-.593-.473-.598-.47V7.14l.26-.048c1.15-.207 2.13-1.078 2.55-2.258.16-.446.223-.882.202-1.408A3.41 3.41 0 0 0 10.457 2C9.814.606 8.477-.168 7.042.03Zm.927.617c1.143.218 2.043 1.194 2.245 2.437.086.537-.007 1.213-.237 1.743l-.083.195-.267-.304c-.397-.454-.82-.74-1.352-.905-.226-.071-.354-.086-.775-.086-.6 0-.875.07-1.372.349-.254.143-.382.248-.67.56l-.359.382-.083-.195c-.326-.8-.344-1.626-.055-2.388C5.31 1.522 6.107.823 7.003.65c.362-.072.601-.072.966-.004Zm-3.978 7.91c1.623.431 2.516 2.444 1.807 4.078l-.1.233-.341-.364c-.445-.477-.782-.688-1.37-.86-.312-.09-1.073-.09-1.386.003a2.944 2.944 0 0 0-.879.425c-.236.161-.618.544-.73.724-.055.087-.058.087-.103.023-.087-.128-.24-.6-.292-.905a3.468 3.468 0 0 1 .045-1.24c.125-.518.497-1.164.858-1.487.72-.653 1.588-.871 2.491-.63Zm8.269-.034c.104.018.306.086.445.146 1.452.623 2.136 2.434 1.494 3.947-.094.226-.167.32-.167.222 0-.015-.094-.143-.212-.278a3.054 3.054 0 0 0-1.421-.913c-.313-.094-1.073-.094-1.386-.004-.587.173-.924.383-1.37.86l-.34.365-.104-.233c-.184-.432-.25-.807-.233-1.34.014-.399.035-.52.122-.797.466-1.453 1.762-2.26 3.172-1.975Z"
-								></path>
-								<path
-									fill="currentColor"
-									d="M7.184.983a1.311 1.311 0 0 0-.802.736c-.118.255-.129.736-.028 1.025.097.282.337.567.604.718.195.109.24.116.542.116.296 0 .351-.011.532-.109.264-.143.518-.44.615-.725.063-.172.073-.274.063-.533-.018-.368-.09-.57-.31-.841-.278-.342-.813-.511-1.216-.387ZM3.053 8.835a1.248 1.248 0 0 0-.858.728c-.087.188-.097.256-.097.571 0 .285.017.39.076.533.104.248.365.537.598.658.17.093.236.105.524.105.285 0 .358-.015.525-.098a1.3 1.3 0 0 0 .597-.665c.24-.556.077-1.24-.385-1.603a1.143 1.143 0 0 0-.98-.23Zm8.434-.015c-.5.093-.904.533-1 1.1-.095.56.2 1.16.69 1.408.17.087.244.102.529.102.288 0 .354-.012.524-.105.233-.12.493-.41.598-.658.062-.142.076-.248.076-.533 0-.315-.01-.383-.097-.57a1.265 1.265 0 0 0-.91-.74 2.748 2.748 0 0 0-.223-.038 4.78 4.78 0 0 1-.187.034Z"
-								></path>
+									fill="#6B7280"
+									fill-rule="evenodd"
+									stroke="#6B7280"
+									stroke-width=".5"
+									d="M11.1 6.996c.887 0 1.691.368 2.276.965l1.821-1.09a2.812 2.812 0 0 1-.12-.817c0-1.51 1.186-2.733 2.649-2.733s2.649 1.224 2.649 2.733c0 1.51-1.186 2.733-2.65 2.733a2.6 2.6 0 0 1-1.865-.793l-1.77 1.06c.158.394.246.826.246 1.28 0 .773-.254 1.485-.682 2.05l2.83 3.383c.257-.085.53-.131.814-.131 1.463 0 2.65 1.223 2.65 2.732 0 1.51-1.187 2.734-2.65 2.734-1.463 0-2.65-1.224-2.65-2.734 0-.737.284-1.406.744-1.897l-2.702-3.229a3.144 3.144 0 0 1-1.839.421l-.469 1.72c.63.5 1.037 1.286 1.037 2.169 0 1.509-1.186 2.733-2.65 2.733-1.462 0-2.649-1.224-2.649-2.733 0-1.51 1.187-2.733 2.65-2.733.147 0 .292.012.432.036l.423-1.548a3.333 3.333 0 0 1-1.699-2.314h-2.33c-.286 1.191-1.329 2.074-2.572 2.074-1.463 0-2.649-1.223-2.649-2.733 0-1.509 1.186-2.733 2.65-2.733 1.242 0 2.285.884 2.57 2.075h2.331a3.364 3.364 0 0 1 .82-1.634l-1.098-1.6c-.25.082-.517.126-.794.126-1.463 0-2.649-1.224-2.649-2.733 0-1.51 1.186-2.733 2.65-2.733 1.463 0 2.649 1.223 2.649 2.733 0 .75-.293 1.428-.767 1.922l1.049 1.525a3.141 3.141 0 0 1 1.314-.286ZM3.024 8.919c-.758 0-1.372.633-1.372 1.415s.614 1.416 1.372 1.416c.758 0 1.373-.634 1.373-1.416 0-.782-.615-1.415-1.373-1.415Zm5.745 7.217c-.758 0-1.372.634-1.372 1.416 0 .782.614 1.416 1.372 1.416.758 0 1.373-.634 1.373-1.416 0-.782-.615-1.416-1.373-1.416Zm8.529.817c-.758 0-1.372.634-1.372 1.415 0 .782.614 1.416 1.372 1.416.758 0 1.372-.634 1.372-1.416 0-.781-.614-1.415-1.372-1.415Zm.428-12.315c-.758 0-1.373.634-1.373 1.416 0 .782.615 1.416 1.373 1.416s1.372-.634 1.372-1.416c0-.782-.614-1.416-1.372-1.416ZM6.854 2.418c-.758 0-1.372.635-1.372 1.417S6.096 5.25 6.854 5.25c.758 0 1.373-.633 1.373-1.415s-.615-1.416-1.373-1.416ZM11.1 8.314c-1.083 0-1.96.905-1.96 2.021 0 1.117.877 2.022 1.96 2.022 1.082 0 1.96-.905 1.96-2.022 0-1.116-.878-2.021-1.96-2.021Z"
+									clip-rule="evenodd"></path>
 							</svg>
+
 							<span class="ml-1.5" sidebar-toggle-item>Connections</span>
 						</a>
 					</li>
@@ -285,7 +286,7 @@ import { pathRoutes } from '../config/pathRoutes';
 							>
 						</button>
 
-						<ul id="dropdown-credentials" class="py-2 space-y-2">
+						<ul id="dropdown-credentials" class="hidden py-2 space-y-2">
 							<li>
 								<a
 									href={pathRoutes.organizations.issuedCredentials}

diff --git a/src/components/Ecosystem/Dashboard.tsx b/src/components/Ecosystem/Dashboard.tsx
@@ -211,7 +211,7 @@ const Dashboard = () => {
     }, [editOpenModal]);
 
     return (
-        <div className="px-4 pt-6">
+        <div className="pt-6">
             <div className="mb-4 col-span-full xl:mb-2">
                 <BreadCrumbs />
             </div>

diff --git a/src/components/Ecosystem/EcosystemList.tsx b/src/components/Ecosystem/EcosystemList.tsx
@@ -116,9 +116,8 @@ const EcosystemList = () => {
   const isEcosystemList = Boolean(ecosystemList && ecosystemList?.length > 0)
   const showCreateButton = Boolean(isEcosystemList && (isEcosystemData?.isMultiEcosystem || isEcosystemData?.isEcosystemLead))
   return (
-    <div className="px-4 pt-6">
-      <div className="pl-6 mb-4 col-span-full xl:mb-2">
-
+    <div className="px-4 pt-2">
+      <div className="mb-2 col-span-full xl:mb-2">
         <BreadCrumbs />
       </div>
       <div className='mb-4 flex justify-between'>

diff --git a/src/components/Resources/Schema/SchemasList.tsx b/src/components/Resources/Schema/SchemasList.tsx
@@ -184,7 +184,7 @@ const SchemaList = (props: { schemaSelectionCallback: (schemaId: string, schemaD
 							/>
 
 							<select onChange={handleFilter} id="schamfilter"
-								className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 h-11">
+								className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 ">
 								<option selected>Organization's schema</option>
 								{options.map((opt) => (
 									<option

diff --git a/src/components/organization/OrgDropDown.tsx b/src/components/organization/OrgDropDown.tsx
@@ -87,7 +87,7 @@ const OrgDropDown = () => {
 								) : (
 									<CustomAvatar size="20" name={activeOrg?.name} round />
 								)}
-								<text className="ml-2 text-primary-700 dark:text-white">{activeOrg?.name}</text>
+								<text className="ml-2 text-primary-700 dark:text-white">{activeOrg?.name.length > 20 ? activeOrg?.name.substring(0,20) + '...' : activeOrg?.name}</text>
 							</>
 							:
 							<text className='text-primary-700 dark:text-white'>
@@ -137,7 +137,7 @@ const OrgDropDown = () => {
 
 				<a
 					href="#"
-					className="flex items-center p-3 text-sm font-medium text-primary-700 border-t border-gray-200 rounded-b-lg bg-gray-50 dark:border-gray-600 hover:bg-gray-100 dark:bg-gray-700 dark:hover:bg-gray-600 dark:text-white hover:underline"
+					className="flex items-center p-5 text-sm font-medium text-primary-700 border-t border-gray-200 rounded-b-lg bg-gray-50 dark:border-gray-600 hover:bg-gray-100 dark:bg-gray-700 dark:hover:bg-gray-600 dark:text-white hover:underline"
 					onClick={redirectToCreateOrgModal}
 				>
 					<svg xmlns="http://www.w3.org/2000/svg" className='pr-2 dark:text-white' width="24" height="24" fill="none" viewBox="0 0 24 24">

diff --git a/src/components/organization/invitations/Invitations.tsx b/src/components/organization/invitations/Invitations.tsx
@@ -174,7 +174,7 @@ const Invitations = () => {
                                                                 <li className="pt-3 sm:pt-3 overflow-auto">
                                                                     <div className="items-center space-x-4">
                                                                         <div className="inline-flex items-center text-base font-normal text-gray-900 dark:text-white">
-                                                                            Roles:
+                                                                            {invitation.orgRoles.length>1 ? 'Roles:' : 'Role:'}
                                                                             {invitation.orgRoles &&
                                                                                 invitation.orgRoles.length > 0 &&
                                                                                 invitation.orgRoles.map((role: OrgRole, index: number) => {