Design changes, add portraits, about page changes, tweaks

src/components/Card.js

@@ -5,23 +5,23 @@ import ImgSprint from '../images/wow-we-did-design-sprint-remotely.png'
 
 const Card = ({ ...props }) => (
   <article className="h-full w-full rounded overflow-hidden shadow bg-white border-bottom-saburly hover:shadow-md">
-    <Link
-      to={props.url}
-      className="pointer no-underline saburly-transition hover:opacity-50"
-    >
-      {props.image ? (
-        <img className="w-full" src={props.image.src} />
-      ) : (
-        <img className="w-full" src={ImgSprint} alt="Sprint Work" />
-      )}
-      <div className="px-6 py-4">
-        <h3 className="text-black font-bold text-3xl mb-2">{props.title}</h3>
-        <p
-          className="text-black-light text-base"
-          dangerouslySetInnerHTML={{ __html: props.excerpt }}
-        />
+    <div className="relative hover:opacity-50">
+      {props.image && <img className="w-full" src={props.image.src} />}
+      {props.teamMember && <img className="w-full" src={props.teamMember} />}
+      <div
+        className={`px-6 py-4 ${
+          props.team ? 'absolute pin-b' : ''
+        } text-center w-full bg-white-opacity`}
+      >
+        <h3 className="text-black text-center text-xl">{props.title}</h3>
+        {props.subtitle && (
+          <span className="text-sm font-medium text-black pt-1 opacity-70">
+            {props.subtitle}
+          </span>
+        )}
       </div>
-    </Link>
+    </div>
+    {props.team && <div className="px-6 py-4">{props.children}</div>}
   </article>
 )