more asset tile styling

src/components/molecules/Asset.module.scss

@@ -34,4 +34,5 @@
     padding-top: $spacer / 2;
     margin-top: $spacer / 2;
     font-size: $font-size-small;
+    color: $brand-grey-light;
 }

src/components/molecules/Asset.tsx

@@ -4,15 +4,20 @@ import styles from './Asset.module.scss'
 
 const AssetLink = ({ asset }: { asset: any }) => {
     const { metadata } = asset.findServiceByType('Metadata')
+    const { base } = metadata
 
     return (
         <article className={styles.asset}>
             <Link to={`/asset/${asset.id}`}>
-                <h1>{metadata.base.name}</h1>
+                <h1>{base.name}</h1>
-                <p>{metadata.base.description.substring(0, 90)}</p>
+                <p>{base.description.substring(0, 90)}</p>
 
                 <footer className={styles.assetFooter}>
-                    <div>{metadata.base.category}</div>
+                    {base.categories ? (
+                        <div>{base.category}</div>
+                    ) : (
+                        <div>Fake Category</div>
+                    )}
                 </footer>
             </Link>
         </article>

src/routes/Details/AssetDetails.module.scss

@@ -14,6 +14,7 @@
 
 .metaPrimaryData {
     font-size: $font-size-small;
+    color: $brand-grey-light;
 
     > * {
         display: block;