From 1a8fec2215080f996755099c9fb230bdba8d86c5 Mon Sep 17 00:00:00 2001
From: Diksha Shukla <deekshashukla03102001@gmail.com>
Date: Thu, 31 Mar 2022 00:46:42 +0530
Subject: [PATCH] Updated the UI of button and elements - My story page

---
 src/components/ProductList.jsx |  2 +-
 src/components/StoriesList.js  |  6 +++++-
 src/pages/MyStories.js         | 26 +++++++++++++++-----------
 3 files changed, 21 insertions(+), 13 deletions(-)

diff --git a/src/components/ProductList.jsx b/src/components/ProductList.jsx
index 5159cc02..ed7ea7aa 100644
--- a/src/components/ProductList.jsx
+++ b/src/components/ProductList.jsx
@@ -72,7 +72,7 @@ const ProductList = ({ setProductQuery }) => {
 
   return (
     <div className='product-list-container'>
-      <h4>Select a Product</h4>
+      <h3>Select a Product</h3>
       <div className='flex flex-row flex-center product-list'>
         {!products &&
           Array(productCount)
diff --git a/src/components/StoriesList.js b/src/components/StoriesList.js
index 7bc2b931..ecfaf11a 100644
--- a/src/components/StoriesList.js
+++ b/src/components/StoriesList.js
@@ -112,7 +112,11 @@ const StoriesList = (props) => {
           )
         })
       ) : (
-        <h3>No stories</h3>
+        <center>
+          <h2>
+            No stories! Create your first story <Link to='/newStory'>here</Link>
+          </h2>
+        </center>
       )}
     </div>
   )
diff --git a/src/pages/MyStories.js b/src/pages/MyStories.js
index ac7fc487..e6de72e5 100644
--- a/src/pages/MyStories.js
+++ b/src/pages/MyStories.js
@@ -25,25 +25,29 @@ const MyStories = () => {
       <Navigation />
       <div className='body-content'>
         <div className='body-wrapper my-stories'>
-          <h3>My Stories</h3>
+          <h2>My Stories</h2>
           <div className='flex flex-row roadmap-one'>
             <Button
-              className={
-                currentStateSelected === 'My Submissions'
-                  ? 'btn btn-tabs btn-tabs-selected'
-                  : 'btn btn-tabs'
-              }
+              className={`btn btn-default
+                ${
+                  currentStateSelected === 'My Submissions'
+                    ? 'btn btn-tabs btn-tabs-selected'
+                    : 'btn btn-tabs'
+                }
+              `}
               onClick={() => selectState('My Submissions')}
             >
               My Submissions
             </Button>
             &nbsp; &nbsp;
             <Button
-              className={
-                currentStateSelected === 'Following'
-                  ? 'btn btn-tabs btn-tabs-selected'
-                  : 'btn btn-tabs'
-              }
+              className={`btn btn-default
+                ${
+                  currentStateSelected === 'Following'
+                    ? 'btn btn-tabs btn-tabs-selected'
+                    : 'btn btn-tabs'
+                }
+              `}
               onClick={() => selectState('Following')}
             >
               Following