From cf71053e912f949f2c8acf9799f6f10e86482ba6 Mon Sep 17 00:00:00 2001
From: Kamran Ahmed <kamranahmed.se@gmail.com>
Date: Sat, 21 Sep 2019 11:22:22 +0400
Subject: [PATCH] Modify UI for faq page

---
 pages/about/index.js   |  8 ++++----
 pages/about/style.scss | 16 ++++++++++++----
 2 files changed, 16 insertions(+), 8 deletions(-)

diff --git a/pages/about/index.js b/pages/about/index.js
index c1be3c1bc..24089689d 100644
--- a/pages/about/index.js
+++ b/pages/about/index.js
@@ -7,7 +7,7 @@ const About = () => (
   <div className='home-container'>
     <PageHeader />
     <AboutHeader />
-    <div className="border-top border-bottom bg-light">
+    <div className="faqs-container border-top border-bottom bg-light">
       <div className="faq-item">
         <div className="container container-small">
           <h4 className='font-weight-bolder'>What is roadmap.sh?</h4>
@@ -15,19 +15,19 @@ const About = () => (
           <p>If you really want to Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab asperiores commodi consequatur, culpa cumque dolorum, eos hic illo obcaecati odit quam quod reiciendis, rem reprehenderit saepe sed tempore tenetur vitae!</p>
         </div>
       </div>
-      <div className="faq-item border-top">
+      <div className="faq-item">
         <div className="container container-small">
           <h4 className="font-weight-bolder">What are the plans for roadmap.sh?</h4>
           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolore eaque eius esse, facere id ipsum, minima nam, nisi quos reprehenderit saepe tempora vitae voluptate. Atque deleniti dolores eos laboriosam repellat.</p>
         </div>
       </div>
-      <div className="faq-item border-top">
+      <div className="faq-item">
         <div className="container container-small">
           <h4 className="font-weight-bolder">What is the source of revenue?</h4>
           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Commodi consequuntur, harum impedit numquam porro quod unde! Aperiam dolorum ducimus expedita fugiat, impedit nesciunt, quaerat qui recusandae repellendus tenetur ut voluptatibus!</p>
         </div>
       </div>
-      <div className="faq-item border-top">
+      <div className="faq-item">
         <div className="container container-small">
           <h4 className="font-weight-bolder">Can I contribute?</h4>
           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Commodi consequuntur, harum impedit numquam porro quod unde! Aperiam dolorum ducimus expedita fugiat, impedit nesciunt, quaerat qui recusandae repellendus tenetur ut voluptatibus!</p>
diff --git a/pages/about/style.scss b/pages/about/style.scss
index 476387fc8..ddd7e3bd5 100644
--- a/pages/about/style.scss
+++ b/pages/about/style.scss
@@ -1,8 +1,16 @@
-.faq-item {
-  padding: 40px 20px;
+.faqs-container {
+  padding: 40px 0;
 
-  p:last-child {
-    margin-bottom: 0;
+  .faq-item {
+    padding: 20px 20px;
+
+    p {
+      color: #333;
+    }
+    p:last-child {
+      margin-bottom: 0;
+    }
   }
 }
 
+