Site registry controls

bcgov · Sep 28, 2023 · b173999 · b173999
1 parent 6078ca3
commit b173999
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 4 deletions.
diff --git a/frontend/site-search-frontend/src/components/SiteRegistryIcon.tsx b/frontend/site-search-frontend/src/components/SiteRegistryIcon.tsx
@@ -5,12 +5,12 @@ import { Eye, EyeSlash } from 'react-bootstrap-icons';
 export default function SiteRegistryIcon({siteRegistry}: {siteRegistry: boolean}) {
     if (siteRegistry) {
         return (
-            <Eye size='22' className='text-body' />
+            <Eye size='20' className='text-body' />
         )
     }
     else {
         return (
-            <EyeSlash size='22' className='text-body' />
+            <EyeSlash size='20' className='text-body' />
         )
     }
 }

diff --git a/frontend/site-search-frontend/src/features/site-details/notations.tsx b/frontend/site-search-frontend/src/features/site-details/notations.tsx
@@ -98,8 +98,8 @@ function NotationItem({ notation, index, onClickAddParticipant }: { notation: No
                     {isMinistry && <p className='mx-3'>Created: {notation.createdAt.toISOString().split('T')[0]}</p>}
                 </div>
                 <div className="d-inline-flex">
-                    <p className='mx-3'>SR</p>
-                    <p>DELETE</p>
+                    <Button className='text-dark' variant='link'><SiteRegistryIcon siteRegistry={false} /><span className="ms-1 me-3">SR</span></Button>
+                    <Button className='text-dark' variant='link'>Delete</Button>
                 </div>
             </div>
             <div className={siteDetailsStyles.metadataGrid}>

diff --git a/frontend/site-search-frontend/src/pages/site-details.module.css b/frontend/site-search-frontend/src/pages/site-details.module.css
@@ -13,6 +13,8 @@
     /* grid-template-columns: repeat(12, minmax(400px, 1fr)); */
     grid-template-columns: repeat(auto-fill, minmax(175px, 1fr));
     grid-gap: 20px;
+
+    align-items: start;
 }
 
 .metadataGridItem {
@@ -45,6 +47,8 @@
     display: flex;
     justify-content: space-between;
     font-size: 12px;
+    display: flex;
+    align-items: baseline;
 }
 
 .formInput:read-only {