add video youtube in portofolio and update icon twit to youtube

This commit is contained in:
iqbal024 2025-04-17 13:05:51 +07:00
parent e9aa658fcc
commit ef40a5fc3b
6 changed files with 607 additions and 532 deletions

View File

@ -29,6 +29,17 @@ export default function Services() {
</div> </div>
</div> </div>
</div> */} </div> */}
<div className="video-container">
<iframe
width="100%"
height="500"
src="https://www.youtube.com/embed/KiJAods46eI?autoplay=1"
title="YouTube video"
frameBorder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
allowFullScreen
/>
</div>
<div className="services-item-wrap"> <div className="services-item-wrap">
<div className="row justify-content-center"> <div className="row justify-content-center">
<div className="col-xl-7 col-lg-8"> <div className="col-xl-7 col-lg-8">

View File

@ -1,49 +1,55 @@
import Link from "next/link"; import Link from "next/link";
export default function OffcanvusMenu({ isOffcanvus, handleOffcanvus }) { export default function OffcanvusMenu({ isOffcanvus, handleOffcanvus }) {
return ( return (
<> <>
<div className={`offCanvas__info ${isOffcanvus ? "active" : ""}`}> <div className={`offCanvas__info ${isOffcanvus ? "active" : ""}`}>
<div className="offCanvas__close-icon menu-close" onClick={handleOffcanvus}> <div
<button> className="offCanvas__close-icon menu-close"
<i className="far fa-window-close" /> onClick={handleOffcanvus}
</button> >
</div> <button>
<div className="offCanvas__logo mb-30"> <i className="far fa-window-close" />
<Link href="/"> </button>
<img src="/assets/img/logo/logo.png" alt="Logo" /> </div>
</Link> <div className="offCanvas__logo mb-30">
</div> <Link href="/">
<div className="offCanvas__side-info mb-30"> <img src="/assets/img/logo/logo.png" alt="Logo" />
<div className="contact-list mb-30"> </Link>
<h4>Office Address</h4> </div>
<p>Suite B, 1934 N. Druid Hills Rd, Brookhaven, GA 30319, USA</p> <div className="offCanvas__side-info mb-30">
</div> <div className="contact-list mb-30">
<div className="contact-list mb-30"> <h4>Office Address</h4>
<h4>Phone Number</h4> <p>Suite B, 1934 N. Druid Hills Rd, Brookhaven, GA 30319, USA</p>
<p>(470) 260-4117</p> </div>
</div> <div className="contact-list mb-30">
<div className="contact-list mb-30"> <h4>Phone Number</h4>
<h4>Email Address</h4> <p>(470) 260-4117</p>
<p>support@rankrunners.net</p> </div>
</div> <div className="contact-list mb-30">
</div> <h4>Email Address</h4>
<div className="offCanvas__social-icon mt-30"> <p>support@rankrunners.net</p>
<Link href="https://www.facebook.com/profile.php?id=61561349362241"> </div>
<i className="fab fa-facebook-f" /> </div>
</Link> <div className="offCanvas__social-icon mt-30">
<Link href="https://x.com/Rankrunnersseo"> <Link href="https://www.facebook.com/profile.php?id=61561349362241">
<i className="fab fa-twitter" /> <i className="fab fa-facebook-f" />
</Link> </Link>
<Link href="https://www.instagram.com/rankrunnersseo/"> <Link href="https://www.youtube.com/@RankRunners">
<i className="fab fa-instagram" /> <i className="fab fa-youtube" />
</Link> </Link>
<Link href="https://www.linkedin.com/company/rankrunnersseo/"> <Link href="https://www.instagram.com/rankrunnersseo/">
<i className="fab fa-linkedin-in" /> <i className="fab fa-instagram" />
</Link> </Link>
</div> <Link href="https://www.linkedin.com/company/rankrunnersseo/">
</div> <i className="fab fa-linkedin-in" />
<div className={`offCanvas__overly ${isOffcanvus ? "active" : ""}`} onClick={handleOffcanvus} /> </Link>
</> </div>
); </div>
<div
className={`offCanvas__overly ${isOffcanvus ? "active" : ""}`}
onClick={handleOffcanvus}
/>
</>
);
} }

