Merge pull request #17 from deepbeatz/test

footer css changes made
AyishikD · Jan 9, 2024 · 40d73ae · 40d73ae
2 parents 92eaada + b72b549
commit 40d73ae
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 12 deletions.
diff --git a/src/components/Footer.css b/src/components/Footer.css
@@ -0,0 +1,13 @@
+.myedit-footerlinks{
+    color: rgb(169, 169, 169);
+    transition: all 0.2s ease-in-out;
+}
+
+.myedit-footerlinks:hover{
+    color: white;
+    transform: translateX(10px);
+}
+
+.myedit-footlink-headings{
+    font-size: 20px;
+}
diff --git a/src/components/Footer.js b/src/components/Footer.js
@@ -1,39 +1,39 @@
 // Footer.js
 
 import React from 'react';
-//import './Footer.css';  // Import the CSS file
+import './Footer.css';
 
 const Footer = () => {
     return (
         <footer>
             <div style={styles.footerPanel2} className="footer-panel2">
                 <div className="navFooterlinkCol">
-                    <div style={styles.boldFooterLinkCol} className="footerlinkcol">Company</div>
+                    <div style={styles.boldFooterLinkCol} className="footerlinkcol myedit-footlink-headings">Company</div>
                     <ul>
-                        <li><a href="##">About</a></li>
-                        <li><a href="##">Careers</a></li>
+                        <li className="myedit-footerlinks"><a href="##">About</a></li>
+                        <li className="myedit-footerlinks"><a href="##">Careers</a></li>
                     </ul>
                 </div>
 
 
                 <div className="navFooterlinkCol">
-                    <div style={styles.boldFooterLinkCol} className="footerlinkcol">View Website in</div>
+                    <div style={styles.boldFooterLinkCol} className="footerlinkcol myedit-footlink-headings">View Website in</div>
                     <ul>
-                        <li><a href="##">English</a></li>
+                        <li className="myedit-footerlinks"><a href="##">English</a></li>
                     </ul>
                 </div>
                 <div className="navFooterlinkCol">
-                    <div style={styles.boldFooterLinkCol} className="footerlinkcol">Need Help</div>
+                    <div style={styles.boldFooterLinkCol} className="footerlinkcol myedit-footlink-headings">Need Help</div>
                     <ul>
-                        <li><a href="##">Visit Help Center</a></li>
-                        <li><a href="##">Share Feedback</a></li>
+                        <li className="myedit-footerlinks"><a href="##">Visit Help Center</a></li>
+                        <li className="myedit-footerlinks"><a href="##">Share Feedback</a></li>
                     </ul>
                 </div>
                 <div className="navFooterlinkCol">
-                    <div style={styles.boldFooterLinkCol} className="footerlinkcol">Contact Us</div>
+                    <div style={styles.boldFooterLinkCol} className="footerlinkcol myedit-footlink-headings">Contact Us</div>
                     <ul>
-                        <li><a href="##">Facebook</a></li>
-                        <li><a href="##">Twiter</a></li>
+                        <li className="myedit-footerlinks"><a href="##">Facebook</a></li>
+                        <li className="myedit-footerlinks"><a href="##">Twiter</a></li>
                     </ul>
                 </div>