refactor(*): font sizing and spacing

HoseaCodes · Sep 8, 2021 · 198a689 · 198a689
1 parent acce36b
commit 198a689
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 15 deletions.
diff --git a/src/Components/Footer/Footer.css b/src/Components/Footer/Footer.css
@@ -15,7 +15,7 @@ footer {
 }
 
 footer p {
-  font-size: 0.8em;
+  font-size: 1.8em;
   color: #ccc;
   padding-bottom: 0px;
   margin-bottom: 8px;
@@ -25,10 +25,14 @@ footer p {
   padding-bottom: 15px;
 }
 
+.footer_h5 {
+  font-size: 2.5rem;
+}
+
 .footer_ul_amrc {
   margin: 0px;
   list-style-type: none;
-  font-size: 0.9em;
+  font-size: 1.5em;
   padding: 0px 0px 10px 0px;
 }
 
@@ -87,6 +91,7 @@ footer p {
 }
 .foote_bottom_ul_amrc li {
   display: inline;
+  font-size: 1.5rem;
 }
 
 .foote_bottom_ul_amrc li a {

diff --git a/src/Components/Footer/Footer.jsx b/src/Components/Footer/Footer.jsx
@@ -6,22 +6,20 @@ import SocialMediaTags from '../SocialMediaTags/SocialMediaTags';
 const Footer = () => {
 
     const year = new Date().getFullYear()
-    
+
     return (
         <footer className="footer">
             <div className="container bottom_border">
                 <div className="row">
                     <div className=" col-sm-4 col-md col-sm-4  col-12 col">
-                        <h5 className="headin5_amrc col_white_amrc pt2">Find Me</h5>
-                        {/* <!--headin5_amrc--> */}
+                        <h5 className="footer_h5 col_white_amrc pt2">Find Me</h5>
                         <p className="mb10">HoseaCodes’ mission statement is to build the future while empowering every person and every organization on the planet to achieve more. </p>
                         <p><i className="fa fa-location-arrow"></i> Houston, TX </p>
                         <p><i className="fa fa-phone"></i>  +1-281-780-8424</p>
                         <p><i className="fa fa fa-envelope"></i> <a href="mailto:[email protected]"> [email protected] </a> </p>
                     </div>
                     <div className=" col-sm-4 col-md  col-6 col dompl">
-                        <h5 className="headin5_amrc col_white_amrc pt2">Built With</h5>
-                        {/* <!--headin5_amrc--> */}
+                        <h5 className="footer_h5 col_white_amrc pt2">Built With</h5>
                         <ul className="footer_ul_amrc" >
                             <li> <a href="https://reactjs.org/docs/getting-started.html">React.js</a></li>
                             <li> <a href="https://nodejs.org/en/docs/guides/getting-started-guide/">Node.js</a></li>
@@ -30,22 +28,19 @@ const Footer = () => {
                             <li><a href="https://sass-lang.com/">SCSS</a></li>
                             <li><a href="https://styled-components.com/">Styled Components</a></li>
                         </ul>
-                        {/* <!--footer_ul_amrc ends here--> */}
                     </div>
                     <div className=" col-sm-4 col-md  col-6 col">
-                        <h5 className="headin5_amrc col_white_amrc pt2">Quick links</h5>
-                        {/* <!--headin5_amrc--> */}
+                        <h5 className="footer_h5 col_white_amrc pt2">Quick links</h5>
                         <ul className="footer_ul_amrc">
                             <li><a href="https://www.remove.bg/upload">Remove Background</a></li>
                             <li><a href="/client">Client Details</a></li>
                             <li><a href="/project">Project Details</a></li>
                             <li><a href="/shop">Hoseacodes Shop</a></li>
                             <li><a href="http://webenlance.com">Image Cropping</a></li>
                         </ul>
-                        {/* <!--footer_ul_amrc ends here--> */}
                     </div>
                     <div className=" col-sm-4 col-md  col-12 col">
-                        <h5 className="headin5_amrc col_white_amrc pt2">Follow Me On</h5>
+                        <h5 className="footer_h5 col_white_amrc pt2">Follow Me On</h5>
                         {/* Twitter Profile Tweets */}
                         <ul className="footer_ul2_amrc">
                             <li><a href="/"><i className="fab fa-twitter fleft padding-right"></i> </a><p>Day 56 #100DaysOfCode I added a markdown preview...<a href="https://twitter.com/DominiqueRHosea/status/1382724497954930693">twitter.com/status/Day56</a></p></li>

diff --git a/src/Pages/Articles/Articles.jsx b/src/Pages/Articles/Articles.jsx
@@ -55,6 +55,7 @@ const Articles = () => {
             alert(err.response.data.msg)
         }
     }
+
     const archiveArticle = async (id, archived) => {
         try {
           console.log('clicks')
@@ -206,6 +207,4 @@ const Articles = () => {
     )
 }
 
-
-
 export default Articles;
diff --git a/src/Pages/Home/Home.css b/src/Pages/Home/Home.css
@@ -88,7 +88,7 @@
   cursor: pointer;
   display: flex;
   justify-content: center;
-  font-size: 0.8em;
+  font-size: 1.8em;
   margin-bottom: 10px;
   padding: 10px 10px;
   background-color: transparent;