View File

@ -4,232 +4,242 @@ import { useState } from "react";
import React from "react"; import React from "react";
export default function Footer3() { export default function Footer3() {
const [email, setEmail] = useState(""); const [email, setEmail] = useState("");
const handleChange = (e) => { const handleChange = (e) => {
setEmail(e.target.value); setEmail(e.target.value);
}; };
const handleSubmit = async (e) => { const handleSubmit = async (e) => {
e.preventDefault(); e.preventDefault();
try { try {
const response = await fetch("https://cryagent.pythonanywhere.com/submitnewrankrunners", { const response = await fetch(
method: "POST", "https://cryagent.pythonanywhere.com/submitnewrankrunners",
headers: { {
"Content-Type": "application/json", method: "POST",
}, headers: {
body: JSON.stringify({ email }), "Content-Type": "application/json",
}); },
body: JSON.stringify({ email }),
if (response.ok) {
const result = await response.json();
} else {
console.error("Error submitting form:", await response.json());
}
} catch (error) {
console.error("Error submitting form:", error);
} }
);
// reset the form if (response.ok) {
e.target.reset(); const result = await response.json();
setEmail(""); } else {
}; console.error("Error submitting form:", await response.json());
}
} catch (error) {
console.error("Error submitting form:", error);
}
const currentYear = new Date().getFullYear(); // reset the form
e.target.reset();
setEmail("");
};
return ( const currentYear = new Date().getFullYear();
<>
<footer> return (
<div className="footer__area-three"> <>
<div className="footer__top-three"> <footer>
<div className="container"> <div className="footer__area-three">
<div className="row"> <div className="footer__top-three">
<div className="col-lg-4 col-md-8"> <div className="container">
<div className="footer-widget"> <div className="row">
<div className="footer__newsletter-three"> <div className="col-lg-4 col-md-8">
<h2 className="title">Receive FREE tools &amp; tips!</h2> <div className="footer-widget">
<p>Subscribe to our newsletter</p> <div className="footer__newsletter-three">
<form onSubmit={handleSubmit}> <h2 className="title">Receive FREE tools &amp; tips!</h2>
<input <p>Subscribe to our newsletter</p>
onChange={handleChange} <form onSubmit={handleSubmit}>
required <input
type="email" onChange={handleChange}
name="email" required
value={email} type="email"
placeholder="Enter your email address" name="email"
/> value={email}
<button className="btn" type="submit"> placeholder="Enter your email address"
Subscribe />
</button> <button className="btn" type="submit">
</form> Subscribe
</div> </button>
<div className="footer__social-three"> </form>
<span className="title">Follow Us on:</span>
<ul className="list-wrap">
<li>
<Link
href="https://www.facebook.com/profile.php?id=61561349362241"
target="_blank"
>
<i className="fab fa-facebook-f" />
</Link>
</li>
<li>
<Link href="https://x.com/Rankrunnersseo" target="_blank">
<i className="fab fa-twitter" />
</Link>
</li>
<li>
<Link
href="https://www.instagram.com/rankrunnersseo/"
target="_blank"
>
<i className="fab fa-instagram" />
</Link>
</li>
<li>
<Link
href="https://www.linkedin.com/company/rankrunnersseo/"
target="_blank"
>
<i className="fab fa-linkedin-in" />
</Link>
</li>
</ul>
</div>
</div>
</div>
<div className="col-xl-2 col-lg-3 col-md-4 col-sm-6">
<div className="footer-widget">
<h4 className="fw-title">RankRunners</h4>
<div className="footer-link-list">
<ul className="list-wrap">
<li>
<Link href="/about">About</Link>
</li>
<li>
<Link href="/blog">Blog</Link>
</li>
<li>
<Link href="/team">Our Team</Link>
</li>
<li>
<Link href="/portfolio">Portfolio</Link>
</li>
<li>
<Link href="/contact">Contact Us</Link>
</li>
<li>
<Link href="/terms-of-use">Terms of Use</Link>
</li>
</ul>
</div>
</div>
</div>
<div className="col-xl-3 col-lg-5 col-sm-6 col-sm-6">
<div className="footer-widget">
<h4 className="fw-title">Explore</h4>
<div className="footer-link-list">
<ul className="list-wrap">
<li>
<Link href="#seocheck">SEO Checker</Link>
</li>
<li>
<Link href="/login">Client Area</Link>
</li>
<li>
<Link href="/services/search-engine-optimization">
Search Engine Optimization
</Link>
</li>
<li>
<Link href="/services/web-development">Web Design Services</Link>
</li>
<li>
<Link href="/services/social-media-management">
Social Media Management
</Link>
</li>
<li>
<Link href="/services/lead-generation">Lead Generation</Link>
</li>
</ul>
</div>
</div>
</div>
<div className="col-xl-3 col-lg-4 col-md-6">
<div className="footer-widget">
<h4 className="fw-title">Contact</h4>
<div className="footer-info-list">
<ul className="list-wrap">
<li>
<div className="icon">
<i className="flaticon-phone-call" />
</div>
<div className="content">
<Link href="tel:+14702604117">(470) 260-4117</Link>
</div>
</li>
<li>
<div className="icon">
<i className="flaticon-envelope" />
</div>
<div className="content">
<Link
href="mailto:support@rankrunners.net
"
>
support@rankrunners.net
</Link>
</div>
</li>
<li>
<div className="icon">
<i className="flaticon-pin" />
</div>
<div className="content">
<p>
<Link
href="https://maps.app.goo.gl/3vpv8Y9pSTtpcNGB6"
target="_blank"
>
Suite B, 1934 N. Druid Hills Rd, Brookhaven, GA 30319,
USA
</Link>
</p>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div> </div>
<div className="footer__bottom-three"> <div className="footer__social-three">
<div className="container"> <span className="title">Follow Us on:</span>
<div className="row align-items-center"> <ul className="list-wrap">
{/* <div className="col-md-6"> <li>
<Link
href="https://www.facebook.com/profile.php?id=61561349362241"
target="_blank"
>
<i className="fab fa-facebook-f" />
</Link>
</li>
<li>
<Link
href="https://www.youtube.com/@RankRunners"
target="_blank"
>
<i className="fab fa-youtube" />
</Link>
</li>
<li>
<Link
href="https://www.instagram.com/rankrunnersseo/"
target="_blank"
>
<i className="fab fa-instagram" />
</Link>
</li>
<li>
<Link
href="https://www.linkedin.com/company/rankrunnersseo/"
target="_blank"
>
<i className="fab fa-linkedin-in" />
</Link>
</li>
</ul>
</div>
</div>
</div>
<div className="col-xl-2 col-lg-3 col-md-4 col-sm-6">
<div className="footer-widget">
<h4 className="fw-title">RankRunners</h4>
<div className="footer-link-list">
<ul className="list-wrap">
<li>
<Link href="/about">About</Link>
</li>
<li>
<Link href="/blog">Blog</Link>
</li>
<li>
<Link href="/team">Our Team</Link>
</li>
<li>
<Link href="/portfolio">Portfolio</Link>
</li>
<li>
<Link href="/contact">Contact Us</Link>
</li>
<li>
<Link href="/terms-of-use">Terms of Use</Link>
</li>
</ul>
</div>
</div>
</div>
<div className="col-xl-3 col-lg-5 col-sm-6 col-sm-6">
<div className="footer-widget">
<h4 className="fw-title">Explore</h4>
<div className="footer-link-list">
<ul className="list-wrap">
<li>
<Link href="#seocheck">SEO Checker</Link>
</li>
<li>
<Link href="/login">Client Area</Link>
</li>
<li>
<Link href="/services/search-engine-optimization">
Search Engine Optimization
</Link>
</li>
<li>
<Link href="/services/web-development">
Web Design Services
</Link>
</li>
<li>
<Link href="/services/social-media-management">
Social Media Management
</Link>
</li>
<li>
<Link href="/services/lead-generation">
Lead Generation
</Link>
</li>
</ul>
</div>
</div>
</div>
<div className="col-xl-3 col-lg-4 col-md-6">
<div className="footer-widget">
<h4 className="fw-title">Contact</h4>
<div className="footer-info-list">
<ul className="list-wrap">
<li>
<div className="icon">
<i className="flaticon-phone-call" />
</div>
<div className="content">
<Link href="tel:+14702604117">(470) 260-4117</Link>
</div>
</li>
<li>
<div className="icon">
<i className="flaticon-envelope" />
</div>
<div className="content">
<Link
href="mailto:support@rankrunners.net
"
>
support@rankrunners.net
</Link>
</div>
</li>
<li>
<div className="icon">
<i className="flaticon-pin" />
</div>
<div className="content">
<p>
<Link
href="https://maps.app.goo.gl/3vpv8Y9pSTtpcNGB6"
target="_blank"
>
Suite B, 1934 N. Druid Hills Rd, Brookhaven, GA
30319, USA
</Link>
</p>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<div className="footer__bottom-three">
<div className="container">
<div className="row align-items-center">
{/* <div className="col-md-6">
<div className="fw-logo"> <div className="fw-logo">
<Link href="/"> <Link href="/">
<img src="/assets/img/logo/logo.png" alt="" /> <img src="/assets/img/logo/logo.png" alt="" />
</Link> </Link>
</div> </div>
</div> */} </div> */}
<div> <div>
<div className="copyright-text"> <div className="copyright-text">
<p> <p>
Copyright © {currentYear} <Link href="/">RankRunners</Link> | All Rights Copyright © {currentYear}{" "}
Reserved <Link href="/">RankRunners</Link> | All Rights Reserved
</p> </p>
</div> </div>
</div>
</div>
</div>
</div>
</div> </div>
</footer> </div>
</> </div>
); </div>
</div>
</footer>
</>
);
} }

