Style Symptoms page

Author: PrinceSumberia

src/components/Symptoms.js

@@ -69,11 +69,12 @@ class Symptoms extends Component {
               ></iframe>
             </div>
             <div>
-              <h4>Useful Links</h4>
+              <h3>Useful Links</h3>
               <ul className={classes.helpfulLinks}>
                 <li>
                   <Link className={classes.link} to="/stay-safe">
                     Prevention of Coronavirus.
+                    <span>&rarr;</span>
                   </Link>
                 </li>
                 <li>
@@ -84,6 +85,7 @@ class Symptoms extends Component {
                     rel="noopener noreferrer"
                   >
                     Learn more on who.int
+                    <span>&rarr;</span>
                   </a>
                 </li>
               </ul>

src/styles/SymptomsStyles.js

@@ -24,7 +24,7 @@ export default {
   video: {
     height: "25rem",
     borderRadius: "1rem",
-    marginBottom: "4rem",
+    marginBottom: "5rem",
     "& iframe": {
       display: "block",
       overflow: "hidden",
@@ -71,14 +71,20 @@ export default {
   },
 
   link: {
-    transition: "all .2s",
+    transition: "all .3s",
     "&, &:visited": {
       textDecoration: "none",
     },
 
+    "& span": {
+      marginLeft: ".25rem",
+    },
+
     "&:hover": {
       color: "#000",
-      marginRight: "2rem",
+      "& span": {
+        marginLeft: ".5rem",
+      },
     },
   },