From 07cf29719c731e59f0fa8f705323ec69ba6ff728 Mon Sep 17 00:00:00 2001
From: Alicia Sykes <sykes.alicia@gmail.com>
Date: Wed, 30 Jun 2021 21:43:55 +0100
Subject: [PATCH] :beers: Things and stuff

---
 src/components/HomepageFeatures.js | 6 +++---
 src/styles/HomePageFeatures.scss   | 9 ++++++++-
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/src/components/HomepageFeatures.js b/src/components/HomepageFeatures.js
index 97700fcd..fe7f0634 100644
--- a/src/components/HomepageFeatures.js
+++ b/src/components/HomepageFeatures.js
@@ -69,13 +69,13 @@ function Feature({ title, description, icon, index }) {
   const color = getColor(index)
   return (
     <div className={`feature align-${side} color-${color}`}>
-      <div className="feature-half">
+      <div className="feature-half text">
         <div className="feature-title">{icon}<h3>{title}</h3></div>
         <p>{description}</p>
         <Button to="/docs" color={color}>{icon} Docs</Button>
       </div>
-      <div className="feature-half">
-        <p>Static Asset will go here</p>
+      <div className="feature-half assets">
+        <div class="screenshot"></div>
       </div>
     </div>
   );
diff --git a/src/styles/HomePageFeatures.scss b/src/styles/HomePageFeatures.scss
index 10182111..fc48fcf4 100644
--- a/src/styles/HomePageFeatures.scss
+++ b/src/styles/HomePageFeatures.scss
@@ -18,8 +18,15 @@
     &.color-white { --feature-color: white; }
     .feature-half {
       width: 50%;
+      &.assets {
+        background: var(--feature-color);
+        .screenshot {
+          background: black;
+          width: 80%;
+          height: 80%;
+        }
+      }
     }
-    border-bottom: 5px solid var(--feature-color);
     .feature-title {
       display: flex;
       align-items: flex-end;