View File

@ -200,11 +200,11 @@ export default function Header4({
</li> </li>
<li> <li>
<Link <Link
href="https://x.com/Rankrunnersseo" href="https://www.youtube.com/@RankRunners"
target="_blank" target="_blank"
onClick={handleMobileMenu} onClick={handleMobileMenu}
> >
<i className="fab fa-twitter" /> <i className="fab fa-youtube" />
</Link> </Link>
</li> </li>
<li> <li>

View File

@ -5,79 +5,86 @@ import OffcanvusMenu from "../OffcanvusMenu";
import SearchPopup from "../SearchPopup"; import SearchPopup from "../SearchPopup";
export default function Header4({ export default function Header4({
isMobileMenu, isMobileMenu,
handleMobileMenu, handleMobileMenu,
transparent = true, transparent = true,
isSearch, isSearch,
isOffcanvus, isOffcanvus,
handleOffcanvus, handleOffcanvus,
handleSearch, handleSearch,
}) { }) {
return ( return (
<> <>
<header className={`tg-header__style-four ${transparent ? "transparent-header" : ""}`}> <header
<div className="tg-header__top tg-header__top-three"> className={`tg-header__style-four ${
<div className="container"> transparent ? "transparent-header" : ""
<div className="row"> }`}
<div className="col-lg-6"> >
<ul className="tg-header__top-info tg-header__top-info-three list-wrap"> <div className="tg-header__top tg-header__top-three">
<li> <div className="container">
<i className="flaticon-phone-call" /> <div className="row">
<Link href="tel:+14702604117">(470) 260-4117</Link> <div className="col-lg-6">
</li> <ul className="tg-header__top-info tg-header__top-info-three list-wrap">
<li> <li>
<i className="flaticon-pin" /> <i className="flaticon-phone-call" />
<Link href="https://maps.app.goo.gl/3vpv8Y9pSTtpcNGB6" target="_blank"> <Link href="tel:+14702604117">(470) 260-4117</Link>
Suite B, 1934 N. Druid Hills Rd, Brookhaven, GA 30319, USA </li>
</Link> <li>
</li> <i className="flaticon-pin" />
</ul> <Link
</div> href="https://maps.app.goo.gl/3vpv8Y9pSTtpcNGB6"
<div className="col-lg-6"> target="_blank"
<ul className="tg-header__top-right tg-header__top-right-three list-wrap"> >
<li> Suite B, 1934 N. Druid Hills Rd, Brookhaven, GA 30319, USA
<i className="flaticon-envelope" /> </Link>
<Link </li>
href="mailto:support@rankrunners.net </ul>
</div>
<div className="col-lg-6">
<ul className="tg-header__top-right tg-header__top-right-three list-wrap">
<li>
<i className="flaticon-envelope" />
<Link
href="mailto:support@rankrunners.net
" "
> >
support@rankrunners.net support@rankrunners.net
</Link> </Link>
</li> </li>
<li> <li>
<i className="flaticon-time" /> <i className="flaticon-time" />
Mon-Fri: 08:00am - 06:00pm Mon-Fri: 08:00am - 06:00pm
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>
</div>
</div>
<div
id="sticky-header"
className={`tg-header__area tg-header__area-four`}
>
<div className="container">
<div className="row">
<div className="col-12">
<div className="tgmenu__wrap">
<nav className="tgmenu__nav">
<div className="logo">
<Link href="/">
<img src="/assets/img/logo/logo.png" alt="Logo" />
</Link>
</div> </div>
</div> <div className="tgmenu__navbar-wrap tgmenu__main-menu d-none d-lg-flex">
<div <Menu />
id="sticky-header" </div>
className={`tg-header__area tg-header__area-four`} <div className="tgmenu__action tgmenu__action-four d-none d-md-block">
> <ul className="list-wrap">
<div className="container"> <li className="header-btn">
<div className="row"> <Link href="/schedule" className="btn">
<div className="col-12"> book a discovery call
<div className="tgmenu__wrap"> </Link>
<nav className="tgmenu__nav"> </li>
<div className="logo"> {/* <li className="offCanvas-menu" onClick={handleOffcanvus}>
<Link href="/">
<img src="/assets/img/logo/logo.png" alt="Logo" />
</Link>
</div>
<div className="tgmenu__navbar-wrap tgmenu__main-menu d-none d-lg-flex">
<Menu />
</div>
<div className="tgmenu__action tgmenu__action-four d-none d-md-block">
<ul className="list-wrap">
<li className="header-btn">
<Link href="/schedule" className="btn">
book a discovery call
</Link>
</li>
{/* <li className="offCanvas-menu" onClick={handleOffcanvus}>
<a className="menu-tigger"> <a className="menu-tigger">
<svg <svg
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
@ -123,142 +130,155 @@ export default function Header4({
</svg> </svg>
</a> </a>
</li> */} </li> */}
</ul> </ul>
</div>
<div
className="mobile-nav-toggler mobile-nav-toggler-two"
onClick={handleMobileMenu}
>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18" fill="none">
<path
d="M0 2C0 0.895431 0.895431 0 2 0C3.10457 0 4 0.895431 4 2C4 3.10457 3.10457 4 2 4C0.895431 4 0 3.10457 0 2Z"
fill="currentcolor"
/>
<path
d="M0 9C0 7.89543 0.895431 7 2 7C3.10457 7 4 7.89543 4 9C4 10.1046 3.10457 11 2 11C0.895431 11 0 10.1046 0 9Z"
fill="currentcolor"
/>
<path
d="M0 16C0 14.8954 0.895431 14 2 14C3.10457 14 4 14.8954 4 16C4 17.1046 3.10457 18 2 18C0.895431 18 0 17.1046 0 16Z"
fill="currentcolor"
/>
<path
d="M7 2C7 0.895431 7.89543 0 9 0C10.1046 0 11 0.895431 11 2C11 3.10457 10.1046 4 9 4C7.89543 4 7 3.10457 7 2Z"
fill="currentcolor"
/>
<path
d="M7 9C7 7.89543 7.89543 7 9 7C10.1046 7 11 7.89543 11 9C11 10.1046 10.1046 11 9 11C7.89543 11 7 10.1046 7 9Z"
fill="currentcolor"
/>
<path
d="M7 16C7 14.8954 7.89543 14 9 14C10.1046 14 11 14.8954 11 16C11 17.1046 10.1046 18 9 18C7.89543 18 7 17.1046 7 16Z"
fill="currentcolor"
/>
<path
d="M14 2C14 0.895431 14.8954 0 16 0C17.1046 0 18 0.895431 18 2C18 3.10457 17.1046 4 16 4C14.8954 4 14 3.10457 14 2Z"
fill="currentcolor"
/>
<path
d="M14 9C14 7.89543 14.8954 7 16 7C17.1046 7 18 7.89543 18 9C18 10.1046 17.1046 11 16 11C14.8954 11 14 10.1046 14 9Z"
fill="currentcolor"
/>
<path
d="M14 16C14 14.8954 14.8954 14 16 14C17.1046 14 18 14.8954 18 16C18 17.1046 17.1046 18 16 18C14.8954 18 14 17.1046 14 16Z"
fill="currentcolor"
/>
</svg>
</div>
</nav>
</div>
{/* Mobile Menu */}
<div className="tgmobile__menu">
<nav className="tgmobile__menu-box">
<div className="close-btn" onClick={handleMobileMenu}>
<i className="fas fa-times" />
</div>
<div className="nav-logo" onClick={handleMobileMenu}>
<Link href="/">
<img src="/assets/img/logo/logo.png" alt="Logo" />
</Link>
</div>
<div className="tgmobile__menu-outer">
<MobileMenu handleMobileMenu={handleMobileMenu} />
</div>
<div className="tgmobile__menu-bottom">
<div className="contact-info">
<ul className="list-wrap">
<li>
<Link
href="mailto:support@rankrunners.net"
target="_blank"
onClick={handleMobileMenu}
>
support@rankrunners.net
</Link>
</li>
<li>
<Link href="tel:+14702604117" onClick={handleMobileMenu}>
(470) 260-4117
</Link>
</li>
</ul>
</div>
<div className="social-links">
<ul className="list-wrap">
<li>
<Link
href="https://www.facebook.com/profile.php?id=61561349362241"
target="_blank"
onClick={handleMobileMenu}
>
<i className="fab fa-facebook-f" />
</Link>
</li>
<li>
<Link
href="https://x.com/Rankrunnersseo"
target="_blank"
onClick={handleMobileMenu}
>
<i className="fab fa-twitter" />
</Link>
</li>
<li>
<Link
href="https://www.instagram.com/rankrunnersseo/"
target="_blank"
onClick={handleMobileMenu}
>
<i className="fab fa-instagram" />
</Link>
</li>
<li>
<Link
href="https://www.linkedin.com/company/rankrunnersseo/"
target="_blank"
onClick={handleMobileMenu}
>
<i className="fab fa-linkedin-in" />
</Link>
</li>
</ul>
</div>
</div>
</nav>
</div>
<div className="tgmobile__menu-backdrop" onClick={handleMobileMenu} />
{/* End Mobile Menu */}
</div>
</div>
</div> </div>
<div
className="mobile-nav-toggler mobile-nav-toggler-two"
onClick={handleMobileMenu}
>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 18 18"
fill="none"
>
<path
d="M0 2C0 0.895431 0.895431 0 2 0C3.10457 0 4 0.895431 4 2C4 3.10457 3.10457 4 2 4C0.895431 4 0 3.10457 0 2Z"
fill="currentcolor"
/>
<path
d="M0 9C0 7.89543 0.895431 7 2 7C3.10457 7 4 7.89543 4 9C4 10.1046 3.10457 11 2 11C0.895431 11 0 10.1046 0 9Z"
fill="currentcolor"
/>
<path
d="M0 16C0 14.8954 0.895431 14 2 14C3.10457 14 4 14.8954 4 16C4 17.1046 3.10457 18 2 18C0.895431 18 0 17.1046 0 16Z"
fill="currentcolor"
/>
<path
d="M7 2C7 0.895431 7.89543 0 9 0C10.1046 0 11 0.895431 11 2C11 3.10457 10.1046 4 9 4C7.89543 4 7 3.10457 7 2Z"
fill="currentcolor"
/>
<path
d="M7 9C7 7.89543 7.89543 7 9 7C10.1046 7 11 7.89543 11 9C11 10.1046 10.1046 11 9 11C7.89543 11 7 10.1046 7 9Z"
fill="currentcolor"
/>
<path
d="M7 16C7 14.8954 7.89543 14 9 14C10.1046 14 11 14.8954 11 16C11 17.1046 10.1046 18 9 18C7.89543 18 7 17.1046 7 16Z"
fill="currentcolor"
/>
<path
d="M14 2C14 0.895431 14.8954 0 16 0C17.1046 0 18 0.895431 18 2C18 3.10457 17.1046 4 16 4C14.8954 4 14 3.10457 14 2Z"
fill="currentcolor"
/>
<path
d="M14 9C14 7.89543 14.8954 7 16 7C17.1046 7 18 7.89543 18 9C18 10.1046 17.1046 11 16 11C14.8954 11 14 10.1046 14 9Z"
fill="currentcolor"
/>
<path
d="M14 16C14 14.8954 14.8954 14 16 14C17.1046 14 18 14.8954 18 16C18 17.1046 17.1046 18 16 18C14.8954 18 14 17.1046 14 16Z"
fill="currentcolor"
/>
</svg>
</div>
</nav>
</div> </div>
{/* header-search */} {/* Mobile Menu */}
<SearchPopup isSearch={isSearch} handleSearch={handleSearch} /> <div className="tgmobile__menu">
{/* header-search-end */} <nav className="tgmobile__menu-box">
{/* offCanvas-menu */} <div className="close-btn" onClick={handleMobileMenu}>
<OffcanvusMenu isOffcanvus={isOffcanvus} handleOffcanvus={handleOffcanvus} /> <i className="fas fa-times" />
{/* offCanvas-menu-end */} </div>
</header> <div className="nav-logo" onClick={handleMobileMenu}>
</> <Link href="/">
); <img src="/assets/img/logo/logo.png" alt="Logo" />
</Link>
</div>
<div className="tgmobile__menu-outer">
<MobileMenu handleMobileMenu={handleMobileMenu} />
</div>
<div className="tgmobile__menu-bottom">
<div className="contact-info">
<ul className="list-wrap">
<li>
<Link
href="mailto:support@rankrunners.net"
target="_blank"
onClick={handleMobileMenu}
>
support@rankrunners.net
</Link>
</li>
<li>
<Link
href="tel:+14702604117"
onClick={handleMobileMenu}
>
(470) 260-4117
</Link>
</li>
</ul>
</div>
<div className="social-links">
<ul className="list-wrap">
<li>
<Link
href="https://www.facebook.com/profile.php?id=61561349362241"
target="_blank"
onClick={handleMobileMenu}
>
<i className="fab fa-facebook-f" />
</Link>
</li>
<li>
<Link
href="https://www.youtube.com/@RankRunners"
target="_blank"
onClick={handleMobileMenu}
>
<i className="fab fa-youtube" />
</Link>
</li>
<li>
<Link
href="https://www.instagram.com/rankrunnersseo/"
target="_blank"
onClick={handleMobileMenu}
>
<i className="fab fa-instagram" />
</Link>
</li>
<li>
<Link
href="https://www.linkedin.com/company/rankrunnersseo/"
target="_blank"
onClick={handleMobileMenu}
>
<i className="fab fa-linkedin-in" />
</Link>
</li>
</ul>
</div>
</div>
</nav>
</div>
<div
className="tgmobile__menu-backdrop"
onClick={handleMobileMenu}
/>
{/* End Mobile Menu */}
</div>
</div>
</div>
</div>
{/* header-search */}
<SearchPopup isSearch={isSearch} handleSearch={handleSearch} />
{/* header-search-end */}
{/* offCanvas-menu */}
<OffcanvusMenu
isOffcanvus={isOffcanvus}
handleOffcanvus={handleOffcanvus}
/>
{/* offCanvas-menu-end */}
</header>
</>
);
} }

View File

@ -1,70 +1,98 @@
import Link from "next/link"; import Link from "next/link";
export default function Banner1() { export default function Banner1() {
return ( return (
<> <>
<section className="banner-area banner-bg banner-choice"> <section className="banner-area banner-bg banner-choice">
<div className="container"> <div className="container">
<div className="row"> <div className="row">
<div className="col-lg-6"> <div className="col-lg-6">
<div className="banner-content"> <div className="banner-content">
<span className="sub-title" data-aos="fade-up" data-aos-delay={0}> <span
Welcome to <span className="title-color">RankRunners!</span> className="sub-title"
</span> data-aos="fade-up"
<h2 className="title" data-aos="fade-up" data-aos-delay={200}> data-aos-delay={0}
Generate more revenue from your online assets >
</h2> Welcome to <span className="title-color">RankRunners!</span>
<p data-aos="fade-up" data-aos-delay={400}> </span>
RankRunners is your one-stop shop for Enterprise level IT solutions, including SEO, <h2 className="title" data-aos="fade-up" data-aos-delay={200}>
Web/Mobile App Development, Cloud computing, Cybersecurity, and Digital Marketing - Generate more revenue from your online assets
all designed to increase your brand's organic search visibility and help you attract </h2>
new customers. <p data-aos="fade-up" data-aos-delay={400}>
</p> RankRunners is your one-stop shop for Enterprise level IT
<Link href="/schedule" className="btn" /* data-aos="fade-up" data-aos-delay={600} */> solutions, including SEO, Web/Mobile App Development, Cloud
book a discovery call computing, Cybersecurity, and Digital Marketing - all designed
</Link> to increase your brand's organic search visibility and help
</div> you attract new customers.
<div className="banner-shape"> </p>
<img src="/assets/img/banner/banner_shape01.png" alt="" className="rightToLeft" /> <Link
<img src="/assets/img/banner/banner_shape02.png" alt="" className="ribbonRotate" /> href="/schedule"
</div> className="btn" /* data-aos="fade-up" data-aos-delay={600} */
</div> >
</div> book a discovery call
<div className="banner-social"> </Link>
<h5 className="title">Follow us</h5> </div>
<ul className="list-wrap"> <div className="banner-shape">
<li> <img
<Link href="https://www.facebook.com/profile.php?id=61561349362241" target="_blank"> src="/assets/img/banner/banner_shape01.png"
<i className="fab fa-facebook-f" /> alt=""
</Link> className="rightToLeft"
</li> />
<li> <img
<Link href="https://x.com/Rankrunnersseo" target="_blank"> src="/assets/img/banner/banner_shape02.png"
<i className="fab fa-twitter" /> alt=""
</Link> className="ribbonRotate"
</li> />
<li> </div>
<Link href="https://www.instagram.com/rankrunnersseo/" target="_blank"> </div>
<i className="fab fa-instagram" /> </div>
</Link> <div className="banner-social">
</li> <h5 className="title">Follow us</h5>
<li> <ul className="list-wrap">
<Link href="https://www.linkedin.com/company/rankrunnersseo/" target="_blank"> <li>
<i className="fab fa-linkedin-in" /> <Link
</Link> href="https://www.facebook.com/profile.php?id=61561349362241"
</li> target="_blank"
</ul> >
</div> <i className="fab fa-facebook-f" />
<div className="banner-scroll"> </Link>
<Link href="#about"> </li>
Scroll Down{" "} <li>
<span> <Link
<i className="fas fa-arrow-right" /> href="https://www.youtube.com/@RankRunners"
</span> target="_blank"
</Link> >
</div> <i className="fab fa-youtube" />
</div> </Link>
</section> </li>
</> <li>
); <Link
href="https://www.instagram.com/rankrunnersseo/"
target="_blank"
>
<i className="fab fa-instagram" />
</Link>
</li>
<li>
<Link
href="https://www.linkedin.com/company/rankrunnersseo/"
target="_blank"
>
<i className="fab fa-linkedin-in" />
</Link>
</li>
</ul>
</div>
<div className="banner-scroll">
<Link href="#about">
Scroll Down{" "}
<span>
<i className="fas fa-arrow-right" />
</span>
</Link>
</div>
</div>
</section>
</>
);
} }