more cosmmatic changes
This commit is contained in:
parent
dacd72f945
commit
105beb6062
@ -1,4 +1,10 @@
|
|||||||
/* Custom Styles */
|
/* Custom Styles */
|
||||||
|
.custom-navbar {
|
||||||
|
background: #efefef;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
padding: 1rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
.carousel-item {
|
.carousel-item {
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
min-height: 500px;
|
min-height: 500px;
|
||||||
|
@ -1,6 +1,7 @@
|
|||||||
import "swiper/css";
|
import "swiper/css";
|
||||||
import "./LandingPage.css";
|
import "./LandingPage.css";
|
||||||
|
|
||||||
|
import React, { useEffect } from "react";
|
||||||
import DashboardImage from "/img/hero/bg-01.jpg";
|
import DashboardImage from "/img/hero/bg-01.jpg";
|
||||||
import { Swiper, SwiperSlide } from "swiper/react";
|
import { Swiper, SwiperSlide } from "swiper/react";
|
||||||
import { EffectFlip, Autoplay, Pagination, Navigation } from "swiper/modules";
|
import { EffectFlip, Autoplay, Pagination, Navigation } from "swiper/modules";
|
||||||
@ -9,13 +10,10 @@ import SwaperSlideImages from "./SwaperSlideImages";
|
|||||||
const LandingPage = () => {
|
const LandingPage = () => {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<nav
|
<nav className="navbar navbar-expand-lg navbar-light bg-white shadow-sm fixed-top custom-navbar">
|
||||||
className="navbar navbar-expand-lg navbar-light bg-white shadow-sm fixed-top"
|
|
||||||
style={{ background: "#efefef !important" }}
|
|
||||||
>
|
|
||||||
<div className="container-fluid px-5 w-100">
|
<div className="container-fluid px-5 w-100">
|
||||||
<div className="row w-100">
|
<div className="row w-100">
|
||||||
<div className="col-md-auto">
|
<div className="col-md-auto d-flex justify-content-between align-items-center">
|
||||||
<a className="navbar-brand fw-bold text-primary" href="#">
|
<a className="navbar-brand fw-bold text-primary" href="#">
|
||||||
<span className="text-blue">OnField</span>
|
<span className="text-blue">OnField</span>
|
||||||
<span>Work</span>
|
<span>Work</span>
|
||||||
@ -26,19 +24,19 @@ const LandingPage = () => {
|
|||||||
type="button"
|
type="button"
|
||||||
data-bs-toggle="collapse"
|
data-bs-toggle="collapse"
|
||||||
data-bs-target="#navbarNav"
|
data-bs-target="#navbarNav"
|
||||||
|
aria-controls="navbarNav"
|
||||||
|
aria-expanded="false"
|
||||||
|
aria-label="Toggle navigation"
|
||||||
>
|
>
|
||||||
<span className="navbar-toggler-icon"></span>
|
<span className="navbar-toggler-icon"></span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* <div className=" col-6 collapse navbar-collapse justify-content-center">
|
|
||||||
<ul className="navbar-nav"></ul>
|
|
||||||
</div> */}
|
|
||||||
<div
|
<div
|
||||||
className="d-flex collapse navbar-collapse justify-content-end col-md-auto"
|
className="collapse navbar-collapse justify-content-end col-md-auto "
|
||||||
id="navbarNav"
|
id="navbarNav"
|
||||||
>
|
>
|
||||||
<ul className="navbar-nav align-items-center ">
|
<ul className="navbar-nav">
|
||||||
<li className="nav-item">
|
<li className="nav-item">
|
||||||
<a className="nav-link" href="#">
|
<a className="nav-link" href="#">
|
||||||
Home
|
Home
|
||||||
@ -669,51 +667,54 @@ const LandingPage = () => {
|
|||||||
{/* <!-- Contact Section --> */}
|
{/* <!-- Contact Section --> */}
|
||||||
<section
|
<section
|
||||||
id="contact"
|
id="contact"
|
||||||
class="section-py pt-5"
|
className="section-py pt-5"
|
||||||
style={{ background: "#49bf3c" }}
|
style={{ background: "#49bf3c" }}
|
||||||
>
|
>
|
||||||
<div className="contact-section ">
|
<div className="contact-section ">
|
||||||
<div class="row align-items-center">
|
<div className="row align-items-center">
|
||||||
<div class="col-lg-6 contact-img">
|
<div className="col-lg-6 contact-img">
|
||||||
<img
|
<img
|
||||||
src="/img/illustrations/contact-us.png"
|
src="/img/illustrations/contact-us.png"
|
||||||
alt="Contact Illustration"
|
alt="Contact Illustration"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-lg-6 contact-text">
|
<div className="col-lg-6 contact-text">
|
||||||
<h2>
|
<h2>
|
||||||
Contact <span class="text-success">Us</span>
|
Contact <span className="text-success">Us</span>
|
||||||
</h2>
|
</h2>
|
||||||
<p>
|
<p>
|
||||||
We’d love to hear from you! Whether you have a question about
|
We’d love to hear from you! Whether you have a question about
|
||||||
features, pricing, or anything else — our team is ready to
|
features, pricing, or anything else — our team is ready to
|
||||||
answer all your queries.
|
answer all your queries.
|
||||||
</p>
|
</p>
|
||||||
<div class="row g-4 ">
|
<div className="row g-4 ">
|
||||||
<div class="col-md-6 col-lg-12 col-xl-6">
|
<div className="col-md-6 col-lg-12 col-xl-6">
|
||||||
<div class="d-flex align-items-center">
|
<div className="d-flex align-items-center">
|
||||||
<div class="badge bg-label-primary rounded p-1_5 me-3">
|
<div className="badge bg-label-primary rounded p-1_5 me-3">
|
||||||
<i class="bx bx-envelope bx-lg"></i>
|
<i className="bx bx-envelope bx-lg"></i>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<p class="mb-0 text-start">Email</p>
|
<p className="mb-0 text-start">Email</p>
|
||||||
<h6 class="mb-0 text-start">
|
<h6 className="mb-0 text-start">
|
||||||
<a href="mailto:example@gmail.com" class="text-heading">
|
<a
|
||||||
|
href="mailto:example@gmail.com"
|
||||||
|
className="text-heading"
|
||||||
|
>
|
||||||
sales@marcoaiot.com
|
sales@marcoaiot.com
|
||||||
</a>
|
</a>
|
||||||
</h6>
|
</h6>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-6 col-lg-12 col-xl-6">
|
<div className="col-md-6 col-lg-12 col-xl-6">
|
||||||
<div class="d-flex align-items-center">
|
<div className="d-flex align-items-center">
|
||||||
<div class="badge bg-label-success rounded p-1_5 me-3">
|
<div className="badge bg-label-success rounded p-1_5 me-3">
|
||||||
<i class="bx bx-phone-call bx-lg"></i>
|
<i className="bx bx-phone-call bx-lg"></i>
|
||||||
</div>
|
</div>
|
||||||
<div className="">
|
<div className="">
|
||||||
<p class="mb-0 text-start">Phone</p>
|
<p className="mb-0 text-start">Phone</p>
|
||||||
<h6 class="mb-0 text-start">
|
<h6 className="mb-0 text-start">
|
||||||
<a href="tel:+1234-568-963" class="text-heading">
|
<a href="tel:+1234-568-963" className="text-heading">
|
||||||
+91 70288 83755
|
+91 70288 83755
|
||||||
</a>
|
</a>
|
||||||
</h6>
|
</h6>
|
||||||
@ -722,7 +723,7 @@ const LandingPage = () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="mt-5 pt-5">
|
<div className="mt-5 pt-5">
|
||||||
<a href="#" class="btn-green">
|
<a href="#" className="btn-green">
|
||||||
Know More
|
Know More
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user