btn style reverted

src/assets/css/main.css

@@ -154,18 +154,19 @@ p {
   -ms-transition: all 0.4s ease-out 0s;
   -o-transition: all 0.4s ease-out 0s;
   transition: all 0.4s ease-out 0s;
-  /* background-color: #4687ba; */
-  /* border: 1px solid #4687ba; */
+  background-color: #4687ba;
+  border: 1px solid #4687ba;
+  /* transition: all linear 0.3s;
   border: 1px solid #89216b;
-  background-image: linear-gradient(90deg, #89216b 0%, #da4453 100%);
+  background-image: linear-gradient(90deg, #89216b 0%, #da4453 100%); */
 }
 .main-btn:hover {
-  /* background-color: #fff;
+  background-color: #fff;
   color: #2b70fa;
-  border-color: #2b70fa; */
-  background-image: linear-gradient(90deg, #000 0%, #000 100%);
+  border-color: #2b70fa;
+  /* background-image: linear-gradient(90deg, #000 0%, #000 100%);
   color: #fff;
-  border-color: #000;
+  border-color: #000; */
 }
 .main-btn.main-btn-2 {
   background-color: #fff;
@@ -1982,14 +1983,18 @@ p {
   border-color: #fff;
 }
 .appie-hero-content.appie-hero-content-6 ul li a.item-2 {
-  /* background: #fff; */
   background-color: rgb(219, 237, 245);
   border-color: #fff;
+  /* color: #fff;
+  border-color:#89216b;
+  background-image: linear-gradient(90deg, #89216b 0%, #da4453 100%); */
 }
 .appie-hero-content.appie-hero-content-6 ul li a.item-2:hover {
   background: #9b2cfa;
   border-color: #9b2cfa;
   color: #fff;
+  /* background-image: linear-gradient(90deg, #000 0%, #000 100%);
+  border-color:#000; */
 }
 .appie-hero-content.appie-hero-content-6.appie-hero-content-7 .appie-title {
   color: #fff;
@@ -2042,7 +2047,7 @@ p {
   height: 500px;
   width: 500px;
   transform: translate(-50%, -50%);
-  background: #4687ba;
+  background: #dbedf5;
   border-radius: 50%;
   z-index: -1;
 }

src/components/AboutUs/HeaderAbout.js

@@ -3,6 +3,7 @@ import logo from '../../assets/images/wrenchboard-logo-text.png';
 import StickyMenu from '../../lib/StickyMenu';
 import Navigation from '../Navigation';
 import getConfig from './../../Config/config'
+import { Link } from 'react-router-dom';
 
 function HeaderAbout({ action }) {
     useEffect(() => {
@@ -18,9 +19,9 @@ function HeaderAbout({ action }) {
                         <div className="row align-items-center">
                             <div className="col-lg-2 col-md-4 col-sm-5 col-6 order-1 order-sm-1">
                                 <div className="appie-logo-box">
-                                    <a href="/">
+                                    <Link to="/">
                                         <img src={logo} alt="" width="175px" height="38px" loading='eager' />
-                                    </a>
+                                    </Link>
                                 </div>
                             </div>
                             <div className="col-lg-6 col-md-1 col-sm-1 order-3 order-sm-2">

src/components/HomeOne/FooterHomeOne.js

@@ -22,13 +22,13 @@ function FooterHomeOne({ className }) {
                                 <p>
                                     {`It is simple. You can set goals, task, or anything that needs to be done and reward accomplishment. WrenchBoard is the platform to connect opportunities. `}
                                 </p>
-                                <a href="/service">
+                                <Link to="/service">
                                     Read More <i className="fal fa-arrow-right" />
-                                </a>
+                                </Link>
                                 <div className="social mt-30">
                                     <ul>
                                         <li>
-                                            <a href={site.facebook_link}>
+                                            <a to={site.facebook_link}>
                                                 <i className="fab fa-facebook-f" />
                                             </a>
                                         </li>
@@ -53,7 +53,7 @@ function FooterHomeOne({ className }) {
                                         <Link to="/service">Our Services</Link>
                                     </li>
                                     <li>
-                                        <a href="/use-cases">Use Cases</a>
+                                        <Link to="/use-cases">Use Cases</Link>
                                     </li>
                                     <li>
                                         <a target='_blank' href={process.env.REACT_APP_AGENT_LINK}>Agent</a>
@@ -73,16 +73,16 @@ function FooterHomeOne({ className }) {
                                         <Link to="/contact">Contact</Link>
                                     </li>
                                     <li>
-                                        <a href="/faq">Faqs</a>
+                                        <Link to="/faq">Faqs</Link>
                                     </li>
                                     <li>
                                         <a href="https://blog.wrenchboard.com/resources/">Resources</a>
                                     </li>
                                     <li>
-                                        <a href="/privacy">Privacy Policy</a>
+                                        <Link to="/privacy">Privacy Policy</Link>
                                     </li>
                                     <li>
-                                        <a href="/terms">Terms of use</a>
+                                        <Link to="/terms">Terms of use</Link>
                                     </li>
                                 </ul>
                             </div>

src/components/HomeOne/HomeOneHeader.js

@@ -3,6 +3,7 @@ import logo from '../../assets/images/wrenchboard-logo-text.png';
 import StickyMenu from '../../lib/StickyMenu';
 import Navigation from '../Navigation';
 import getConfig from './../../Config/config'
+import { Link } from 'react-router-dom';
 
 function HomeOneHeader({ action, showLogoOnly = false }) {
   var site = getConfig()[0];
@@ -16,9 +17,9 @@ function HomeOneHeader({ action, showLogoOnly = false }) {
           <div className="row align-items-center">
             <div className="col-lg-2 col-md-4 col-sm-5 col-6 order-1 order-sm-1">
               <div className="appie-logo-box">
-                <a href="/">
+                <Link to="/">
                   <img src={logo} alt="WrenchBoard" loading='eager' width="175px" height="38px" />
-                </a>
+                </Link>
               </div>
             </div>
 

src/components/Service/ServiceSideMenu.js

@@ -5,6 +5,7 @@ import HomeIcon from '../../assets/images/icon/home-icon.ico'
 import UseCaseIcon from '../../assets/images/icon/use-case.ico'
 import PrivacyIcon from '../../assets/images/icon/privacy-policy.ico'
 import TermsIcon from '../../assets/images/icon/term-and-conditions.ico'
+import { Link } from 'react-router-dom';
 
 function ServiceSideMenu() {
     var site = getConfig()[0];
@@ -13,43 +14,43 @@ function ServiceSideMenu() {
             <div className="service-details-sidebar mr-50">
 
                 <div className="service-download-widget">
-                    <a href="/">
+                    <Link to="/">
                         {/* <i className="fal fa-download"></i> */}
                         <img src={HomeIcon} alt='sidenav-icon' />
                         <span>Home</span>
-                    </a>
+                    </Link>
                 </div>
 
                 <div className="service-download-widget">
-                    <a href="/about-us">
+                    <Link to="/about-us">
                         {/* <i className="fal fa-download"></i> */}
                         <img src={AboutIcon} alt='sidenav-icon' />
                         <span>About us</span>
-                    </a>
+                    </Link>
                 </div>
                 <div className="service-download-widget">
-                    <a href="/use-cases">
+                    <Link to="/use-cases">
                         {/* <i className="fal fa-file-pdf"></i> */}
                         <img src={UseCaseIcon} alt='sidenav-icon' />
                         <span>Use Cases</span>
-                    </a>
+                    </Link>
                 </div>
 
 
 
                 <div className="service-download-widget">
-                    <a href="/privacy">
+                    <Link to="/privacy">
                         {/* <i className="fal fa-download"></i> */}
                         <img src={PrivacyIcon} alt='sidenav-icon' />
                         <span>Privacy Policy</span>
-                    </a>
+                    </Link>
                 </div>
                 <div className="service-download-widget">
-                    <a href="/terms">
+                    <Link to="/terms">
                         {/* <i className="fal fa-file-pdf"></i> */}
                         <img src={TermsIcon} alt='sidenav-icon' />
                         <span>Terms of use</span>
-                    </a>
+                    </Link>
                 </div>
 
                 <div className="service-category-widget">