first commit
This commit is contained in:
Alaguraj0361
commit
89e823eb23
2
.gitattributes
vendored
Normal file
2
.gitattributes
vendored
Normal file
@ -0,0 +1,2 @@
|
||||
# Auto detect text files and perform LF normalization
|
||||
* text=auto
|
||||
130
.gitignore
vendored
Normal file
130
.gitignore
vendored
Normal file
@ -0,0 +1,130 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
lerna-debug.log*
|
||||
.pnpm-debug.log*
|
||||
|
||||
# Diagnostic reports (https://nodejs.org/api/report.html)
|
||||
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
|
||||
|
||||
# Runtime data
|
||||
pids
|
||||
*.pid
|
||||
*.seed
|
||||
*.pid.lock
|
||||
|
||||
# Directory for instrumented libs generated by jscoverage/JSCover
|
||||
lib-cov
|
||||
|
||||
# Coverage directory used by tools like istanbul
|
||||
coverage
|
||||
*.lcov
|
||||
|
||||
# nyc test coverage
|
||||
.nyc_output
|
||||
|
||||
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
|
||||
.grunt
|
||||
|
||||
# Bower dependency directory (https://bower.io/)
|
||||
bower_components
|
||||
|
||||
# node-waf configuration
|
||||
.lock-wscript
|
||||
|
||||
# Compiled binary addons (https://nodejs.org/api/addons.html)
|
||||
build/Release
|
||||
|
||||
# Dependency directories
|
||||
node_modules/
|
||||
jspm_packages/
|
||||
|
||||
# Snowpack dependency directory (https://snowpack.dev/)
|
||||
web_modules/
|
||||
|
||||
# TypeScript cache
|
||||
*.tsbuildinfo
|
||||
|
||||
# Optional npm cache directory
|
||||
.npm
|
||||
|
||||
# Optional eslint cache
|
||||
.eslintcache
|
||||
|
||||
# Optional stylelint cache
|
||||
.stylelintcache
|
||||
|
||||
# Microbundle cache
|
||||
.rpt2_cache/
|
||||
.rts2_cache_cjs/
|
||||
.rts2_cache_es/
|
||||
.rts2_cache_umd/
|
||||
|
||||
# Optional REPL history
|
||||
.node_repl_history
|
||||
|
||||
# Output of 'npm pack'
|
||||
*.tgz
|
||||
|
||||
# Yarn Integrity file
|
||||
.yarn-integrity
|
||||
|
||||
# dotenv environment variable files
|
||||
.env
|
||||
.env.development.local
|
||||
.env.test.local
|
||||
.env.production.local
|
||||
.env.local
|
||||
|
||||
# parcel-bundler cache (https://parceljs.org/)
|
||||
.cache
|
||||
.parcel-cache
|
||||
|
||||
# Next.js build output
|
||||
.next
|
||||
out
|
||||
|
||||
# Nuxt.js build / generate output
|
||||
.nuxt
|
||||
dist
|
||||
|
||||
# Gatsby files
|
||||
.cache/
|
||||
# Comment in the public line in if your project uses Gatsby and not Next.js
|
||||
# https://nextjs.org/blog/next-9-1#public-directory-support
|
||||
# public
|
||||
|
||||
# vuepress build output
|
||||
.vuepress/dist
|
||||
|
||||
# vuepress v2.x temp and cache directory
|
||||
.temp
|
||||
.cache
|
||||
|
||||
# Docusaurus cache and generated files
|
||||
.docusaurus
|
||||
|
||||
# Serverless directories
|
||||
.serverless/
|
||||
|
||||
# FuseBox cache
|
||||
.fusebox/
|
||||
|
||||
# DynamoDB Local files
|
||||
.dynamodb/
|
||||
|
||||
# TernJS port file
|
||||
.tern-port
|
||||
|
||||
# Stores VSCode versions used for testing VSCode extensions
|
||||
.vscode-test
|
||||
|
||||
# yarn v2
|
||||
.yarn/cache
|
||||
.yarn/unplugged
|
||||
.yarn/build-state.yml
|
||||
.yarn/install-state.gz
|
||||
.pnp.*
|
||||
327
app/about/page.js
Normal file
327
app/about/page.js
Normal file
@ -0,0 +1,327 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import { Autoplay, Navigation, Pagination } from "swiper/modules"
|
||||
import { Swiper, SwiperSlide } from "swiper/react"
|
||||
import GallerySlider1 from '@/components/slider/GallerySlider1'
|
||||
|
||||
|
||||
|
||||
const swiperOptions = {
|
||||
modules: [Autoplay, Pagination, Navigation],
|
||||
slidesPerView: 1,
|
||||
spaceBetween: 30,
|
||||
// autoplay: {
|
||||
// delay: 2500,
|
||||
// disableOnInteraction: false,
|
||||
// },
|
||||
loop: true,
|
||||
|
||||
// Navigation
|
||||
navigation: {
|
||||
nextEl: '.srn',
|
||||
prevEl: '.srp',
|
||||
},
|
||||
|
||||
// Pagination
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
clickable: true,
|
||||
},
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
export default function About() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={5} footerStyle={1} breadcrumbTitle="About Us">
|
||||
{/* History Section */}
|
||||
<section className="history-section-two">
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Image Column */}
|
||||
<div className="image-column col-lg-7 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/history-3.jpg" alt="" />
|
||||
</div>
|
||||
<div className="image-two">
|
||||
<img src="assets/images/resource/history-4.png" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Content Column */}
|
||||
<div className="content-column col-lg-5 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title">
|
||||
<div className="title">Our Vision and History </div>
|
||||
<h2>Founded in 1970 by <span className="theme_color">Chairman Jay Martin</span></h2>
|
||||
<div className="text">The Juice Plus+ Company has grown from a small, direct-sales company into a highly successful, privately held health and wellness company operatinLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </div>
|
||||
</div>
|
||||
<ul className="list-style-two">
|
||||
<li>Cras at mi luctus, tincidunt urna eu, posuere enim</li>
|
||||
<li>Vivamus elementum lorem vitae quam tincidunt</li>
|
||||
<li>Suspendisse accumsan eros eu erat condimentum</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End History Section */}
|
||||
|
||||
{/* Gallery Section Two */}
|
||||
<section className="gallery-section-two">
|
||||
<div className="outer-container">
|
||||
<div className="masonry-items-container row clearfix">
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/19.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="row">
|
||||
<div className="gallery-block-two masonry-item col-lg-12 col-md-12 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/20.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item col-lg-12 col-md-12 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/23.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="row">
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/21.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/22.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item col-lg-12 col-md-12 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/24.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section Two */}
|
||||
|
||||
{/* Staff Section */}
|
||||
<section className="staff-section">
|
||||
<div className="auto-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<div className="title">Our most valuable asset</div>
|
||||
<h2>Friendly Staff</h2>
|
||||
</div>
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Staff Block */}
|
||||
<div className="staff-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/staff-1.jpg" alt="" /></Link>
|
||||
<div className="overlay-box">
|
||||
<div className="content">
|
||||
<h6><Link href="#">Jusica Malina</Link></h6>
|
||||
<div className="designation">Pastry Chef</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-facebook-square"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter-square"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Staff Block */}
|
||||
<div className="staff-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInUp" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/staff-2.jpg" alt="" /></Link>
|
||||
<div className="overlay-box">
|
||||
<div className="content">
|
||||
<h6><Link href="#">Jusica Malina</Link></h6>
|
||||
<div className="designation">Pastry Chef</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-facebook-square"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter-square"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Staff Block */}
|
||||
<div className="staff-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInRight" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/staff-3.jpg" alt="" /></Link>
|
||||
<div className="overlay-box">
|
||||
<div className="content">
|
||||
<h6><Link href="#">Jusica Malina</Link></h6>
|
||||
<div className="designation">Pastry Chef</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-facebook-square"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter-square"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Staff Section */}
|
||||
|
||||
{/* Testimonial Section */}
|
||||
<section className="testimonial-section">
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/icons/icon-1.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/icons/icon-2.png)' }} ></div>
|
||||
<div className="icon-layer-three" style={{ backgroundImage: 'url(assets/images/icons/icon-3.png)' }} ></div>
|
||||
<div className="pattern-layer" style={{ backgroundImage: 'url(assets/images/background/pattern-4.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<div className="title">Testimonial</div>
|
||||
<h2>What People Say</h2>
|
||||
<div className="separate"></div>
|
||||
</div>
|
||||
<div className="inner-container">
|
||||
<Swiper {...swiperOptions} className="single-item-carousel ">
|
||||
|
||||
{/* Testimonial Block */}
|
||||
<SwiperSlide>
|
||||
<div className="testimonial-block">
|
||||
<div className="inner-box">
|
||||
<div className="author-image">
|
||||
<img src="assets/images/resource/author-1.jpg" alt="" />
|
||||
</div>
|
||||
<div className="text">“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et <br/> dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation <br/> ullamco.”</div>
|
||||
<div className="designation">Meredith Grant <span>- Host Mother</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
|
||||
{/* Testimonial Block */}
|
||||
<SwiperSlide>
|
||||
<div className="testimonial-block">
|
||||
<div className="inner-box">
|
||||
<div className="author-image">
|
||||
<img src="assets/images/resource/author-1.jpg" alt="" />
|
||||
</div>
|
||||
<div className="text">“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et <br/> dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation <br/> ullamco.”</div>
|
||||
<div className="designation">Meredith Grant <span>- Host Mother</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
|
||||
{/* Testimonial Block */}
|
||||
<SwiperSlide>
|
||||
<div className="testimonial-block">
|
||||
<div className="inner-box">
|
||||
<div className="author-image">
|
||||
<img src="assets/images/resource/author-1.jpg" alt="" />
|
||||
</div>
|
||||
<div className="text">“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et <br/> dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation <br/> ullamco.”</div>
|
||||
<div className="designation">Meredith Grant <span>- Host Mother</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
|
||||
</Swiper>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Testimonial Section */}
|
||||
|
||||
{/* Gallery Section */}
|
||||
<section className="gallery-section">
|
||||
<div className="outer-container">
|
||||
<GallerySlider1/>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section */}
|
||||
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
333
app/blog-classic/page.js
Normal file
333
app/blog-classic/page.js
Normal file
@ -0,0 +1,333 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import GallerySlider1 from '@/components/slider/GallerySlider1'
|
||||
import { Autoplay, Navigation, Pagination } from "swiper/modules"
|
||||
import { Swiper, SwiperSlide } from "swiper/react"
|
||||
import ModalVideo from 'react-modal-video'
|
||||
import { useState } from 'react'
|
||||
|
||||
|
||||
const swiperOptions = {
|
||||
modules: [Autoplay, Pagination, Navigation],
|
||||
slidesPerView: 1,
|
||||
spaceBetween: 30,
|
||||
// autoplay: {
|
||||
// delay: 2500,
|
||||
// disableOnInteraction: false,
|
||||
// },
|
||||
loop: true,
|
||||
|
||||
// Navigation
|
||||
navigation: {
|
||||
nextEl: '.srn',
|
||||
prevEl: '.srp',
|
||||
},
|
||||
|
||||
// Pagination
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
clickable: true,
|
||||
},
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
export default function Home() {
|
||||
const [isOpen, setOpen] = useState(false)
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={5} footerStyle={1} breadcrumbTitle="Blog List With Right Sidebar">
|
||||
{/* Sidebar Page Container */}
|
||||
<div className="sidebar-page-container">
|
||||
<div className="section-text">yummy</div>
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/icons/icon-1.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/icons/icon-2.png)' }} ></div>
|
||||
<div className="icon-layer-three" style={{ backgroundImage: 'url(assets/images/icons/icon-3.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Content Side */}
|
||||
<div className="content-side col-lg-8 col-md-12 col-sm-12">
|
||||
<div className="blog-classNameic">
|
||||
|
||||
{/* News Block Three */}
|
||||
<div className="news-block-three">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-16.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/news-16.jpg" data-fancybox="news" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<h3><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h3>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudan...</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* News Block Three */}
|
||||
<div className="news-block-three">
|
||||
<div className="inner-box">
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<h3><Link href="news-detail">Breakfast At Hotel</Link></h3>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudan...</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* News Block Three */}
|
||||
<div className="news-block-three">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-17.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/news-17.jpg" data-fancybox="news" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<h3><Link href="news-detail">Drinking Healthy And Fruity </Link></h3>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudan...</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* News Block Three */}
|
||||
<div className="news-block-three">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-18.jpg" alt="" />
|
||||
<a onClick={() => setOpen(true)} className="lightbox-image video-overlay-box"><span className="flaticon-play-arrow"><i className="ripple"></i></span></a>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<h3><Link href="news-detail">Drinking Healthy And Fruity </Link></h3>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudan...</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<ModalVideo channel='youtube' autoplay isOpen={isOpen} videoId="Get7rqXYrbQ" onClose={() => setOpen(false)} />
|
||||
|
||||
{/* News Block Four */}
|
||||
<div className="news-block-four">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-19.jpg" alt="" />
|
||||
<div className="content">
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
|
||||
<div className="designation">Michael John</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* News Block Three */}
|
||||
<div className="news-block-three">
|
||||
<div className="inner-box">
|
||||
<Swiper {...swiperOptions} className="single-item-carousel ">
|
||||
<SwiperSlide>
|
||||
<div className="slide">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-20.jpg" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
<SwiperSlide>
|
||||
<div className="slide">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-20.jpg" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
<SwiperSlide>
|
||||
<div className="slide">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-20.jpg" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
</Swiper>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<h3><Link href="news-detail">Pink Snack Ready To Go </Link></h3>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudan...</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Styled Pagination */}
|
||||
<ul className="styled-pagination text-center">
|
||||
<li><Link href="#">01</Link></li>
|
||||
<li><Link href="#" className="active">02</Link></li>
|
||||
<li><Link href="#">03</Link></li>
|
||||
<li className="next"><Link href="#"><span className="fa fa-angle-right"></span></Link></li>
|
||||
</ul>
|
||||
{/* End Styled Pagination */}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Sidebar Side */}
|
||||
<div className="sidebar-side col-lg-4 col-md-12 col-sm-12">
|
||||
<aside className="sidebar sticky-top">
|
||||
|
||||
{/* Search */}
|
||||
<div className="sidebar-widget search-box">
|
||||
<div className="sidebar-title">
|
||||
<h6>Search Course</h6>
|
||||
</div>
|
||||
<form method="post" >
|
||||
<div className="form-group">
|
||||
<input type="search" name="search-field" placeholder="Your search"/>
|
||||
<button type="submit"><span className="icon fa fa-search"></span></button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{/* About Widget */}
|
||||
<div className="sidebar-widget about-widget">
|
||||
<div className="widget-content">
|
||||
<div className="sidebar-title">
|
||||
<h6>About us</h6>
|
||||
</div>
|
||||
<div className="text">Pellentesque semper ut sem non aliquet. Nullam tincidunt vestibulum condimentum. Duis at mollis orci. Nulla facilisi. Pellentesque in mi ut diam consequat sollicitudin</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Category Widget */}
|
||||
<div className="sidebar-widget category-widget">
|
||||
<div className="widget-content">
|
||||
<div className="sidebar-title">
|
||||
<h6>Product categories</h6>
|
||||
</div>
|
||||
<ul className="cat-list">
|
||||
<li><Link href="#">Colorful</Link></li>
|
||||
<li><Link href="#">Fruit Bowl</Link></li>
|
||||
<li><Link href="#">Healthy</Link></li>
|
||||
<li><Link href="#">Ice Cream</Link></li>
|
||||
<li><Link href="#">Mixed</Link></li>
|
||||
<li><Link href="#">Shakes</Link></li>
|
||||
<li><Link href="#">Smoothie</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Popular Posts */}
|
||||
<div className="sidebar-widget popular-posts">
|
||||
<div className="widget-content">
|
||||
<div className="sidebar-title">
|
||||
<h6>Products</h6>
|
||||
</div>
|
||||
|
||||
<article className="post">
|
||||
<figure className="post-thumb"><img src="assets/images/resource/post-thumb-1.jpg" alt=""/><Link href="news-detail" className="overlay-box"><span className="icon fa fa-link"></span></Link></figure>
|
||||
<div className="text"><Link href="news-detail">Hippie Chick</Link></div>
|
||||
<div className="post-info">$120</div>
|
||||
</article>
|
||||
|
||||
<article className="post">
|
||||
<figure className="post-thumb"><img src="assets/images/resource/post-thumb-2.jpg" alt=""/><Link href="news-detail" className="overlay-box"><span className="icon fa fa-link"></span></Link></figure>
|
||||
<div className="text"><Link href="news-detail">Hippie Chick</Link></div>
|
||||
<div className="post-info">$120</div>
|
||||
</article>
|
||||
|
||||
<article className="post">
|
||||
<figure className="post-thumb"><img src="assets/images/resource/post-thumb-3.jpg" alt=""/><Link href="news-detail" className="overlay-box"><span className="icon fa fa-link"></span></Link></figure>
|
||||
<div className="text"><Link href="news-detail">Hippie Chick</Link></div>
|
||||
<div className="post-info">$120</div>
|
||||
</article>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Tags Posts */}
|
||||
<div className="sidebar-widget tags-posts">
|
||||
<div className="widget-content">
|
||||
<div className="sidebar-title">
|
||||
<h6>Product tags</h6>
|
||||
</div>
|
||||
<ul className="tag-list clearfix">
|
||||
<li><Link href="#">Colorful</Link></li>
|
||||
<li><Link href="#">Fruit Bowl</Link></li>
|
||||
<li><Link href="#">Healthy</Link></li>
|
||||
<li><Link href="#">Ice Cream</Link></li>
|
||||
<li><Link href="#">Mixed</Link></li>
|
||||
<li><Link href="#">Shakes</Link></li>
|
||||
<li><Link href="#">Smoothie</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Social Widget */}
|
||||
<div className="sidebar-widget social-widget">
|
||||
<div className="sidebar-title">
|
||||
<h6>Share</h6>
|
||||
</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-facebook"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-dribbble"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</aside>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Gallery Section */}
|
||||
<section className="gallery-section">
|
||||
<div className="outer-container">
|
||||
<GallerySlider1/>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section */}
|
||||
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
261
app/blog-details/page.js
Normal file
261
app/blog-details/page.js
Normal file
@ -0,0 +1,261 @@
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Link from "next/link"
|
||||
import GallerySlider1 from '@/components/slider/GallerySlider1'
|
||||
export default function Home() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={5} footerStyle={1} breadcrumbTitle="Broad Bean And Goats’ Cheese Bruschetta">
|
||||
{/* Sidebar Page Container */}
|
||||
<div className="sidebar-page-container">
|
||||
<div className="section-text">yummy</div>
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/icons/icon-1.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/icons/icon-2.png)' }} ></div>
|
||||
<div className="icon-layer-three" style={{ backgroundImage: 'url(assets/images/icons/icon-3.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Content Side */}
|
||||
<div className="content-side col-lg-8 col-md-12 col-sm-12">
|
||||
<div className="blog-detail">
|
||||
<div className="inner-box">
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-21.jpg" alt="" />
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<p>Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum, nec sagittis sem nibh id elit. Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsannec sagittis sem nibh id elit. Duis sed odio sit amet nibh vulputate cursus a sit amet velit.</p>
|
||||
<p>Nam nec tellus a odio tincidunt auctor a ornare odio. Sed non mauris vitae erat consequat auctor eu in elit. className aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris in erat justo. Nullam ac urna eu felis dapibus condimentum sit amet a augue. Sed non neque elit. Sed ut imperdiet nisi. Proin condimentum fermentum nunc. Etiam pharetra, erat sed fermentum feugiat.</p>
|
||||
<blockquote>
|
||||
Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum, nec sagittis sem nibh id elit. Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsannec sagittis sem nibh id elit. Duis sed odio sit amet nibh vulputate cursus a sit amet velit.
|
||||
</blockquote>
|
||||
<p>Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum, nec sagittis sem nibh id elit. Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsannec sagittis sem nibh id elit. Duis sed odio sit amet nibh vulputate cursus a sit amet velit.</p>
|
||||
<p>Nam nec tellus a odio tincidunt auctor a ornare odio. Sed non mauris vitae erat consequat auctor eu in elit. className aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris in erat justo. Nullam ac urna eu felis dapibus condimentum sit amet a augue. Sed non neque elit. Sed ut imperdiet nisi. Proin condimentum fermentum nunc. Etiam pharetra, erat sed fermentum feugiat.</p>
|
||||
{/* Post Share Options*/}
|
||||
<div className="post-share-options">
|
||||
<ul className="tags">
|
||||
<li><span className="icon fa fa-tag"></span></li>
|
||||
<li><Link href="#">Colorful</Link></li>
|
||||
<li><Link href="#">Fruit Bowl</Link></li>
|
||||
<li><Link href="#">Healthy</Link></li>
|
||||
<li><Link href="#">Ice Cream</Link></li>
|
||||
<li><Link href="#">Mixed Shakes</Link></li>
|
||||
<li><Link href="#">Smoothie</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
{/* Author Box */}
|
||||
<div className="author-box">
|
||||
<div className="box-inner">
|
||||
<div className="content">
|
||||
<div className="author-image">
|
||||
<img src="assets/images/resource/author-3.jpg" alt="" />
|
||||
</div>
|
||||
<h6>Amy Burton</h6>
|
||||
<div className="text">Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* End Author Box */}
|
||||
|
||||
{/* Comments Area */}
|
||||
<div className="comments-area">
|
||||
<div className="group-title">
|
||||
<h4>2 Comments</h4>
|
||||
</div>
|
||||
|
||||
<div className="comment-box">
|
||||
<div className="comment">
|
||||
<div className="author-thumb"><img src="assets/images/resource/author-4.jpg" alt=""/></div>
|
||||
<div className="comment-info clearfix"><strong>Nikol</strong><div className="comment-time">7 months ago </div></div>
|
||||
<div className="text">Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum.</div>
|
||||
<Link className="theme-btn reply-btn" href="#"><span className="fa fa-mail-reply"></span> Reply</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="comment-box reply-comment">
|
||||
<div className="comment">
|
||||
<div className="author-thumb"><img src="assets/images/resource/author-5.jpg" alt=""/></div>
|
||||
<div className="comment-info clearfix"><strong>Randow</strong><div className="comment-time">7 months ago </div></div>
|
||||
<div className="text">Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum.</div>
|
||||
<Link className="theme-btn reply-btn" href="#"><span className="fa fa-mail-reply"></span> Reply</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
{/* Comment Form */}
|
||||
<div className="comment-form-box">
|
||||
<div className="group-title">
|
||||
<h4>Leave a Reply</h4>
|
||||
<div className="comment-text">Your email address will not be published. Required fields are marked *</div>
|
||||
</div>
|
||||
|
||||
{/* Comment Form */}
|
||||
<div className="comment-form">
|
||||
{/* Contact Form */}
|
||||
<form method="post" >
|
||||
<div className="row clearfix">
|
||||
|
||||
<div className="form-group col-lg-12 col-md-12 col-sm-12">
|
||||
<textarea name="message" placeholder="Your Comment"></textarea>
|
||||
</div>
|
||||
|
||||
<div className="form-group col-lg-6 col-md-6 col-sm-12">
|
||||
<input type="text" name="username" placeholder="Your Name"/>
|
||||
</div>
|
||||
|
||||
<div className="form-group col-lg-6 col-md-6 col-sm-12">
|
||||
<input type="email" name="email" placeholder="Your Email"/>
|
||||
</div>
|
||||
|
||||
<div className="form-group col-lg-12 col-md-12 col-sm-12">
|
||||
<input type="text" name="subject" placeholder="Subject"/>
|
||||
</div>
|
||||
|
||||
<div className="form-group col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
<div className="check-box"><input type="checkbox" name="shipping-option" id="account-option"/>   <label >Save my name, email, and website in this browser for the next time I comment.</label></div>
|
||||
</div>
|
||||
|
||||
<div className="form-group col-lg-12 col-md-12 col-sm-12">
|
||||
<button type="submit" className="theme-btn btn-style-one clearfix"><span className="icon"></span>Post Comment</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</form>
|
||||
{/* Contact Form */}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Sidebar Side */}
|
||||
<div className="sidebar-side col-lg-4 col-md-12 col-sm-12">
|
||||
<aside className="sidebar sticky-top">
|
||||
|
||||
{/* Search */}
|
||||
<div className="sidebar-widget search-box">
|
||||
<div className="sidebar-title">
|
||||
<h6>Search Course</h6>
|
||||
</div>
|
||||
<form method="post" >
|
||||
<div className="form-group">
|
||||
<input type="search" name="search-field" placeholder="Your search"/>
|
||||
<button type="submit"><span className="icon fa fa-search"></span></button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{/* About Widget */}
|
||||
<div className="sidebar-widget about-widget">
|
||||
<div className="widget-content">
|
||||
<div className="sidebar-title">
|
||||
<h6>About us</h6>
|
||||
</div>
|
||||
<div className="text">Pellentesque semper ut sem non aliquet. Nullam tincidunt vestibulum condimentum. Duis at mollis orci. Nulla facilisi. Pellentesque in mi ut diam consequat sollicitudin</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Category Widget */}
|
||||
<div className="sidebar-widget category-widget">
|
||||
<div className="widget-content">
|
||||
<div className="sidebar-title">
|
||||
<h6>Product categories</h6>
|
||||
</div>
|
||||
<ul className="cat-list">
|
||||
<li><Link href="#">Colorful</Link></li>
|
||||
<li><Link href="#">Fruit Bowl</Link></li>
|
||||
<li><Link href="#">Healthy</Link></li>
|
||||
<li><Link href="#">Ice Cream</Link></li>
|
||||
<li><Link href="#">Mixed</Link></li>
|
||||
<li><Link href="#">Shakes</Link></li>
|
||||
<li><Link href="#">Smoothie</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Popular Posts */}
|
||||
<div className="sidebar-widget popular-posts">
|
||||
<div className="widget-content">
|
||||
<div className="sidebar-title">
|
||||
<h6>Products</h6>
|
||||
</div>
|
||||
|
||||
<article className="post">
|
||||
<figure className="post-thumb"><img src="assets/images/resource/post-thumb-1.jpg" alt=""/><Link href="news-detail" className="overlay-box"><span className="icon fa fa-link"></span></Link></figure>
|
||||
<div className="text"><Link href="news-detail">Hippie Chick</Link></div>
|
||||
<div className="post-info">$120</div>
|
||||
</article>
|
||||
|
||||
<article className="post">
|
||||
<figure className="post-thumb"><img src="assets/images/resource/post-thumb-2.jpg" alt=""/><Link href="news-detail" className="overlay-box"><span className="icon fa fa-link"></span></Link></figure>
|
||||
<div className="text"><Link href="news-detail">Hippie Chick</Link></div>
|
||||
<div className="post-info">$120</div>
|
||||
</article>
|
||||
|
||||
<article className="post">
|
||||
<figure className="post-thumb"><img src="assets/images/resource/post-thumb-3.jpg" alt=""/><Link href="news-detail" className="overlay-box"><span className="icon fa fa-link"></span></Link></figure>
|
||||
<div className="text"><Link href="news-detail">Hippie Chick</Link></div>
|
||||
<div className="post-info">$120</div>
|
||||
</article>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Tags Posts */}
|
||||
<div className="sidebar-widget tags-posts">
|
||||
<div className="widget-content">
|
||||
<div className="sidebar-title">
|
||||
<h6>Product tags</h6>
|
||||
</div>
|
||||
<ul className="tag-list clearfix">
|
||||
<li><Link href="#">Colorful</Link></li>
|
||||
<li><Link href="#">Fruit Bowl</Link></li>
|
||||
<li><Link href="#">Healthy</Link></li>
|
||||
<li><Link href="#">Ice Cream</Link></li>
|
||||
<li><Link href="#">Mixed</Link></li>
|
||||
<li><Link href="#">Shakes</Link></li>
|
||||
<li><Link href="#">Smoothie</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Social Widget */}
|
||||
<div className="sidebar-widget social-widget">
|
||||
<div className="sidebar-title">
|
||||
<h6>Share</h6>
|
||||
</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-facebook"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-dribbble"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</aside>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Gallery Section */}
|
||||
<section className="gallery-section">
|
||||
<div className="outer-container">
|
||||
<GallerySlider1/>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section */}
|
||||
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
260
app/blog-details2/page.js
Normal file
260
app/blog-details2/page.js
Normal file
@ -0,0 +1,260 @@
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Link from "next/link"
|
||||
import GallerySlider1 from '@/components/slider/GallerySlider1'
|
||||
export default function Home() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={5} footerStyle={1} breadcrumbTitle="Blog No Image">
|
||||
{/* Sidebar Page Container */}
|
||||
<div className="sidebar-page-container">
|
||||
<div className="section-text">yummy</div>
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/icons/icon-1.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/icons/icon-2.png)' }} ></div>
|
||||
<div className="icon-layer-three" style={{ backgroundImage: 'url(assets/images/icons/icon-3.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Content Side */}
|
||||
<div className="content-side col-lg-8 col-md-12 col-sm-12">
|
||||
<div className="blog-detail">
|
||||
<div className="inner-box">
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<h3>Broad bean and goats’ cheese bruschetta</h3>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<p>Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum, nec sagittis sem nibh id elit. Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsannec sagittis sem nibh id elit. Duis sed odio sit amet nibh vulputate cursus a sit amet velit.</p>
|
||||
<p>Nam nec tellus a odio tincidunt auctor a ornare odio. Sed non mauris vitae erat consequat auctor eu in elit. className aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris in erat justo. Nullam ac urna eu felis dapibus condimentum sit amet a augue. Sed non neque elit. Sed ut imperdiet nisi. Proin condimentum fermentum nunc. Etiam pharetra, erat sed fermentum feugiat.</p>
|
||||
<blockquote>
|
||||
Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum, nec sagittis sem nibh id elit. Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsannec sagittis sem nibh id elit. Duis sed odio sit amet nibh vulputate cursus a sit amet velit.
|
||||
</blockquote>
|
||||
<p>Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum, nec sagittis sem nibh id elit. Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsannec sagittis sem nibh id elit. Duis sed odio sit amet nibh vulputate cursus a sit amet velit.</p>
|
||||
<p>Nam nec tellus a odio tincidunt auctor a ornare odio. Sed non mauris vitae erat consequat auctor eu in elit. className aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris in erat justo. Nullam ac urna eu felis dapibus condimentum sit amet a augue. Sed non neque elit. Sed ut imperdiet nisi. Proin condimentum fermentum nunc. Etiam pharetra, erat sed fermentum feugiat.</p>
|
||||
{/* Post Share Options*/}
|
||||
<div className="post-share-options">
|
||||
<ul className="tags">
|
||||
<li><span className="icon fa fa-tag"></span></li>
|
||||
<li><Link href="#">Colorful</Link></li>
|
||||
<li><Link href="#">Fruit Bowl</Link></li>
|
||||
<li><Link href="#">Healthy</Link></li>
|
||||
<li><Link href="#">Ice Cream</Link></li>
|
||||
<li><Link href="#">Mixed Shakes</Link></li>
|
||||
<li><Link href="#">Smoothie</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
{/* Author Box */}
|
||||
<div className="author-box">
|
||||
<div className="box-inner">
|
||||
<div className="content">
|
||||
<div className="author-image">
|
||||
<img src="assets/images/resource/author-3.jpg" alt="" />
|
||||
</div>
|
||||
<h6>Amy Burton</h6>
|
||||
<div className="text">Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* End Author Box */}
|
||||
|
||||
{/* Comments Area */}
|
||||
<div className="comments-area">
|
||||
<div className="group-title">
|
||||
<h4>2 Comments</h4>
|
||||
</div>
|
||||
|
||||
<div className="comment-box">
|
||||
<div className="comment">
|
||||
<div className="author-thumb"><img src="assets/images/resource/author-4.jpg" alt=""/></div>
|
||||
<div className="comment-info clearfix"><strong>Nikol</strong><div className="comment-time">7 months ago </div></div>
|
||||
<div className="text">Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum.</div>
|
||||
<Link className="theme-btn reply-btn" href="#"><span className="fa fa-mail-reply"></span> Reply</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="comment-box reply-comment">
|
||||
<div className="comment">
|
||||
<div className="author-thumb"><img src="assets/images/resource/author-5.jpg" alt=""/></div>
|
||||
<div className="comment-info clearfix"><strong>Randow</strong><div className="comment-time">7 months ago </div></div>
|
||||
<div className="text">Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum.</div>
|
||||
<Link className="theme-btn reply-btn" href="#"><span className="fa fa-mail-reply"></span> Reply</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
{/* Comment Form */}
|
||||
<div className="comment-form-box">
|
||||
<div className="group-title">
|
||||
<h4>Leave a Reply</h4>
|
||||
<div className="comment-text">Your email address will not be published. Required fields are marked *</div>
|
||||
</div>
|
||||
|
||||
{/* Comment Form */}
|
||||
<div className="comment-form">
|
||||
{/* Contact Form */}
|
||||
<form method="post">
|
||||
<div className="row clearfix">
|
||||
|
||||
<div className="form-group col-lg-12 col-md-12 col-sm-12">
|
||||
<textarea name="message" placeholder="Your Comment"></textarea>
|
||||
</div>
|
||||
|
||||
<div className="form-group col-lg-6 col-md-6 col-sm-12">
|
||||
<input type="text" name="username" placeholder="Your Name"/>
|
||||
</div>
|
||||
|
||||
<div className="form-group col-lg-6 col-md-6 col-sm-12">
|
||||
<input type="email" name="email" placeholder="Your Email"/>
|
||||
</div>
|
||||
|
||||
<div className="form-group col-lg-12 col-md-12 col-sm-12">
|
||||
<input type="text" name="subject" placeholder="Subject"/>
|
||||
</div>
|
||||
|
||||
<div className="form-group col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
<div className="check-box"><input type="checkbox" name="shipping-option" id="account-option"/>   <label >Save my name, email, and website in this browser for the next time I comment.</label></div>
|
||||
</div>
|
||||
|
||||
<div className="form-group col-lg-12 col-md-12 col-sm-12">
|
||||
<button type="submit" className="theme-btn btn-style-one clearfix"><span className="icon"></span>Post Comment</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</form>
|
||||
{/* Contact Form */}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Sidebar Side */}
|
||||
<div className="sidebar-side col-lg-4 col-md-12 col-sm-12">
|
||||
<aside className="sidebar sticky-top">
|
||||
|
||||
{/* Search */}
|
||||
<div className="sidebar-widget search-box">
|
||||
<div className="sidebar-title">
|
||||
<h6>Search Course</h6>
|
||||
</div>
|
||||
<form method="post" >
|
||||
<div className="form-group">
|
||||
<input type="search" name="search-field" placeholder="Your search"/>
|
||||
<button type="submit"><span className="icon fa fa-search"></span></button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{/* About Widget */}
|
||||
<div className="sidebar-widget about-widget">
|
||||
<div className="widget-content">
|
||||
<div className="sidebar-title">
|
||||
<h6>About us</h6>
|
||||
</div>
|
||||
<div className="text">Pellentesque semper ut sem non aliquet. Nullam tincidunt vestibulum condimentum. Duis at mollis orci. Nulla facilisi. Pellentesque in mi ut diam consequat sollicitudin</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Category Widget */}
|
||||
<div className="sidebar-widget category-widget">
|
||||
<div className="widget-content">
|
||||
<div className="sidebar-title">
|
||||
<h6>Product categories</h6>
|
||||
</div>
|
||||
<ul className="cat-list">
|
||||
<li><Link href="#">Colorful</Link></li>
|
||||
<li><Link href="#">Fruit Bowl</Link></li>
|
||||
<li><Link href="#">Healthy</Link></li>
|
||||
<li><Link href="#">Ice Cream</Link></li>
|
||||
<li><Link href="#">Mixed</Link></li>
|
||||
<li><Link href="#">Shakes</Link></li>
|
||||
<li><Link href="#">Smoothie</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Popular Posts */}
|
||||
<div className="sidebar-widget popular-posts">
|
||||
<div className="widget-content">
|
||||
<div className="sidebar-title">
|
||||
<h6>Products</h6>
|
||||
</div>
|
||||
|
||||
<article className="post">
|
||||
<figure className="post-thumb"><img src="assets/images/resource/post-thumb-1.jpg" alt=""/><Link href="news-detail" className="overlay-box"><span className="icon fa fa-link"></span></Link></figure>
|
||||
<div className="text"><Link href="news-detail">Hippie Chick</Link></div>
|
||||
<div className="post-info">$120</div>
|
||||
</article>
|
||||
|
||||
<article className="post">
|
||||
<figure className="post-thumb"><img src="assets/images/resource/post-thumb-2.jpg" alt=""/><Link href="news-detail" className="overlay-box"><span className="icon fa fa-link"></span></Link></figure>
|
||||
<div className="text"><Link href="news-detail">Hippie Chick</Link></div>
|
||||
<div className="post-info">$120</div>
|
||||
</article>
|
||||
|
||||
<article className="post">
|
||||
<figure className="post-thumb"><img src="assets/images/resource/post-thumb-3.jpg" alt=""/><Link href="news-detail" className="overlay-box"><span className="icon fa fa-link"></span></Link></figure>
|
||||
<div className="text"><Link href="news-detail">Hippie Chick</Link></div>
|
||||
<div className="post-info">$120</div>
|
||||
</article>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Tags Posts */}
|
||||
<div className="sidebar-widget tags-posts">
|
||||
<div className="widget-content">
|
||||
<div className="sidebar-title">
|
||||
<h6>Product tags</h6>
|
||||
</div>
|
||||
<ul className="tag-list clearfix">
|
||||
<li><Link href="#">Colorful</Link></li>
|
||||
<li><Link href="#">Fruit Bowl</Link></li>
|
||||
<li><Link href="#">Healthy</Link></li>
|
||||
<li><Link href="#">Ice Cream</Link></li>
|
||||
<li><Link href="#">Mixed</Link></li>
|
||||
<li><Link href="#">Shakes</Link></li>
|
||||
<li><Link href="#">Smoothie</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Social Widget */}
|
||||
<div className="sidebar-widget social-widget">
|
||||
<div className="sidebar-title">
|
||||
<h6>Share</h6>
|
||||
</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-facebook"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-dribbble"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</aside>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Gallery Section */}
|
||||
<section className="gallery-section">
|
||||
<div className="outer-container">
|
||||
<GallerySlider1/>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section */}
|
||||
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
187
app/boba-tea/page.js
Normal file
187
app/boba-tea/page.js
Normal file
@ -0,0 +1,187 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import GallerySlider1 from '@/components/slider/GallerySlider1'
|
||||
|
||||
export default function Home() {
|
||||
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={5} footerStyle={1} breadcrumbTitle="Boba Tea">
|
||||
{/* Milkshake Section */}
|
||||
<section className="milkshake-section">
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/icons/icon-1.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/icons/icon-2.png)' }} ></div>
|
||||
<div className="icon-layer-three" style={{ backgroundImage: 'url(assets/images/icons/icon-3.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="inner-container">
|
||||
<div className="big-image">
|
||||
<img src="assets/images/resource/boba.jpg" alt="" />
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="section-text">yummy</div>
|
||||
<div className="text">
|
||||
<p> Ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Milkshake Section */}
|
||||
|
||||
{/* Menus Section */}
|
||||
<section className="menus-section style-two">
|
||||
<figure className="menu-bottom-image">
|
||||
<img src="assets/images/resource/menu-10.png" alt=""/>
|
||||
</figure>
|
||||
<div className="auto-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<h2>Boba Tea <span>Variation</span></h2>
|
||||
<div className="separate"></div>
|
||||
</div>
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Menu Column */}
|
||||
<div className="menu-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-19.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Honeydew Boba tea</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-20.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Lyche Boba tea</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-21.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Mango Boba tea</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-22.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Passion Fruit Boba tea</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Column */}
|
||||
<div className="menu-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-23.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Peach Boba tea</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-24.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Plum Boba tea</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-25.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Strawberry Boba tea</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-26.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Avocado Boba tea</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Menus Section */}
|
||||
|
||||
{/* Gallery Section */}
|
||||
<section className="gallery-section">
|
||||
<div className="outer-container">
|
||||
<GallerySlider1/>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section */}
|
||||
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
105
app/contact/page.js
Normal file
105
app/contact/page.js
Normal file
@ -0,0 +1,105 @@
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import GallerySlider1 from '@/components/slider/GallerySlider1'
|
||||
export default function Home() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={5} footerStyle={1} breadcrumbTitle="Contact">
|
||||
{/* Contact Page Section */}
|
||||
<section className="contact-page-section">
|
||||
<div className="auto-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<div className="title">Get in touch</div>
|
||||
<h2>Hi <span className="theme_color">Say</span></h2>
|
||||
<div className="separate"></div>
|
||||
<div className="text">Us percipit urbanitas referrentur ea. Mei at numquam molestiae intellegam. Ansed dictas <br/> accumsan. Nam sint atqui voluptatibus an, pro ne malis semper perpetua. Nam sint <br/> atqui voluptatibus an, pro ne malis semper perpetua.</div>
|
||||
</div>
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Form Column */}
|
||||
<div className="form-column col-lg-8 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<div className="title-box">
|
||||
<h4>Drop us a line</h4>
|
||||
<div className="text">Your email address will not be published. Required fields are marked *</div>
|
||||
</div>
|
||||
|
||||
{/* Contact Form */}
|
||||
<div className="contact-form">
|
||||
<form method="post" id="contact-form">
|
||||
<div className="row clearfix">
|
||||
|
||||
<div className="form-group col-lg-12 col-md-12 col-sm-12">
|
||||
<textarea name="message" placeholder="Your Comment"></textarea>
|
||||
</div>
|
||||
|
||||
<div className="form-group col-lg-6 col-md-6 col-sm-12">
|
||||
<input type="text" name="username" placeholder="Your Name"/>
|
||||
</div>
|
||||
|
||||
<div className="form-group col-lg-6 col-md-6 col-sm-12">
|
||||
<input type="email" name="email" placeholder="Your Email"/>
|
||||
</div>
|
||||
|
||||
<div className="form-group col-lg-12 col-md-12 col-sm-12">
|
||||
<button type="submit" className="theme-btn btn-style-four clearfix"><span className="icon flaticon-arrow-pointing-to-right"></span>Send</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</form>
|
||||
{/* Contact Form */}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Info Column */}
|
||||
<div className="info-column col-lg-4 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<ul className="info-list">
|
||||
<li>
|
||||
<strong>Berlin</strong>
|
||||
52 Corso Magenta <br/>20123 Milano, Italy <br/> +123 -45678-900 <br/>yourspa@info.com
|
||||
</li>
|
||||
<li>
|
||||
<strong>Opening Hours</strong>
|
||||
Monday – Friday 09:00 – 23:00 <br/> Saturday 09:00 – 22:00
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Contact Page Section */}
|
||||
|
||||
{/* Map Section */}
|
||||
<section className="contact-map-section">
|
||||
<div className="auto-container">
|
||||
{/* Map Boxed */}
|
||||
<div className="map-boxed">
|
||||
{/*Map Outer*/}
|
||||
<div className="map-outer">
|
||||
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d805184.6331292129!2d144.49266890254142!3d-37.97123689954809!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x6ad646b5d2ba4df7%3A0x4045675218ccd90!2sMelbourne%20VIC%2C%20Australia!5e0!3m2!1sen!2s!4v1574408946759!5m2!1sen!2s"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Map Section */}
|
||||
|
||||
{/* Gallery Section */}
|
||||
<section className="gallery-section">
|
||||
<div className="outer-container">
|
||||
<GallerySlider1/>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section */}
|
||||
|
||||
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
BIN
app/favicon.ico
Normal file
BIN
app/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 335 B |
116
app/frappe/page.js
Normal file
116
app/frappe/page.js
Normal file
@ -0,0 +1,116 @@
|
||||
import Link from "next/link"
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import GallerySlider1 from '@/components/slider/GallerySlider1'
|
||||
export default function Home() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={5} footerStyle={1} breadcrumbTitle="Frappe">
|
||||
{/* Milkshake Section */}
|
||||
<section className="milkshake-section">
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/icons/icon-1.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/icons/icon-2.png)' }} ></div>
|
||||
<div className="icon-layer-three" style={{ backgroundImage: 'url(assets/images/icons/icon-3.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="inner-container">
|
||||
<div className="big-image">
|
||||
<img src="assets/images/resource/frappe.jpg" alt="" />
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="section-text">yummy</div>
|
||||
<div className="text">
|
||||
<p>A frappe (pronounced frap-pay) is an iced beverage that has been shaken, blended or beaten to produce a tasty, foamy, and refreshing drink. It is served cold, often with whipped cream and toppings. You can add ice before or after beating the coffee and custom additives such as sugar, milk, vanilla, and sweet sauces.</p>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Milkshake Section */}
|
||||
|
||||
{/* Frape Variant Section */}
|
||||
<section className="frape-variant-section">
|
||||
<div className="auto-container">
|
||||
<div className="frape-image">
|
||||
<img src="assets/images/resource/frape-5.jpg" alt="" />
|
||||
</div>
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<h2>MilkShake <span>Variation</span></h2>
|
||||
<div className="separate"></div>
|
||||
</div>
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Frape Block */}
|
||||
<div className="frape-block col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="restaurant"><img src="assets/images/resource/frape-1.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-box">
|
||||
<div className="price">$15</div>
|
||||
<h6><Link href="restaurant">Chocolate Dutch Frappe</Link></h6>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod veniam, quis.nostrud</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Frape Block */}
|
||||
<div className="frape-block col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="restaurant"><img src="assets/images/resource/frape-2.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-box">
|
||||
<div className="price">$120</div>
|
||||
<h6><Link href="restaurant">Java Chip Frappuccino</Link></h6>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod veniam, quis.nostrud</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Frape Block */}
|
||||
<div className="frape-block col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="restaurant"><img src="assets/images/resource/frape-3.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-box">
|
||||
<div className="price">$75</div>
|
||||
<h6><Link href="restaurant">Vanilla frappe</Link></h6>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod veniam, quis.nostrud</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Frape Block */}
|
||||
<div className="frape-block col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="restaurant"><img src="assets/images/resource/frape-4.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-box">
|
||||
<div className="price">$25</div>
|
||||
<h6><Link href="restaurant">Chocolate Dutch Frappe</Link></h6>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod veniam, quis.nostrud</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Frape Variant Section */}
|
||||
|
||||
{/* Gallery Section */}
|
||||
<section className="gallery-section">
|
||||
<div className="outer-container">
|
||||
<GallerySlider1/>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section */}
|
||||
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
110
app/gallery-2/page.js
Normal file
110
app/gallery-2/page.js
Normal file
@ -0,0 +1,110 @@
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Link from "next/link"
|
||||
import GallerySlider1 from '@/components/slider/GallerySlider1'
|
||||
export default function Home() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={5} footerStyle={1} breadcrumbTitle="Gallery">
|
||||
|
||||
|
||||
{/* Gallery Page Section */}
|
||||
<section className="gallery-page-section-two">
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/31.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/32.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/33.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/34.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/35.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/36.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Page Section */}
|
||||
|
||||
{/* Gallery Section */}
|
||||
<section className="gallery-section">
|
||||
<div className="outer-container">
|
||||
<GallerySlider1/>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section */}
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
122
app/gallery/page.js
Normal file
122
app/gallery/page.js
Normal file
@ -0,0 +1,122 @@
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Link from "next/link"
|
||||
import GallerySlider1 from '@/components/slider/GallerySlider1'
|
||||
export default function Home() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={5} footerStyle={1} breadcrumbTitle="Gallery">
|
||||
|
||||
{/* Gallery Page Section */}
|
||||
<section className="gallery-page-section">
|
||||
<div className="outer-container">
|
||||
<div className="masonry-items-container row no-gutters clearfix">
|
||||
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="gallery-block-two masonry-item">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/25.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="gallery-block-two masonry-item">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/26.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="gallery-block-two masonry-item">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/29.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="row no-gutters">
|
||||
<div className="col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="gallery-block-two masonry-item">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/27.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="gallery-block-two masonry-item">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/28.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-lg-12 col-md-12 col-sm-12">
|
||||
<div className="gallery-block-two masonry-item">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/30.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Page Section */}
|
||||
|
||||
{/* Gallery Section */}
|
||||
<section className="gallery-section">
|
||||
<div className="outer-container">
|
||||
<GallerySlider1/>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section */}
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
35
app/index-2/page.js
Normal file
35
app/index-2/page.js
Normal file
@ -0,0 +1,35 @@
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Banner from "@/components/sections/home2/Banner"
|
||||
|
||||
import Gallery from "@/components/sections/home2/Gallery"
|
||||
import History from "@/components/sections/home2/History"
|
||||
import Location from "@/components/sections/home2/Location"
|
||||
import Menus from "@/components/sections/home2/Menus"
|
||||
import Specials from "@/components/sections/home2/Specials"
|
||||
import Contact from "@/components/sections/home2/Contact"
|
||||
|
||||
|
||||
export default function Home() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={2} footerStyle={2}>
|
||||
<Banner />
|
||||
<Specials />
|
||||
<Location />
|
||||
<Menus />
|
||||
<History />
|
||||
<Gallery />
|
||||
<Contact />
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
38
app/index-3/page.js
Normal file
38
app/index-3/page.js
Normal file
@ -0,0 +1,38 @@
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Banner from "@/components/sections/home3/Banner"
|
||||
import Blog from "@/components/sections/home3/Blog"
|
||||
import Video from "@/components/sections/home3/video"
|
||||
import Newsletter from "@/components/sections/home3/Newsletter"
|
||||
import Recipe from "@/components/sections/home3/Recipe"
|
||||
import Fluid from "@/components/sections/home3/Fluid"
|
||||
import Recipe2 from "@/components/sections/home3/Recipe2"
|
||||
import Instagram from "@/components/sections/home3/Instagram"
|
||||
import PopularRecipe from "@/components/sections/home3/PopularRecipe"
|
||||
import Blog2 from "@/components/sections/home3/Blog2"
|
||||
import AboutNews from "@/components/sections/home3/AboutNews"
|
||||
export default function Home() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={3} footerStyle={3}>
|
||||
<Banner />
|
||||
<Newsletter />
|
||||
<Recipe />
|
||||
<Fluid />
|
||||
<Recipe2 />
|
||||
<Instagram />
|
||||
<Instagram />
|
||||
<Blog />
|
||||
<Video />
|
||||
<AboutNews />
|
||||
<AboutNews />
|
||||
<PopularRecipe />
|
||||
<Blog2 />
|
||||
|
||||
|
||||
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
33
app/index-4/page.js
Normal file
33
app/index-4/page.js
Normal file
@ -0,0 +1,33 @@
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
|
||||
import Banner from "@/components/sections/home4/Banner"
|
||||
import Clients from "@/components/sections/home4/Clients"
|
||||
import Gallery from "@/components/sections/home4/Gallery"
|
||||
import Menu from "@/components/sections/home4/Menu"
|
||||
import Menu2 from "@/components/sections/home4/Menu2"
|
||||
import Menu3 from "@/components/sections/home4/Menu3"
|
||||
import Staff from "@/components/sections/home4/Staff"
|
||||
import Testimonial from "@/components/sections/home4/Testimonial"
|
||||
import Tips from "@/components/sections/home4/Tips"
|
||||
import Video from "@/components/sections/home4/Video"
|
||||
export default function Home() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={4} footerStyle={4}>
|
||||
<Banner />
|
||||
<Testimonial />
|
||||
<Menu />
|
||||
<Video />
|
||||
<Tips />
|
||||
<Menu2 />
|
||||
<Gallery />
|
||||
<Menu3 />
|
||||
<Staff />
|
||||
<Clients />
|
||||
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
34
app/index-5/page.js
Normal file
34
app/index-5/page.js
Normal file
@ -0,0 +1,34 @@
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Banner from "@/components/sections/home1/Banner"
|
||||
import Blog from "@/components/sections/home1/Blog"
|
||||
|
||||
import Testimonial from "@/components/sections/home1/Testimonial"
|
||||
import Gallery from "@/components/sections/home1/Gallery"
|
||||
import Juice from "@/components/sections/home1/Juice"
|
||||
import Beverage from "@/components/sections/home1/Beverage"
|
||||
import Deal from "@/components/sections/home1/Deal"
|
||||
import Recipe from "@/components/sections/home1/Recipe"
|
||||
import Fluid from "@/components/sections/home1/Fluid"
|
||||
|
||||
export default function Home() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={1} footerStyle={1}>
|
||||
<Banner />
|
||||
<Juice />
|
||||
<Beverage />
|
||||
<Deal />
|
||||
<Recipe />
|
||||
<Fluid />
|
||||
<Testimonial />
|
||||
<Blog />
|
||||
<Gallery />
|
||||
|
||||
|
||||
|
||||
</Layout>
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
23
app/layout.js
Normal file
23
app/layout.js
Normal file
@ -0,0 +1,23 @@
|
||||
import "@/node_modules/react-modal-video/css/modal-video.css"
|
||||
import "public/assets/css/style.css"
|
||||
import "public/assets/css/responsive.css"
|
||||
|
||||
|
||||
|
||||
import 'swiper/css'
|
||||
// import "swiper/css/navigation"
|
||||
import "swiper/css/pagination"
|
||||
import 'swiper/css/free-mode';
|
||||
import {niconne, poppins, tangerine} from '@/lib/font'
|
||||
export const metadata = {
|
||||
title: 'Create Next App',
|
||||
description: 'Generated by create next app',
|
||||
}
|
||||
|
||||
export default function RootLayout({ children }) {
|
||||
return (
|
||||
<html lang="en" className={`${niconne.variable} ${poppins.variable} ${tangerine.variable}`}>
|
||||
<body>{children}</body>
|
||||
</html>
|
||||
)
|
||||
}
|
||||
9
app/loading.js
Normal file
9
app/loading.js
Normal file
@ -0,0 +1,9 @@
|
||||
import Preloader from '@/components/elements/Preloader'
|
||||
|
||||
export default function loading() {
|
||||
return (
|
||||
<>
|
||||
<Preloader />
|
||||
</>
|
||||
)
|
||||
}
|
||||
233
app/menu/page.js
Normal file
233
app/menu/page.js
Normal file
@ -0,0 +1,233 @@
|
||||
'use client'
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Link from "next/link"
|
||||
import GallerySlider1 from '@/components/slider/GallerySlider1'
|
||||
import ModalVideo from 'react-modal-video'
|
||||
import { useState } from 'react'
|
||||
export default function Home() {
|
||||
const [isOpen, setOpen] = useState(false)
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={5} footerStyle={1} breadcrumbTitle="Menu">
|
||||
|
||||
{/* Menu Page Section */}
|
||||
<section className="menu-page-section">
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Menu Block Two */}
|
||||
<div className="menu-block-two col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="side-icon">
|
||||
<img src="assets/images/icons/menu-icon-1.png" alt="" />
|
||||
</div>
|
||||
<div className="icon">
|
||||
<img src="assets/images/icons/menu-1.png" alt="" />
|
||||
</div>
|
||||
<h6><Link href="#">Awesome taste</Link></h6>
|
||||
<div className="text">Us percipit urbanitas referrentur ea. Mei at numquam molestiae intellegam.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block Two */}
|
||||
<div className="menu-block-two col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="side-icon">
|
||||
<img src="assets/images/icons/menu-icon-2.png" alt="" />
|
||||
</div>
|
||||
<div className="icon">
|
||||
<img src="assets/images/icons/menu-2.png" alt="" />
|
||||
</div>
|
||||
<h6><Link href="#">Organic fruits</Link></h6>
|
||||
<div className="text">Us percipit urbanitas referrentur ea. Mei at numquam molestiae intellegam.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block Two */}
|
||||
<div className="menu-block-two col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="side-icon">
|
||||
<img src="assets/images/icons/menu-icon-3.png" alt="" />
|
||||
</div>
|
||||
<div className="icon">
|
||||
<img src="assets/images/icons/menu-3.png" alt="" />
|
||||
</div>
|
||||
<h6><Link href="#">Healthy Blends</Link></h6>
|
||||
<div className="text">Us percipit urbanitas referrentur ea. Mei at numquam molestiae intellegam.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Restaurant Section */}
|
||||
|
||||
{/* Video Section */}
|
||||
<section className="video-section-two">
|
||||
<div className="outer-container">
|
||||
{/* Video Box */}
|
||||
<div className="video-box">
|
||||
<figure className="video-image">
|
||||
<img src="assets/images/background/8.jpg" alt=""/>
|
||||
</figure>
|
||||
<a onClick={() => setOpen(true)} className="lightbox-image overlay-box"><span className="flaticon-play-arrow"><i className="ripple"></i></span></a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Video Section */}
|
||||
<ModalVideo channel='youtube' autoplay isOpen={isOpen} videoId="Get7rqXYrbQ" onClose={() => setOpen(false)} />
|
||||
|
||||
{/* Menus Section */}
|
||||
<section className="menus-section style-two">
|
||||
<figure className="menu-bottom-image">
|
||||
<img src="assets/images/resource/menu-9.jpg" alt=""/>
|
||||
</figure>
|
||||
<div className="auto-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<div className="title">Softly & Crunchy</div>
|
||||
<h2>Menus</h2>
|
||||
<div className="separate"></div>
|
||||
</div>
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Menu Column */}
|
||||
<div className="menu-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-1.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Grilled Toast Burger</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-3.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Fried snacks</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-5.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Pizza</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-7.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Sandwiches</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Column */}
|
||||
<div className="menu-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-2.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Coca Cola</Link></h6>
|
||||
<div className="title">Carbonated Drinks</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-4.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Papsi</Link></h6>
|
||||
<div className="title">Carbonated Drinks</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-6.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Mirinda</Link></h6>
|
||||
<div className="title">Carbonated Drinks</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-8.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Fanta</Link></h6>
|
||||
<div className="title">Carbonated Drinks</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Menus Section */}
|
||||
|
||||
{/* Gallery Section */}
|
||||
<section className="gallery-section">
|
||||
<div className="outer-container">
|
||||
<GallerySlider1/>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section */}
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
188
app/milkshake/page.js
Normal file
188
app/milkshake/page.js
Normal file
@ -0,0 +1,188 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import { Autoplay, Navigation, Pagination } from "swiper/modules"
|
||||
import { Swiper, SwiperSlide } from "swiper/react"
|
||||
import GallerySlider1 from '@/components/slider/GallerySlider1'
|
||||
|
||||
export default function Home() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={5} footerStyle={1} breadcrumbTitle="Milk Shake">
|
||||
{/* Milkshake Section */}
|
||||
<section className="milkshake-section">
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/icons/icon-1.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/icons/icon-2.png)' }} ></div>
|
||||
<div className="icon-layer-three" style={{ backgroundImage: 'url(assets/images/icons/icon-3.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="inner-container">
|
||||
<div className="big-image">
|
||||
<img src="assets/images/resource/milkshake.jpg" alt="" />
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="section-text">yummy</div>
|
||||
<div className="text">
|
||||
<p>A milkshake is a sweet drink made by blending milk, ice cream, and flavorings or sweeteners such as butterscotch, caramel sauce, chocolate syrup, fruit syrup, or whole fruit into a thick, sweet, cold mixture. It may also be made using other types of milk such as almond milk, coconut milk, or soy milk.</p>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo <Link href="#">inventore veritatis et quasi architecto beatae vitae</Link> dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Milkshake Section */}
|
||||
|
||||
{/* Menus Section */}
|
||||
<section className="menus-section style-two">
|
||||
<figure className="menu-bottom-image">
|
||||
<img src="assets/images/resource/menu-10.png" alt=""/>
|
||||
</figure>
|
||||
<div className="auto-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<h2>MilkShake <span>Variation</span></h2>
|
||||
<div className="separate"></div>
|
||||
</div>
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Menu Column */}
|
||||
<div className="menu-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-11.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu"> Banana Milkshake</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-12.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Vanilla Milkshake. </Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-13.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Mango Milkshake</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-14.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Banana Khajur Milkshake.</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Column */}
|
||||
<div className="menu-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-15.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Chocolate Milkshake.</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-16.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Strawberry Milkshake.</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-17.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Chocolate-Banana Milkshake.</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-18.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Cookies and Cream Milkshake.</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Menus Section */}
|
||||
|
||||
{/* Gallery Section */}
|
||||
<section className="gallery-section">
|
||||
<div className="outer-container">
|
||||
<GallerySlider1/>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section */}
|
||||
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
34
app/not-found.js
Normal file
34
app/not-found.js
Normal file
@ -0,0 +1,34 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import GallerySlider1 from '@/components/slider/GallerySlider1'
|
||||
import Layout from "@/components/layout/Layout"
|
||||
|
||||
|
||||
export default function Error404() {
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={1} footerStyle={1} breadcrumbTitle="404 Error">
|
||||
{/* Error Section */}
|
||||
<section className="error-section">
|
||||
<div className="auto-container">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/error.png" alt="" />
|
||||
</div>
|
||||
<h2>Page Not Found</h2>
|
||||
<Link href="/" className="theme-btn btn-style-two clearfix"><span className="icon"></span>Return To Home</Link>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Error Section */}
|
||||
{/* Gallery Section */}
|
||||
<section className="gallery-section">
|
||||
<div className="outer-container">
|
||||
<GallerySlider1/>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section */}
|
||||
|
||||
</Layout>
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
43
app/page.js
Normal file
43
app/page.js
Normal file
@ -0,0 +1,43 @@
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Banner from "@/components/sections/home1/Banner"
|
||||
import Gallery from "@/components/sections/home2/Gallery"
|
||||
import History from "@/components/sections/home2/History"
|
||||
import Location from "@/components/sections/home2/Location"
|
||||
import Menus from "@/components/sections/home2/Menus"
|
||||
import Specials from "@/components/sections/home2/Specials"
|
||||
import Contact from "@/components/sections/home2/Contact"
|
||||
import Juice from "@/components/sections/home1/Juice"
|
||||
import Beverage from "@/components/sections/home1/Beverage"
|
||||
import Recipe from "@/components/sections/home3/Recipe"
|
||||
import Fluid from "@/components/sections/home3/Fluid"
|
||||
import Tips from "@/components/sections/home4/Tips"
|
||||
import Video from "@/components/sections/home4/Video"
|
||||
import Menu2 from "@/components/sections/home4/Menu2"
|
||||
|
||||
|
||||
export default function Home() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={2} footerStyle={2}>
|
||||
<Banner />
|
||||
<Juice />
|
||||
<Recipe />
|
||||
<Fluid />
|
||||
<Specials />
|
||||
<Menus />
|
||||
<Video />
|
||||
<Menu2 />
|
||||
<Gallery />
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
264
app/restaurant/page.js
Normal file
264
app/restaurant/page.js
Normal file
@ -0,0 +1,264 @@
|
||||
'use client'
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Link from "next/link"
|
||||
import { useState } from 'react'
|
||||
import GallerySlider1 from '@/components/slider/GallerySlider1'
|
||||
export default function Home() {
|
||||
const [isActive, setIsActive] = useState({
|
||||
status: false,
|
||||
key: 1,
|
||||
})
|
||||
|
||||
const handleToggle = (key) => {
|
||||
if (isActive.key === key) {
|
||||
setIsActive({
|
||||
status: false,
|
||||
})
|
||||
} else {
|
||||
setIsActive({
|
||||
status: true,
|
||||
key,
|
||||
})
|
||||
}
|
||||
}
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={5} footerStyle={1} breadcrumbTitle="Our Restaurant">
|
||||
<div>
|
||||
{/* Restaurant Section */}
|
||||
<section className="restaurant-section">
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/resource/restaurant-icon-1.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/resource/restaurant-icon-2.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="inner-container">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/restaurant.jpg" alt="" />
|
||||
</div>
|
||||
<div className="opening-box" style={{ backgroundImage: 'url(assets/images/resource/restaurant-1.jpg)' }} >
|
||||
<div className="box-inner">
|
||||
<h3>Opening <span>Hourse</span></h3>
|
||||
<ul className="timing-list">
|
||||
<li>Mon - Thu<span>9AM - 9PM</span></li>
|
||||
<li>Fri- Sat<span>10AM - 10PM</span></li>
|
||||
</ul>
|
||||
<div className="closed">SUNDAY CLOSED</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Restaurant Section */}
|
||||
|
||||
{/* Gallery Section Two */}
|
||||
<section className="gallery-section-two">
|
||||
<div className="outer-container">
|
||||
<div className="masonry-items-container row clearfix">
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/19.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="row">
|
||||
<div className="gallery-block-two masonry-item col-lg-12 col-md-12 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/20.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item col-lg-12 col-md-12 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/23.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="row">
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/21.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/22.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item col-lg-12 col-md-12 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/24.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section Two */}
|
||||
|
||||
{/* Faq Section */}
|
||||
<section className="faq-section">
|
||||
<div className="pattern-layer" style={{ backgroundImage: 'url(assets/images/background/7.jpg)' }} ></div>
|
||||
<div className="auto-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<div className="title">funfact</div>
|
||||
<h2>Faq</h2>
|
||||
<div className="separate"></div>
|
||||
</div>
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Accordion Column */}
|
||||
<div className="accordion-column col-lg-6 col-md-12 col-sm-12">
|
||||
{/* Accordian Box */}
|
||||
<ul className="accordion-box">
|
||||
|
||||
{/*Block*/}
|
||||
<li className={isActive.key == 1 ? "accrodion block active-block" : "accrodion block"} onClick={() => handleToggle(1)}>
|
||||
<div className="acc-btn"><div className="icon-outer"><span className="icon icon-plus flaticon-plus-symbol"></span> <span className="icon icon-minus flaticon-substract"></span></div><span>01.</span> What is the our resturent</div>
|
||||
<div className="acc-content">
|
||||
<div className="content">
|
||||
<div className="text">
|
||||
<p>Us percipit urbanitas referrentur ea. Mei at numquam molestiae intellegam. Ansed dictas accumsan. Nam sint atqui voluptatibus an, pro ne malis semper perpetua. </p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
{/*Block*/}
|
||||
<li className={isActive.key == 2 ? "accrodion block active-block" : "accrodion block"} onClick={() => handleToggle(2)}>
|
||||
<div className="acc-btn"><div className="icon-outer"><span className="icon icon-plus flaticon-plus-symbol"></span> <span className="icon icon-minus flaticon-substract"></span></div><span>02.</span> intellegam. Ansed dictas accumsan</div>
|
||||
<div className="acc-content current">
|
||||
<div className="content">
|
||||
<div className="text" onClick={() => handleToggle(2)}>
|
||||
<p>Us percipit urbanitas referrentur ea. Mei at numquam molestiae intellegam. Ansed dictas accumsan. Nam sint atqui voluptatibus an, pro ne malis semper perpetua. </p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
{/*Block*/}
|
||||
<li className={isActive.key == 3 ? "accrodion block active-block" : "accrodion block"} onClick={() => handleToggle(3)}>
|
||||
<div className="acc-btn"><div className="icon-outer"><span className="icon icon-plus flaticon-plus-symbol"></span> <span className="icon icon-minus flaticon-substract"></span></div><span>03.</span> pro ne malis semper perpetua.</div>
|
||||
<div className="acc-content">
|
||||
<div className="content">
|
||||
<div className="text">
|
||||
<p>Us percipit urbanitas referrentur ea. Mei at numquam molestiae intellegam. Ansed dictas accumsan. Nam sint atqui voluptatibus an, pro ne malis semper perpetua. </p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{/* Accordion Column */}
|
||||
<div className="accordion-column col-lg-6 col-md-12 col-sm-12">
|
||||
{/* Accordian Box */}
|
||||
<ul className="accordion-box">
|
||||
|
||||
{/*Block*/}
|
||||
<li className={isActive.key == 4 ? "accrodion block active-block" : "accrodion block"} onClick={() => handleToggle(4)}>
|
||||
<div className="acc-btn"><div className="icon-outer"><span className="icon icon-plus flaticon-plus-symbol"></span> <span className="icon icon-minus flaticon-substract"></span></div><span>01.</span> What is the our resturent</div>
|
||||
<div className="acc-content">
|
||||
<div className="content">
|
||||
<div className="text">
|
||||
<p>Us percipit urbanitas referrentur ea. Mei at numquam molestiae intellegam. Ansed dictas accumsan. Nam sint atqui voluptatibus an, pro ne malis semper perpetua. </p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
{/*Block*/}
|
||||
<li className={isActive.key == 5 ? "accrodion block active-block" : "accrodion block"} onClick={() => handleToggle(5)}>
|
||||
<div className="acc-btn"><div className="icon-outer"><span className="icon icon-plus flaticon-plus-symbol"></span> <span className="icon icon-minus flaticon-substract"></span></div><span>02.</span> intellegam. Ansed dictas accumsan</div>
|
||||
<div className="acc-content current">
|
||||
<div className="content">
|
||||
<div className="text">
|
||||
<p>Us percipit urbanitas referrentur ea. Mei at numquam molestiae intellegam. Ansed dictas accumsan. Nam sint atqui voluptatibus an, pro ne malis semper perpetua. </p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
{/*Block*/}
|
||||
<li className={isActive.key == 6 ? "accrodion block active-block" : "accrodion block"} onClick={() => handleToggle(6)}>
|
||||
<div className="acc-btn"><div className="icon-outer"><span className="icon icon-plus flaticon-plus-symbol"></span> <span className="icon icon-minus flaticon-substract"></span></div><span>03.</span> pro ne malis semper perpetua.</div>
|
||||
<div className="acc-content">
|
||||
<div className="content">
|
||||
<div className="text">
|
||||
<p>Us percipit urbanitas referrentur ea. Mei at numquam molestiae intellegam. Ansed dictas accumsan. Nam sint atqui voluptatibus an, pro ne malis semper perpetua. </p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Faq Section */}
|
||||
|
||||
{/* Gallery Section */}
|
||||
<section className="gallery-section">
|
||||
<div className="outer-container">
|
||||
<GallerySlider1/>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section */}
|
||||
</div>
|
||||
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
189
app/slushy/page.js
Normal file
189
app/slushy/page.js
Normal file
@ -0,0 +1,189 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import GallerySlider1 from '@/components/slider/GallerySlider1'
|
||||
|
||||
|
||||
export default function Home() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={5} footerStyle={1} breadcrumbTitle="Slushy">
|
||||
<div>
|
||||
{/* Milkshake Section */}
|
||||
<section className="milkshake-section">
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/icons/icon-1.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/icons/icon-2.png)' }} ></div>
|
||||
<div className="icon-layer-three" style={{ backgroundImage: 'url(assets/images/icons/icon-3.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="inner-container">
|
||||
<div className="big-image">
|
||||
<img src="assets/images/resource/slushy.jpg" alt="" />
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="section-text">yummy</div>
|
||||
<div className="text">
|
||||
<p>A slushy, sometimes spelt as slushie and slushie, also commonly referred to as a slush, frozen beverage, or frozen drink, is a type of beverage made of flavored ice and a drink, commonly soda, similar to granitas. A slushy can either be carbonated or non-carbonated.</p>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Milkshake Section */}
|
||||
|
||||
{/* Menus Section */}
|
||||
<section className="menus-section style-two">
|
||||
<figure className="menu-bottom-image">
|
||||
<img src="assets/images/resource/menu-10.png" alt=""/>
|
||||
</figure>
|
||||
<div className="auto-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<h2>Slushy <span>Variation</span></h2>
|
||||
<div className="separate"></div>
|
||||
</div>
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Menu Column */}
|
||||
<div className="menu-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-27.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Strawberry</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-28.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Sour Apple</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-29.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Bubblegum</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-30.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Blue Raspberry</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Column */}
|
||||
<div className="menu-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-31.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Grape</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-32.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Cherry</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-33.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Sour Cherry</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-34.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Lemon and Lime</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Menus Section */}
|
||||
|
||||
{/* Gallery Section */}
|
||||
<section className="gallery-section">
|
||||
<div className="outer-container">
|
||||
<GallerySlider1/>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section */}
|
||||
</div>
|
||||
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
280
app/team/page.js
Normal file
280
app/team/page.js
Normal file
@ -0,0 +1,280 @@
|
||||
'use client'
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Link from "next/link"
|
||||
import { Autoplay, Navigation, Pagination } from "swiper/modules"
|
||||
import { Swiper, SwiperSlide } from "swiper/react"
|
||||
import GallerySlider1 from '@/components/slider/GallerySlider1'
|
||||
|
||||
const swiperOptions = {
|
||||
modules: [Autoplay, Pagination, Navigation],
|
||||
slidesPerView: 1,
|
||||
spaceBetween: 0,
|
||||
// autoplay: {
|
||||
// delay: 2500,
|
||||
// disableOnInteraction: false,
|
||||
// },
|
||||
loop: true,
|
||||
|
||||
// Navigation
|
||||
navigation: {
|
||||
nextEl: '.h1n',
|
||||
prevEl: '.h1p',
|
||||
},
|
||||
|
||||
// Pagination
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
clickable: true,
|
||||
},
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
export default function Home() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={5} footerStyle={1} breadcrumbTitle="Team">
|
||||
{/* Team Page Section */}
|
||||
<section className="team-page-section">
|
||||
<div className="outer-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Staff Block */}
|
||||
<div className="staff-block col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/staff-4.jpg" alt="" /></Link>
|
||||
<div className="overlay-box">
|
||||
<div className="content">
|
||||
<h6><Link href="#">Jusica Malina</Link></h6>
|
||||
<div className="designation">Pastry Chef</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-facebook-square"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter-square"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Staff Block */}
|
||||
<div className="staff-block col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/staff-5.jpg" alt="" /></Link>
|
||||
<div className="overlay-box">
|
||||
<div className="content">
|
||||
<h6><Link href="#">Jusica Malina</Link></h6>
|
||||
<div className="designation">Pastry Chef</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-facebook-square"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter-square"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Staff Block */}
|
||||
<div className="staff-block col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/staff-6.jpg" alt="" /></Link>
|
||||
<div className="overlay-box">
|
||||
<div className="content">
|
||||
<h6><Link href="#">Jusica Malina</Link></h6>
|
||||
<div className="designation">Pastry Chef</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-facebook-square"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter-square"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Staff Block */}
|
||||
<div className="staff-block col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/staff-7.jpg" alt="" /></Link>
|
||||
<div className="overlay-box">
|
||||
<div className="content">
|
||||
<h6><Link href="#">Jusica Malina</Link></h6>
|
||||
<div className="designation">Pastry Chef</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-facebook-square"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter-square"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Staff Block */}
|
||||
<div className="staff-block col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/staff-8.jpg" alt="" /></Link>
|
||||
<div className="overlay-box">
|
||||
<div className="content">
|
||||
<h6><Link href="#">Jusica Malina</Link></h6>
|
||||
<div className="designation">Pastry Chef</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-facebook-square"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter-square"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Staff Block */}
|
||||
<div className="staff-block col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/staff-9.jpg" alt="" /></Link>
|
||||
<div className="overlay-box">
|
||||
<div className="content">
|
||||
<h6><Link href="#">Jusica Malina</Link></h6>
|
||||
<div className="designation">Pastry Chef</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-facebook-square"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter-square"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Staff Block */}
|
||||
<div className="staff-block col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/staff-10.jpg" alt="" /></Link>
|
||||
<div className="overlay-box">
|
||||
<div className="content">
|
||||
<h6><Link href="#">Jusica Malina</Link></h6>
|
||||
<div className="designation">Pastry Chef</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-facebook-square"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter-square"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Staff Block */}
|
||||
<div className="staff-block col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/staff-11.jpg" alt="" /></Link>
|
||||
<div className="overlay-box">
|
||||
<div className="content">
|
||||
<h6><Link href="#">Jusica Malina</Link></h6>
|
||||
<div className="designation">Pastry Chef</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-facebook-square"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter-square"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Team Page Section */}
|
||||
|
||||
{/* Testimonial Section */}
|
||||
<section className="testimonial-section">
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/icons/icon-1.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/icons/icon-2.png)' }} ></div>
|
||||
<div className="icon-layer-three" style={{ backgroundImage: 'url(assets/images/icons/icon-3.png)' }} ></div>
|
||||
<div className="pattern-layer" style={{ backgroundImage: 'url(assets/images/background/pattern-4.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<div className="title">Testimonial</div>
|
||||
<h2>What People Say</h2>
|
||||
<div className="separate"></div>
|
||||
</div>
|
||||
<div className="inner-container">
|
||||
<Swiper {...swiperOptions} className="single-item-carousel ">
|
||||
|
||||
{/* Testimonial Block */}
|
||||
<SwiperSlide>
|
||||
<div className="testimonial-block">
|
||||
<div className="inner-box">
|
||||
<div className="author-image">
|
||||
<img src="assets/images/resource/author-1.jpg" alt="" />
|
||||
</div>
|
||||
<div className="text">“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et <br/> dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation <br/> ullamco.”</div>
|
||||
<div className="designation">Meredith Grant <span>- Host Mother</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Testimonial Block */}
|
||||
<SwiperSlide>
|
||||
<div className="testimonial-block">
|
||||
<div className="inner-box">
|
||||
<div className="author-image">
|
||||
<img src="assets/images/resource/author-1.jpg" alt="" />
|
||||
</div>
|
||||
<div className="text">“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et <br/> dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation <br/> ullamco.”</div>
|
||||
<div className="designation">Meredith Grant <span>- Host Mother</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Testimonial Block */}
|
||||
<SwiperSlide>
|
||||
<div className="testimonial-block">
|
||||
<div className="inner-box">
|
||||
<div className="author-image">
|
||||
<img src="assets/images/resource/author-1.jpg" alt="" />
|
||||
</div>
|
||||
<div className="text">“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et <br/> dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation <br/> ullamco.”</div>
|
||||
<div className="designation">Meredith Grant <span>- Host Mother</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
|
||||
</Swiper>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Testimonial Section */}
|
||||
|
||||
{/* Gallery Section */}
|
||||
<section className="gallery-section">
|
||||
<div className="outer-container">
|
||||
<GallerySlider1/>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section */}
|
||||
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
13
components/elements/BackToTop.js
Normal file
13
components/elements/BackToTop.js
Normal file
@ -0,0 +1,13 @@
|
||||
|
||||
export default function BackToTop({ scroll }) {
|
||||
|
||||
return (
|
||||
<>
|
||||
{scroll && (
|
||||
<a className="scroll-to-top scroll-to-target d-block" href="#top">
|
||||
<i className="fas fa-angle-up"></i>
|
||||
</a>
|
||||
)}
|
||||
</>
|
||||
)
|
||||
}
|
||||
56
components/elements/Counter.js
Normal file
56
components/elements/Counter.js
Normal file
@ -0,0 +1,56 @@
|
||||
import { useEffect, useRef, useState } from 'react'
|
||||
|
||||
|
||||
export default function Counter({ end, duration }) {
|
||||
const [count, setCount] = useState(0)
|
||||
const countRef = useRef(null)
|
||||
const increment = end / duration
|
||||
|
||||
useEffect(() => {
|
||||
const observer = new IntersectionObserver(
|
||||
([entry]) => {
|
||||
if (entry.isIntersecting) {
|
||||
startCount()
|
||||
observer.disconnect()
|
||||
}
|
||||
},
|
||||
{ threshold: 0 }
|
||||
)
|
||||
|
||||
if (countRef.current) {
|
||||
observer.observe(countRef.current)
|
||||
}
|
||||
|
||||
return () => {
|
||||
observer.disconnect()
|
||||
}
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
const interval = setInterval(() => {
|
||||
setCount((prevCount) => {
|
||||
const newCount = prevCount + increment
|
||||
if (newCount >= end) {
|
||||
clearInterval(interval)
|
||||
return end
|
||||
} else {
|
||||
return newCount
|
||||
}
|
||||
})
|
||||
}, 1000 / duration)
|
||||
|
||||
return () => {
|
||||
clearInterval(interval)
|
||||
}
|
||||
}, [end, increment])
|
||||
|
||||
const startCount = () => {
|
||||
setCount(0)
|
||||
}
|
||||
|
||||
return (
|
||||
<span ref={countRef}>
|
||||
<span>{Math.round(count)}</span>
|
||||
</span>
|
||||
)
|
||||
}
|
||||
31
components/elements/CounterUp.js
Normal file
31
components/elements/CounterUp.js
Normal file
@ -0,0 +1,31 @@
|
||||
'use client'
|
||||
import { useEffect, useState } from 'react'
|
||||
import Counter from './Counter'
|
||||
|
||||
export default function CounterUp({ end }) {
|
||||
const [inViewport, setInViewport] = useState(false)
|
||||
|
||||
const handleScroll = () => {
|
||||
const elements = document.getElementsByClassName('count-text')
|
||||
if (elements.length > 0) {
|
||||
const element = elements[0]
|
||||
const rect = element.getBoundingClientRect()
|
||||
const isInViewport = rect.top >= 0 && rect.bottom <= window.innerHeight
|
||||
if (isInViewport && !inViewport) {
|
||||
setInViewport(true)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
window.addEventListener('scroll', handleScroll)
|
||||
return () => {
|
||||
window.removeEventListener('scroll', handleScroll)
|
||||
}
|
||||
}, [])
|
||||
return (
|
||||
<>
|
||||
<span className="count-text">{inViewport && <Counter end={end} duration={20} />}</span>
|
||||
</>
|
||||
)
|
||||
}
|
||||
16
components/elements/DataBg.js
Normal file
16
components/elements/DataBg.js
Normal file
@ -0,0 +1,16 @@
|
||||
import { useEffect } from 'react'
|
||||
|
||||
export default function DataBg() {
|
||||
useEffect(() => {
|
||||
const elements = document.querySelectorAll('[data-bg]')
|
||||
|
||||
elements.forEach((element) => {
|
||||
element.style.backgroundImage = `url(${element.getAttribute('data-bg')})`
|
||||
})
|
||||
}, [])
|
||||
return (
|
||||
<>
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
9
components/elements/Preloader.js
Normal file
9
components/elements/Preloader.js
Normal file
@ -0,0 +1,9 @@
|
||||
export default function Preloader() {
|
||||
return (
|
||||
<>
|
||||
<div className="preloader"></div>
|
||||
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
27
components/elements/ThemeSwitch.js
Normal file
27
components/elements/ThemeSwitch.js
Normal file
@ -0,0 +1,27 @@
|
||||
import { useEffect, useState } from "react"
|
||||
|
||||
export default function ThemeSwitch() {
|
||||
const [togglETHeme, setTogglETHeme] = useState(
|
||||
() => JSON.parse(localStorage.getItem("togglETHeme")) || "light-theme"
|
||||
)
|
||||
useEffect(() => {
|
||||
localStorage.setItem("togglETHeme", JSON.stringify(togglETHeme))
|
||||
document.body.classList.add(togglETHeme)
|
||||
return () => {
|
||||
document.body.classList.remove(togglETHeme)
|
||||
}
|
||||
}, [togglETHeme])
|
||||
|
||||
return (
|
||||
<>
|
||||
<nav className="switcher__tab"
|
||||
onClick={() => togglETHeme === "light-theme" ? setTogglETHeme("dark-theme") : setTogglETHeme("light-theme")
|
||||
}
|
||||
>
|
||||
<span className="switcher__btn light-mode"><i className="flaticon-sun" /></span>
|
||||
<span className="switcher__mode" />
|
||||
<span className="switcher__btn dark-mode"><i className="flaticon-moon" /></span>
|
||||
</nav>
|
||||
</>
|
||||
)
|
||||
}
|
||||
54
components/elements/VideoPopup.js
Normal file
54
components/elements/VideoPopup.js
Normal file
@ -0,0 +1,54 @@
|
||||
'use client'
|
||||
import { useState } from 'react'
|
||||
import ModalVideo from 'react-modal-video'
|
||||
|
||||
|
||||
export default function VideoPopup({ style, text }) {
|
||||
const [isOpen, setOpen] = useState(false)
|
||||
return (
|
||||
<>
|
||||
{/* <a onClick={() => setOpen(true)} className="lightbox-image"><i className="icon-play" /></a> */}
|
||||
{/* <span className="play-icon flaticon-play" onClick={() => setOpen(true)} /> */}
|
||||
{!style &&
|
||||
<a onClick={() => setOpen(true)} className="overlay-link lightbox-image video-fancybox ripple"><span className="play-icon flaticon-play" />
|
||||
</a>
|
||||
|
||||
}
|
||||
|
||||
|
||||
{style === 1 &&
|
||||
<div className="video-btn">
|
||||
<a onClick={() => setOpen(true)} className="overlay-link lightbox-image video-fancybox ripple"><span className="play-icon flaticon-play" /> </a>
|
||||
</div>
|
||||
}
|
||||
{style === 2 &&
|
||||
<div className="video-btn">
|
||||
<a onClick={() => setOpen(true)} className="overlay-link lightbox-image video-fancybox ripple"><span className="play-icon flaticon-play" /></a><h6>{text ? text : "Latest Program Video"}</h6>
|
||||
</div>
|
||||
}
|
||||
{style === 3 &&
|
||||
<div className="video-btn">
|
||||
<a onClick={() => setOpen(true)} className="lightbox-image">
|
||||
<i className="customicon-play-button" />
|
||||
<span className="border-animation border-1" />
|
||||
<span className="border-animation border-2" />
|
||||
<span className="border-animation border-3" />
|
||||
</a>
|
||||
</div>
|
||||
}
|
||||
{style === 4 &&
|
||||
<div className="video-btn">
|
||||
<a onClick={() => setOpen(true)} className="lightbox-image">
|
||||
<img src="/assets/images-4/icons/video-btn-1.png" alt="" /></a>
|
||||
</div>
|
||||
}
|
||||
{style === 5 &&
|
||||
<a onClick={() => setOpen(true)} className="video-btn overlay-link lightbox-image video-fancybox ripple"><span className="fas fa-play" /></a>
|
||||
}
|
||||
|
||||
|
||||
|
||||
<ModalVideo channel='youtube' autoplay isOpen={isOpen} videoId="vfhzo499OeA" onClose={() => setOpen(false)} />
|
||||
</>
|
||||
)
|
||||
}
|
||||
22
components/layout/Breadcrumb.js
Normal file
22
components/layout/Breadcrumb.js
Normal file
@ -0,0 +1,22 @@
|
||||
import Link from "next/link"
|
||||
|
||||
export default function Breadcrumb({ breadcrumbTitle }) {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* Page Title */}
|
||||
<section className="page-title" style={{ backgroundImage: 'url(assets/images/background/6.jpg)' }} >
|
||||
<div className="pattern-layer" style={{ backgroundImage: 'url(assets/images/background/pattern-7.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<h2>{breadcrumbTitle}</h2>
|
||||
<ul className="page-breadcrumb">
|
||||
<li><Link href="/">home</Link></li>
|
||||
<li>{breadcrumbTitle}</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Page Title */}
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
80
components/layout/Layout.js
Normal file
80
components/layout/Layout.js
Normal file
@ -0,0 +1,80 @@
|
||||
|
||||
'use client'
|
||||
import { useEffect, useState } from "react"
|
||||
import BackToTop from '../elements/BackToTop'
|
||||
import DataBg from "../elements/DataBg"
|
||||
import Breadcrumb from './Breadcrumb'
|
||||
import SearchPopup from "./SearchPopup"
|
||||
import Sidebar from "./Sidebar"
|
||||
import Header1 from "./header/Header1"
|
||||
import Header2 from './header/Header2'
|
||||
import Header3 from "./header/Header3"
|
||||
import Header4 from "./header/Header4"
|
||||
import Header5 from "./header/Header5"
|
||||
import Footer1 from './footer/Footer1'
|
||||
import Footer2 from './footer/Footer2'
|
||||
import Footer3 from "./footer/Footer3"
|
||||
import Footer4 from "./footer/Footer4"
|
||||
|
||||
|
||||
export default function Layout({ headerStyle, footerStyle, headTitle, breadcrumbTitle, children, wrapperCls }) {
|
||||
const [scroll, setScroll] = useState(0)
|
||||
// Mobile Menu
|
||||
const [isMobileMenu, setMobileMenu] = useState(false)
|
||||
const handleMobileMenu = () => {
|
||||
setMobileMenu(!isMobileMenu)
|
||||
!isMobileMenu ? document.body.classList.add("mobile-menu-visible") : document.body.classList.remove("mobile-menu-visible")
|
||||
}
|
||||
|
||||
// Popup
|
||||
const [isPopup, setPopup] = useState(false)
|
||||
const handlePopup = () => setPopup(!isPopup)
|
||||
|
||||
// Sidebar
|
||||
const [isSidebar, setSidebar] = useState(false)
|
||||
const handleSidebar = () => setSidebar(!isSidebar)
|
||||
|
||||
useEffect(() => {
|
||||
const WOW = require('wowjs')
|
||||
window.wow = new WOW.WOW({
|
||||
live: false
|
||||
})
|
||||
window.wow.init()
|
||||
|
||||
document.addEventListener("scroll", () => {
|
||||
const scrollCheck = window.scrollY > 100
|
||||
if (scrollCheck !== scroll) {
|
||||
setScroll(scrollCheck)
|
||||
}
|
||||
})
|
||||
}, [])
|
||||
return (
|
||||
<>
|
||||
<DataBg />
|
||||
<div className={`page-wrapper ${wrapperCls ? wrapperCls : ""}`} id="#top">
|
||||
{!headerStyle && <Header1 scroll={scroll} isMobileMenu={isMobileMenu} handleMobileMenu={handleMobileMenu} handlePopup={handlePopup} isSidebar={isSidebar} handleSidebar={handleSidebar} />}
|
||||
{headerStyle == 1 ? <Header1 scroll={scroll} isMobileMenu={isMobileMenu} handleMobileMenu={handleMobileMenu} handlePopup={handlePopup} isSidebar={isSidebar} handleSidebar={handleSidebar} /> : null}
|
||||
{headerStyle == 2 ? <Header2 scroll={scroll} isMobileMenu={isMobileMenu} handleMobileMenu={handleMobileMenu} handlePopup={handlePopup} isSidebar={isSidebar} handleSidebar={handleSidebar} /> : null}
|
||||
{headerStyle == 3 ? <Header3 scroll={scroll} isMobileMenu={isMobileMenu} handleMobileMenu={handleMobileMenu} handlePopup={handlePopup} isSidebar={isSidebar} handleSidebar={handleSidebar} /> : null}
|
||||
{headerStyle == 4 ? <Header4 scroll={scroll} isMobileMenu={isMobileMenu} handleMobileMenu={handleMobileMenu} handlePopup={handlePopup} isSidebar={isSidebar} handleSidebar={handleSidebar} /> : null}
|
||||
{headerStyle == 5 ? <Header5 scroll={scroll} isMobileMenu={isMobileMenu} handleMobileMenu={handleMobileMenu} handlePopup={handlePopup} isSidebar={isSidebar} handleSidebar={handleSidebar} /> : null}
|
||||
|
||||
|
||||
|
||||
<Sidebar isSidebar={isSidebar} handleSidebar={handleSidebar} />
|
||||
<SearchPopup isPopup={isPopup} handlePopup={handlePopup} />
|
||||
|
||||
{breadcrumbTitle && <Breadcrumb breadcrumbTitle={breadcrumbTitle} />}
|
||||
|
||||
{children}
|
||||
|
||||
{!footerStyle && < Footer1 />}
|
||||
{footerStyle == 1 ? < Footer1 /> : null}
|
||||
{footerStyle == 2 ? < Footer2 /> : null}
|
||||
{footerStyle == 3 ? < Footer3 /> : null}
|
||||
{footerStyle == 4 ? < Footer4 /> : null}
|
||||
</div>
|
||||
<BackToTop scroll={scroll} />
|
||||
</>
|
||||
)
|
||||
}
|
||||
61
components/layout/Menu.js
Normal file
61
components/layout/Menu.js
Normal file
@ -0,0 +1,61 @@
|
||||
import Link from "next/link"
|
||||
// import { useRouter } from "next/router"
|
||||
|
||||
export default function Menu() {
|
||||
// const router = useRouter()
|
||||
|
||||
|
||||
return (
|
||||
<>
|
||||
<ul className="navigation">
|
||||
<li className="dropdown">
|
||||
<Link href="/">Home </Link>
|
||||
<ul>
|
||||
<li><Link href="/">Home One</Link></li>
|
||||
<li><Link href="index-2">Home Two</Link></li>
|
||||
<li><Link href="index-3">Home Three</Link></li>
|
||||
<li><Link href="index-4">Home Four</Link></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li className="dropdown">
|
||||
<Link href="#">About</Link>
|
||||
<ul>
|
||||
<li><Link href="about">About</Link></li>
|
||||
<li><Link href="team">Team</Link></li>
|
||||
<li><Link href="restaurant">Restaurant</Link></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li className="dropdown">
|
||||
<Link href="#">Menu</Link>
|
||||
<ul>
|
||||
<li><Link href="menu">Menu</Link></li>
|
||||
<li><Link href="milkshake">Milk Shake</Link></li>
|
||||
<li><Link href="frappe">Frappe</Link></li>
|
||||
<li><Link href="boba-tea">Boba Tea</Link></li>
|
||||
<li><Link href="slushy">Slushy</Link></li>
|
||||
|
||||
</ul>
|
||||
</li>
|
||||
<li className="dropdown">
|
||||
<Link href="#">Gallery</Link>
|
||||
<ul>
|
||||
<li><Link href="gallery">Gallery</Link></li>
|
||||
<li><Link href="gallery-2">Gallery 02</Link></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li className="dropdown">
|
||||
<Link href="#">Blog</Link>
|
||||
<ul>
|
||||
<li><Link href="blog-classic">Blog Classic</Link></li>
|
||||
<li><Link href="blog-details2">Blog Single 02</Link></li>
|
||||
<li><Link href="blog-details">Blog Details</Link></li>
|
||||
<li><Link href="/error">Not Found</Link></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="contact">Contact</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</>
|
||||
)
|
||||
}
|
||||
37
components/layout/Menu2.js
Normal file
37
components/layout/Menu2.js
Normal file
@ -0,0 +1,37 @@
|
||||
import Link from "next/link"
|
||||
// import { useRouter } from "next/router"
|
||||
|
||||
export default function Menu() {
|
||||
// const router = useRouter()
|
||||
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<ul className="navigation left-nav clearfix">
|
||||
<li className="dropdown">
|
||||
<Link href="/">Home </Link>
|
||||
<ul>
|
||||
<li className="/"><Link href="/">Home One</Link></li>
|
||||
<li><Link href="index-2">Home Two</Link></li>
|
||||
<li><Link href="index-3">Home Three</Link></li>
|
||||
<li><Link href="index-4">Home Four</Link></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li className="dropdown">
|
||||
<Link href="#specials">Specials</Link>
|
||||
</li>
|
||||
<li className="dropdown">
|
||||
<Link href="#location">Locations</Link>
|
||||
</li>
|
||||
<li className="dropdown">
|
||||
<Link href="#menu">Menu</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</>
|
||||
)
|
||||
}
|
||||
27
components/layout/Menu3.js
Normal file
27
components/layout/Menu3.js
Normal file
@ -0,0 +1,27 @@
|
||||
import Link from "next/link"
|
||||
// import { useRouter } from "next/router"
|
||||
|
||||
export default function Menu() {
|
||||
// const router = useRouter()
|
||||
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
|
||||
<ul className="navigation right-nav clearfix">
|
||||
<li className="dropdown">
|
||||
<Link href="#about">About</Link>
|
||||
|
||||
</li>
|
||||
<li className="dropdown">
|
||||
<Link href="#gallery">Gallery</Link>
|
||||
|
||||
</li>
|
||||
<li>
|
||||
<Link href="#contact">Contact</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</>
|
||||
)
|
||||
}
|
||||
46
components/layout/Menu4.js
Normal file
46
components/layout/Menu4.js
Normal file
@ -0,0 +1,46 @@
|
||||
import Link from "next/link"
|
||||
// import { useRouter } from "next/router"
|
||||
|
||||
export default function Menu() {
|
||||
// const router = useRouter()
|
||||
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<ul className="navigation left-nav clearfix">
|
||||
<li className="dropdown">
|
||||
<Link href="/">Home </Link>
|
||||
<ul>
|
||||
<li className=""><Link href="/">Home One</Link></li>
|
||||
<li><Link href="index-2">Home Two</Link></li>
|
||||
<li><Link href="index-3">Home Three</Link></li>
|
||||
<li><Link href="index-4">Home Four</Link></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li className="dropdown">
|
||||
<Link href="#">About</Link>
|
||||
<ul>
|
||||
<li><Link href="about">About</Link></li>
|
||||
<li><Link href="team">Team</Link></li>
|
||||
<li><Link href="restaurant">Restaurant</Link></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li className="dropdown">
|
||||
<Link href="#">Menu</Link>
|
||||
<ul>
|
||||
<li><Link href="menu">Menu</Link></li>
|
||||
<li><Link href="milkshake">Milk Shake</Link></li>
|
||||
<li><Link href="frappe">Frappe</Link></li>
|
||||
<li><Link href="boba-tea">Boba Tea</Link></li>
|
||||
<li><Link href="slushy">Slushy</Link></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</>
|
||||
)
|
||||
}
|
||||
36
components/layout/Menu5.js
Normal file
36
components/layout/Menu5.js
Normal file
@ -0,0 +1,36 @@
|
||||
import Link from "next/link"
|
||||
// import { useRouter } from "next/router"
|
||||
|
||||
export default function Menu() {
|
||||
// const router = useRouter()
|
||||
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<ul className="navigation right-nav clearfix">
|
||||
<li className="dropdown">
|
||||
<Link href="#">Gallery</Link>
|
||||
<ul>
|
||||
<li><Link href="gallery">Gallery</Link></li>
|
||||
<li><Link href="gallery-2">Gallery 02</Link></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li className="dropdown">
|
||||
<Link href="#">Blog</Link>
|
||||
<ul>
|
||||
<li><Link href="blog-classic">Blog Classic</Link></li>
|
||||
<li><Link href="blog-details2">Blog Single 02</Link></li>
|
||||
<li><Link href="blog-details">Blog Details</Link></li>
|
||||
<li><Link href="/error">Not Found</Link></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><Link href="contact">Contact</Link></li>
|
||||
</ul>
|
||||
</>
|
||||
)
|
||||
}
|
||||
93
components/layout/MobileMenu.js
Normal file
93
components/layout/MobileMenu.js
Normal file
@ -0,0 +1,93 @@
|
||||
'use client'
|
||||
import Link from "next/link";
|
||||
import { useState } from "react";
|
||||
|
||||
const MobileMenu = ({ isSidebar, handleMobileMenu, handleSidebar }) => {
|
||||
const [isActive, setIsActive] = useState({
|
||||
status: false,
|
||||
key: "",
|
||||
subMenuKey: "",
|
||||
});
|
||||
|
||||
const handleToggle = (key, subMenuKey = "") => {
|
||||
if (isActive.key === key && isActive.subMenuKey === subMenuKey) {
|
||||
setIsActive({
|
||||
status: false,
|
||||
key: "",
|
||||
subMenuKey: "",
|
||||
});
|
||||
} else {
|
||||
setIsActive({
|
||||
status: true,
|
||||
key,
|
||||
subMenuKey,
|
||||
});
|
||||
}
|
||||
};
|
||||
return (
|
||||
<>
|
||||
<div className="mobile-menu">
|
||||
<div className="menu-backdrop" onClick={handleMobileMenu}></div>
|
||||
<div className="close-btn" onClick={handleMobileMenu}><span className="icon flaticon-multiply"></span></div>
|
||||
|
||||
<nav className="menu-box">
|
||||
<div className="nav-logo"><Link href="/"><img src="assets/images/logo-2.png" alt="" title="" /></Link></div>
|
||||
<div className="menu-outer">
|
||||
<div className="collapse navbar-collapse show clearfix" id="navbarSupportedContent">
|
||||
<ul className="navigation">
|
||||
<li className={isActive.key == 1 ? "dropdown current" : "dropdown"}><Link href="/">Home</Link>
|
||||
<ul style={{ display: `${isActive.key == 1 ? "block" : "none"}` }}>
|
||||
<li><Link href="/">Home One</Link></li>
|
||||
<li><Link href="index-2">Home Two</Link></li>
|
||||
<li><Link href="index-3">Home Three</Link></li>
|
||||
<li><Link href="index-4">Home Four</Link></li>
|
||||
</ul>
|
||||
<div className={isActive.key == 1 ? "dropdown-btn open" : "dropdown-btn"} onClick={() => handleToggle(1)}><span className="fa fa-angle-right" /></div>
|
||||
</li>
|
||||
<li className={isActive.key == 2 ? "dropdown current" : "dropdown"}><Link href="/#">About</Link>
|
||||
<ul style={{ display: `${isActive.key == 2 ? "block" : "none"}` }}>
|
||||
<li><Link href="about">About</Link></li>
|
||||
<li><Link href="team">Team</Link></li>
|
||||
<li><Link href="restaurant">Restaurant</Link></li>
|
||||
</ul>
|
||||
<div className={isActive.key == 2 ? "dropdown-btn open" : "dropdown-btn"} onClick={() => handleToggle(2)}><span className="fa fa-angle-right" /></div>
|
||||
</li>
|
||||
<li className={isActive.key == 3 ? "dropdown current" : "dropdown"}><Link href="/#">Menu</Link>
|
||||
<ul style={{ display: `${isActive.key == 3 ? "block" : "none"}` }}>
|
||||
<li><Link href="menu">Menu</Link></li>
|
||||
<li><Link href="milkshake">Milk Shake</Link></li>
|
||||
<li><Link href="frappe">Frappe</Link></li>
|
||||
<li><Link href="boba-tea">Boba Tea</Link></li>
|
||||
<li><Link href="slushy">Slushy</Link></li>
|
||||
</ul>
|
||||
<div className={isActive.key == 3 ? "dropdown-btn open" : "dropdown-btn"} onClick={() => handleToggle(3)}><span className="fa fa-angle-right" /></div>
|
||||
</li>
|
||||
<li className={isActive.key == 4 ? "dropdown current" : "dropdown"}><Link href="/#">Gallery</Link>
|
||||
<ul style={{ display: `${isActive.key == 4 ? "block" : "none"}` }}>
|
||||
<li><Link href="gallery">Gallery</Link></li>
|
||||
<li><Link href="gallery-2">Gallery 02</Link></li>
|
||||
</ul>
|
||||
<div className={isActive.key == 4 ? "dropdown-btn open" : "dropdown-btn"} onClick={() => handleToggle(4)}><span className="fa fa-angle-right" /></div>
|
||||
</li>
|
||||
<li className={isActive.key == 5 ? "dropdown current" : "dropdown"}><Link href="/#">Blog</Link>
|
||||
<ul style={{ display: `${isActive.key == 5 ? "block" : "none"}` }}>
|
||||
<li><Link href="blog-classic">Blog Classic</Link></li>
|
||||
<li><Link href="blog-details2">Blog Single 02</Link></li>
|
||||
<li><Link href="blog-details">Blog Details</Link></li>
|
||||
<li><Link href="/error">Not Found</Link></li>
|
||||
</ul>
|
||||
<div className={isActive.key == 5 ? "dropdown-btn open" : "dropdown-btn"} onClick={() => handleToggle(5)}><span className="fa fa-angle-right" /></div>
|
||||
</li>
|
||||
<li><Link href="/contact">Contact</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
export default MobileMenu;
|
||||
20
components/layout/SearchPopup.js
Normal file
20
components/layout/SearchPopup.js
Normal file
@ -0,0 +1,20 @@
|
||||
|
||||
export default function SearchPopup({ isPopup, handlePopup }) {
|
||||
return (
|
||||
<>
|
||||
<div id="search-popup" className={`search-popup-wrap ${isPopup ? "search-active" : ""}`}>
|
||||
<div className="search-popup">
|
||||
<button className="close-search style-two"><span className="flaticon-multiply" onClick={handlePopup}></span></button>
|
||||
<button className="close-search" onClick={handlePopup}><span className="flaticon-up-arrow-1"></span></button>
|
||||
<form>
|
||||
<div className="form-group">
|
||||
<input type="search" name="search-field" placeholder="Search Here" />
|
||||
<button type="submit"><i className="fa fa-search"></i></button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
55
components/layout/Sidebar.js
Normal file
55
components/layout/Sidebar.js
Normal file
@ -0,0 +1,55 @@
|
||||
import Link from "next/link"
|
||||
|
||||
export default function Sidebar({ isSidebar, handleSidebar }) {
|
||||
return (
|
||||
<>
|
||||
<div className={`xs-sidebar-group info-group info-sidebar ${isSidebar ? "isActive" : ""}`}>
|
||||
<div className="xs-overlay xs-bg-black" onClick={handleSidebar}></div>
|
||||
<div className="xs-sidebar-widget">
|
||||
<div className="sidebar-widget-container">
|
||||
<div className="widget-heading">
|
||||
<Link href="#" className="close-side-widget" onClick={handleSidebar}>
|
||||
X
|
||||
</Link>
|
||||
</div>
|
||||
<div className="sidebar-textwidget">
|
||||
|
||||
|
||||
<div className="sidebar-info-contents">
|
||||
<div className="content-inner">
|
||||
<div className="logo">
|
||||
<Link href="/"><img src="assets/images/logo.png" alt="" /></Link>
|
||||
</div>
|
||||
<div className="content-box">
|
||||
<h2>About Us</h2>
|
||||
<p className="text">The argument in favor of using filler text goes something like this: If you use real content in the Consulting Process, anytime you reach a review point you’ll end up reviewing and negotiating the content itself and not the design.</p>
|
||||
<Link href="contact" className="theme-btn btn-style-one clearfix"><span className="icon"></span>Consultation</Link>
|
||||
</div>
|
||||
<div className="contact-info">
|
||||
<h2>Contact Info</h2>
|
||||
<ul className="list-style-one">
|
||||
<li><span className="icon fa fa-location-arrow"></span>Chicago 12, Melborne City, USA</li>
|
||||
<li><span className="icon fa fa-phone"></span>(111) 111-111-1111</li>
|
||||
<li><span className="icon fa fa-envelope"></span>foodily@gmail.com</li>
|
||||
<li><span className="icon fa fa-clock-o"></span>Week Days: 09.00 to 18.00 Sunday: Closed</li>
|
||||
</ul>
|
||||
</div>
|
||||
<ul className="social-box">
|
||||
<li className="facebook"><Link href="#" className="fa fa-facebook-f"></Link></li>
|
||||
<li className="twitter"><Link href="#" className="fa fa-twitter"></Link></li>
|
||||
<li className="linkedin"><Link href="#" className="fa fa-linkedin"></Link></li>
|
||||
<li className="instagram"><Link href="#" className="fa fa-instagram"></Link></li>
|
||||
<li className="youtube"><Link href="#" className="fa fa-youtube"></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
93
components/layout/footer/Footer1.js
Normal file
93
components/layout/footer/Footer1.js
Normal file
@ -0,0 +1,93 @@
|
||||
import Link from "next/link"
|
||||
export default function Footer1() {
|
||||
return (
|
||||
<>
|
||||
{/* Main Footer */}
|
||||
<footer className="main-footer">
|
||||
<div className="pattern-layer-one" style={{ backgroundImage: 'url(assets/images/resource/footer-pattern-1.png)' }} ></div>
|
||||
<div className="pattern-layer-two" style={{ backgroundImage: 'url(assets/images/resource/footer-pattern-2.png)' }} ></div>
|
||||
<div className="pattern-layer-three" style={{ backgroundImage: 'url(assets/images/background/pattern-6.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
{/* Widgets Section */}
|
||||
<div className="widgets-section">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Big Column */}
|
||||
<div className="big-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/*Footer Column*/}
|
||||
<div className="footer-column col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="footer-widget contact-widget">
|
||||
<h6>Contact Us</h6>
|
||||
<div className="text">6Fifth Avenue 5501, Broadway, New York Morris Street London 1234</div>
|
||||
<ul className="contact-list">
|
||||
<li><span className="icon fa fa-send"></span>Your mail @ gmail.com</li>
|
||||
<li><span className="icon fa fa-phone"></span><Link href="tel:+123-4567-89000">(123) 4567 89000</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/*Footer Column*/}
|
||||
<div className="footer-column col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="footer-widget links-widget">
|
||||
<h6>Useful Links</h6>
|
||||
<ul className="footer-list">
|
||||
<li><Link href="#">Home</Link></li>
|
||||
<li><Link href="#">About us</Link></li>
|
||||
<li><Link href="#">Blogs</Link></li>
|
||||
<li><Link href="#">Terms Of Service</Link></li>
|
||||
<li><Link href="#">Privacy Policy</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Big Column */}
|
||||
<div className="big-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/*Footer Column*/}
|
||||
<div className="footer-column col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="footer-widget social-widget">
|
||||
<h6>Follow Us Now</h6>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-facebook"></span>facebook</Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter"></span>twitter</Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span>instagram</Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-dribbble"></span>dribbble</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Footer Column */}
|
||||
<div className="footer-column col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="footer-widget newsletter-widget">
|
||||
<h6>Subscribe</h6>
|
||||
<div className="newsletter-form">
|
||||
<form method="post">
|
||||
<div className="form-group">
|
||||
<input type="email" name="email" placeholder="Your Email"/>
|
||||
<button type="submit" className="theme-btn submit-btn">Subscribe Now</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div className="footer-bottom">
|
||||
<div className="copyright">© 2024 foodily All Rights Reserved.</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
83
components/layout/footer/Footer2.js
Normal file
83
components/layout/footer/Footer2.js
Normal file
@ -0,0 +1,83 @@
|
||||
import Link from "next/link"
|
||||
export default function Footer2() {
|
||||
return (
|
||||
<>
|
||||
|
||||
|
||||
{/* Main Footer */}
|
||||
<footer className="footer-style-two">
|
||||
<div className="auto-container">
|
||||
{/* Widgets Section */}
|
||||
<div className="widgets-section">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Big Column */}
|
||||
<div className="big-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/*Footer Column*/}
|
||||
<div className="footer-column col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="footer-widget logo-widget">
|
||||
<div className="logo">
|
||||
<Link href="/"><img src="assets/images/logo.png" alt="" /></Link>
|
||||
</div>
|
||||
<div className="text">Proin gravida nibh vel velit <br/> Lorem Ipsum. Duis sed proin <br/> gravida nibh.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/*Footer Column*/}
|
||||
<div className="footer-column col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="footer-widget contact-widget">
|
||||
<h6>Useful Links</h6>
|
||||
<ul className="contact-list">
|
||||
<li><Link href="mailto:www.yourwebsite.com">Your mail @ gmail.com</Link></li>
|
||||
<li><Link href="mailto:www.yourwebsite.com">Your mail @ gmail.com</Link></li>
|
||||
<li><Link href="tel:+123-4567-89000">(123) 4567 89000</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Big Column */}
|
||||
<div className="big-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/*Footer Column*/}
|
||||
<div className="footer-column col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="footer-widget visit-widget">
|
||||
<h6>Visit</h6>
|
||||
<div className="text">6Fifth Avenue 5501, Broadway, <br/> New York Morris Street <br/> London 1234</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/*Footer Column*/}
|
||||
<div className="footer-column col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="footer-widget social-widget">
|
||||
<h6>Follow Us Now</h6>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-facebook"></span>facebook</Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter"></span>twitter</Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span>instagram</Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-dribbble"></span>dribbble</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="footer-bottom">
|
||||
<div className="auto-container">
|
||||
<div className="copyright">© 2024 <Link href="/">foodily</Link> All Rights Reserved.</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
52
components/layout/footer/Footer3.js
Normal file
52
components/layout/footer/Footer3.js
Normal file
@ -0,0 +1,52 @@
|
||||
import Link from "next/link"
|
||||
export default function Footer3() {
|
||||
return (
|
||||
<>
|
||||
{/* Footer Style Three */}
|
||||
<footer className="footer-style-three">
|
||||
<div className="auto-container">
|
||||
{/* Widgets Section */}
|
||||
<div className="widgets-section">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/*Footer Column*/}
|
||||
<div className="footer-column col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="footer-widget social-widget">
|
||||
<h6>Follow Us Now</h6>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-facebook"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-dribbble"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/*Footer Column*/}
|
||||
<div className="footer-column col-lg-4 col-md-12 col-sm-12">
|
||||
<div className="footer-widget logo-widget">
|
||||
<div className="logo">
|
||||
<Link href="/"><img src="assets/images/logo.png" alt="" /></Link>
|
||||
</div>
|
||||
<div className="copyright">© 2024 <Link href="/">foodily</Link> All Rights Reserved.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/*Footer Column*/}
|
||||
<div className="footer-column col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="footer-widget visit-widget">
|
||||
<h6>Visit</h6>
|
||||
<div className="text">6Fifth Avenue 5501, Broadway, <br/> New York Morris Street <br/> London 1234</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
82
components/layout/footer/Footer4.js
Normal file
82
components/layout/footer/Footer4.js
Normal file
@ -0,0 +1,82 @@
|
||||
import Link from "next/link"
|
||||
export default function Footer4() {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* Main Footer */}
|
||||
<footer className="footer-style-two">
|
||||
<div className="auto-container">
|
||||
{/* Widgets Section */}
|
||||
<div className="widgets-section">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Big Column */}
|
||||
<div className="big-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/*Footer Column*/}
|
||||
<div className="footer-column col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="footer-widget logo-widget">
|
||||
<div className="logo">
|
||||
<Link href="/"><img src="assets/images/logo.png" alt="" /></Link>
|
||||
</div>
|
||||
<div className="text">Proin gravida nibh vel velit <br/> Lorem Ipsum. Duis sed proin <br/> gravida nibh.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/*Footer Column*/}
|
||||
<div className="footer-column col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="footer-widget contact-widget">
|
||||
<h6>Contact us</h6>
|
||||
<ul className="contact-list">
|
||||
<li><Link href="mailto:www.yourwebsite.com">Your mail @ gmail.com</Link></li>
|
||||
<li><Link href="mailto:www.yourwebsite.com">Your mail @ gmail.com</Link></li>
|
||||
<li><Link href="tel:+123-4567-89000">(123) 4567 89000</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Big Column */}
|
||||
<div className="big-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/*Footer Column*/}
|
||||
<div className="footer-column col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="footer-widget visit-widget">
|
||||
<h6>Visit</h6>
|
||||
<div className="text">6Fifth Avenue 5501, Broadway, <br/> New York Morris Street <br/> London 1234</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/*Footer Column*/}
|
||||
<div className="footer-column col-lg-6 col-md-6 col-sm-12">
|
||||
<div className="footer-widget social-widget">
|
||||
<h6>Follow Us Now</h6>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-facebook"></span>facebook</Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter"></span>twitter</Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span>instagram</Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-dribbble"></span>dribbble</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="footer-bottom">
|
||||
<div className="auto-container">
|
||||
<div className="copyright">© 2024 <Link href="/">foodily</Link> All Rights Reserved.</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
77
components/layout/header/Header1.js
Normal file
77
components/layout/header/Header1.js
Normal file
@ -0,0 +1,77 @@
|
||||
import Link from "next/link"
|
||||
import Menu from "../Menu"
|
||||
import MobileMenu from "../MobileMenu"
|
||||
|
||||
export default function Header1({ scroll, handlePopup, handleMobileMenu, handleSidebar }) {
|
||||
return (
|
||||
<>
|
||||
|
||||
|
||||
|
||||
{/* Main Header*/}
|
||||
<header className={`main-header header-style-one ${scroll ? "fixed-header" : ""}`}>
|
||||
|
||||
{/* Header Upper */}
|
||||
<div className="header-upper">
|
||||
<div className="auto-container clearfix">
|
||||
|
||||
<div className="pull-left logo-box">
|
||||
<div className="logo"><Link href="/"><img src="assets/images/logo.png" alt="" title=""/></Link></div>
|
||||
</div>
|
||||
|
||||
<div className="nav-outer clearfix">
|
||||
{/*Mobile Navigation Toggler*/}
|
||||
<div className="mobile-nav-toggler"><span className="icon flaticon-menu" onClick={handleMobileMenu}></span></div>
|
||||
{/* Main Menu */}
|
||||
<nav className="main-menu navbar-expand-md">
|
||||
<Menu />
|
||||
|
||||
</nav>
|
||||
|
||||
{/* Main Menu End*/}
|
||||
<div className="outer-box clearfix">
|
||||
|
||||
{/* Search Btn */}
|
||||
<div className="search-box-btn search-box-outer"><span className="icon fa fa-search" onClick={handlePopup}></span></div>
|
||||
|
||||
{/* Nav Btn */}
|
||||
<div className="nav-btn navSidebar-button"><span className="icon flaticon-menu-2" onClick={handleSidebar}></span></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="sticky-header">
|
||||
<div className="auto-container clearfix">
|
||||
<div className="logo pull-left">
|
||||
<Link href="/" title=""><img src="assets/images/logo-small.png" alt="" title="" /></Link>
|
||||
</div>
|
||||
<div className="pull-right">
|
||||
<nav className="main-menu">
|
||||
<Menu />
|
||||
</nav>
|
||||
|
||||
|
||||
<div className="outer-box clearfix">
|
||||
|
||||
<div className="search-box-btn search-box-outer"><span className="icon fa fa-search" onClick={handlePopup}></span></div>
|
||||
<div className="nav-btn navSidebar-button"><span className="icon flaticon-menu-2" onClick={handleSidebar}></span></div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/*End Header Upper*/}
|
||||
<MobileMenu handleMobileMenu={handleMobileMenu} />
|
||||
|
||||
|
||||
|
||||
</header>
|
||||
{/* End Main Header */}
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
64
components/layout/header/Header2.js
Normal file
64
components/layout/header/Header2.js
Normal file
@ -0,0 +1,64 @@
|
||||
import Link from "next/link"
|
||||
import Menu2 from "../Menu2"
|
||||
import Menu3 from "../Menu3"
|
||||
import MobileMenu from "../MobileMenu"
|
||||
|
||||
export default function Header2({ scroll, isMobileMenu, handleMobileMenu }) {
|
||||
return (
|
||||
<>
|
||||
|
||||
|
||||
{/* Main Header / Header Style Two */}
|
||||
<header className={`main-header header-style-two ${scroll ? "fixed-header" : ""}`}>
|
||||
|
||||
{/* Header Upper */}
|
||||
<div className="header-upper">
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-facebook"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
</ul>
|
||||
<div className="auto-container">
|
||||
<div className="clearfix">
|
||||
|
||||
<div className="pull-left logo-box">
|
||||
<div className="logo"><Link href="/"><img src="assets/images/logo.png" alt="" title=""/></Link></div>
|
||||
</div>
|
||||
|
||||
<div className="nav-outer clearfix">
|
||||
{/* Mobile Navigation Toggler */}
|
||||
<div className="mobile-nav-toggler"><span className="icon flaticon-menu" onClick={handleMobileMenu}></span></div>
|
||||
{/* Main Menu */}
|
||||
<nav className="main-menu navbar-expand-md">
|
||||
<div className="navbar-header">
|
||||
<button className="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span className="icon-bar"></span>
|
||||
<span className="icon-bar"></span>
|
||||
<span className="icon-bar"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="navbar-collapse scroll-nav show collapse clearfix" id="navbarSupportedContent">
|
||||
<Menu2 />
|
||||
<Menu3 />
|
||||
|
||||
</div>
|
||||
|
||||
</nav>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* End Header Upper */}
|
||||
<MobileMenu handleMobileMenu={handleMobileMenu} />
|
||||
|
||||
|
||||
|
||||
</header>
|
||||
{/* End Main Header */}
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
94
components/layout/header/Header3.js
Normal file
94
components/layout/header/Header3.js
Normal file
@ -0,0 +1,94 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import Menu from "../Menu"
|
||||
import MobileMenu from "../MobileMenu"
|
||||
export default function Header3({ scroll, handlePopup, handleMobileMenu, handleSidebar }) {
|
||||
return (
|
||||
<>
|
||||
|
||||
|
||||
|
||||
{/* Main Header / Header Style Three */}
|
||||
<header className={`main-header header-style-three ${scroll ? "fixed-header" : ""}`}>
|
||||
|
||||
{/* Header Upper */}
|
||||
<div className="header-upper">
|
||||
<div className="auto-container clearfix">
|
||||
|
||||
<div className="pull-left logo-box">
|
||||
<div className="logo"><Link href="/"><img src="assets/images/logo-2.png" alt="" title=""/></Link></div>
|
||||
</div>
|
||||
|
||||
<div className="pull-right">
|
||||
|
||||
{/* Search Box */}
|
||||
<div className="search-box">
|
||||
<form method="post">
|
||||
<div className="form-group">
|
||||
<input type="search" name="search-field" placeholder="Search"/>
|
||||
<button type="submit"><span className="icon flaticon-search"></span></button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
{/*End Header Upper*/}
|
||||
|
||||
{/* Header Upper */}
|
||||
<div className="header-lower">
|
||||
<div className="auto-container clearfix">
|
||||
<div className="nav-outer clearfix">
|
||||
{/*Mobile Navigation Toggler*/}
|
||||
<div className="mobile-nav-toggler" onClick={handleMobileMenu}><span className="icon flaticon-menu"></span></div>
|
||||
{/* Main Menu */}
|
||||
<nav className="main-menu navbar-expand-md">
|
||||
<Menu />
|
||||
</nav>
|
||||
|
||||
{/* Main Menu End*/}
|
||||
<div className="outer-box clearfix">
|
||||
{/* Social Box */}
|
||||
<ul className="social-box">
|
||||
<li><Link href="#" className="fa fa-facebook-f"></Link></li>
|
||||
<li><Link href="#" className="fa fa-dribbble"></Link></li>
|
||||
<li><Link href="#" className="fa fa-pinterest-p"></Link></li>
|
||||
<li><Link href="#" className="fa fa-google"></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
{/* End Header Lower */}
|
||||
|
||||
<div className="sticky-header">
|
||||
<div className="auto-container clearfix">
|
||||
<div className="logo pull-left">
|
||||
<Link href="/" title=""><img src="assets/images/logo-small.png" alt="" title="" /></Link>
|
||||
</div>
|
||||
<div className="pull-right">
|
||||
<nav className="main-menu">
|
||||
<Menu />
|
||||
</nav>
|
||||
|
||||
<div className="outer-box clearfix">
|
||||
<div className="search-box-btn search-box-outer"><span className="icon fa fa-search" onClick={handlePopup}></span></div>
|
||||
<div className="nav-btn navSidebar-button"><span className="icon flaticon-menu-2" onClick={handleSidebar}></span></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<MobileMenu handleMobileMenu={handleMobileMenu} />
|
||||
|
||||
|
||||
</header>
|
||||
{/* End Main Header */}
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
58
components/layout/header/Header4.js
Normal file
58
components/layout/header/Header4.js
Normal file
@ -0,0 +1,58 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import Menu4 from "../Menu4"
|
||||
import Menu5 from "../Menu5"
|
||||
import MobileMenu from "../MobileMenu"
|
||||
export default function Header4({ scroll, handleSidebar, handleMobileMenu }) {
|
||||
return (
|
||||
<>
|
||||
|
||||
|
||||
{/* Main Header / Header Style Five */}
|
||||
<header className={`main-header header-style-five ${scroll ? "fixed-header" : ""}`}>
|
||||
|
||||
{/* Header Upper */}
|
||||
<div className="header-upper">
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-facebook"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
</ul>
|
||||
<div className="auto-container">
|
||||
<div className="clearfix">
|
||||
|
||||
<div className="pull-left logo-box">
|
||||
<div className="logo"><Link href="/"><img src="assets/images/logo-2.png" alt="" title=""/></Link></div>
|
||||
</div>
|
||||
|
||||
<div className="nav-outer clearfix">
|
||||
{/* Mobile Navigation Toggler */}
|
||||
<div className="mobile-nav-toggler" onClick={handleMobileMenu}><span className="icon flaticon-menu"></span></div>
|
||||
{/* Main Menu */}
|
||||
|
||||
<nav className="main-menu navbar-expand-md">
|
||||
<Menu4 />
|
||||
<Menu5 />
|
||||
|
||||
</nav>
|
||||
|
||||
{/* Main Menu End*/}
|
||||
<div className="outer-box clearfix">
|
||||
{/* Nav Btn */}
|
||||
<div className="nav-btn navSidebar-button" onClick={handleSidebar}><span className="icon flaticon-menu-2"></span></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* End Header Upper */}
|
||||
|
||||
<MobileMenu handleMobileMenu={handleMobileMenu} />
|
||||
|
||||
</header>
|
||||
{/* End Main Header */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
83
components/layout/header/Header5.js
Normal file
83
components/layout/header/Header5.js
Normal file
@ -0,0 +1,83 @@
|
||||
import Link from "next/link"
|
||||
import Menu from "../Menu"
|
||||
import MobileMenu from "../MobileMenu"
|
||||
export default function Header5({ scroll, handlePopup, handleMobileMenu, handleSidebar }) {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* Main Header*/}
|
||||
<header className={`main-header header-style-four ${scroll ? "fixed-header" : ""}`}>
|
||||
|
||||
{/* Header Upper */}
|
||||
<div className="header-upper">
|
||||
<div className="auto-container clearfix">
|
||||
|
||||
<div className="pull-left logo-box">
|
||||
<div className="logo"><Link href="/"><img src="assets/images/logo-2.png" alt="" title=""/></Link></div>
|
||||
</div>
|
||||
|
||||
<div className="nav-outer clearfix">
|
||||
{/*Mobile Navigation Toggler*/}
|
||||
<div className="mobile-nav-toggler" onClick={handleMobileMenu}><span className="icon flaticon-menu"></span></div>
|
||||
{/* Main Menu */}
|
||||
<nav className="main-menu navbar-expand-md">
|
||||
<div className="navbar-header">
|
||||
{/* Toggle Button */}
|
||||
<button className="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span className="icon-bar"></span>
|
||||
<span className="icon-bar"></span>
|
||||
<span className="icon-bar"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="navbar-collapse collapse clearfix" id="navbarSupportedContent">
|
||||
<ul className="navigation clearfix">
|
||||
<Menu/>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
{/* Main Menu End*/}
|
||||
<div className="outer-box clearfix">
|
||||
|
||||
<div className="search-box-btn search-box-outer"><span className="icon fa fa-search" onClick={handlePopup}></span></div>
|
||||
<div className="nav-btn navSidebar-button"><span className="icon flaticon-menu-2" onClick={handleSidebar}></span></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
{/*End Header Upper*/}
|
||||
|
||||
<div className="sticky-header">
|
||||
<div className="auto-container clearfix">
|
||||
<div className="logo pull-left">
|
||||
<Link href="/" title=""><img src="assets/images/logo-small.png" alt="" title="" /></Link>
|
||||
</div>
|
||||
<div className="pull-right">
|
||||
<nav className="main-menu">
|
||||
<Menu />
|
||||
</nav>
|
||||
|
||||
|
||||
<div className="outer-box clearfix">
|
||||
|
||||
<div className="search-box-btn search-box-outer"><span className="icon fa fa-search" onClick={handlePopup}></span></div>
|
||||
<div className="nav-btn navSidebar-button"><span className="icon flaticon-menu-2" onClick={handleSidebar}></span></div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<MobileMenu handleMobileMenu={handleMobileMenu} />
|
||||
|
||||
|
||||
</header>
|
||||
{/* End Main Header */}
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
158
components/sections/home1/Banner.js
Normal file
158
components/sections/home1/Banner.js
Normal file
@ -0,0 +1,158 @@
|
||||
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import { Autoplay, Navigation, Pagination } from "swiper/modules"
|
||||
import { Swiper, SwiperSlide } from "swiper/react"
|
||||
|
||||
const swiperOptions = {
|
||||
modules: [Autoplay, Pagination, Navigation],
|
||||
slidesPerView: 1,
|
||||
spaceBetween: 0,
|
||||
// autoplay: {
|
||||
// delay: 2500,
|
||||
// disableOnInteraction: false,
|
||||
// },
|
||||
loop: true,
|
||||
|
||||
// Navigation
|
||||
navigation: {
|
||||
nextEl: '.h1n',
|
||||
prevEl: '.h1p',
|
||||
},
|
||||
|
||||
// Pagination
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
clickable: true,
|
||||
},
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
export default function Banner() {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* Banner Section */}
|
||||
<section className="banner-section">
|
||||
<div className="pattern-layer" style={{ backgroundImage: 'url(assets/images/main-slider/pattern-1.png)' }} ></div>
|
||||
<Swiper {...swiperOptions} className="main-slider-carousel ">
|
||||
|
||||
{/* Slide */}
|
||||
<SwiperSlide>
|
||||
<div className="slide">
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/main-slider/icon-1.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/main-slider/icon-2.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Content Column */}
|
||||
<div className="content-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<h1><span className="first-letter">Heathly</span><span className="second-letter">Smoothie</span></h1>
|
||||
<div className="text">Consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.</div>
|
||||
<div className="btns-box">
|
||||
<Link href="menu" className="theme-btn btn-style-one clearfix"><span className="icon"></span>Buy Now</Link>
|
||||
</div>
|
||||
<div className="icons-box">
|
||||
<img src="assets/images/main-slider/icons.png" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Image Column */}
|
||||
<div className="image-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<div className="icon-layer-three" style={{ backgroundImage: 'url(assets/images/main-slider/icon-3.png)' }} ></div>
|
||||
<div className="image">
|
||||
<img src="assets/images/main-slider/content-image-1.png" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
|
||||
{/* Slide */}
|
||||
<SwiperSlide>
|
||||
<div className="slide">
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/main-slider/icon-1.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/main-slider/icon-6.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Content Column */}
|
||||
<div className="content-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<h1><span className="first-letter">Heathly</span><span className="second-letter">Smoothie</span></h1>
|
||||
<div className="text">Consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.</div>
|
||||
<div className="btns-box">
|
||||
<Link href="menu" className="theme-btn btn-style-one clearfix"><span className="icon"></span>Buy Now</Link>
|
||||
</div>
|
||||
<div className="icons-box">
|
||||
<img src="assets/images/main-slider/icons.png" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Image Column */}
|
||||
<div className="image-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<div className="icon-layer-three" style={{ backgroundImage: 'url(assets/images/main-slider/icon-3.png)' }} ></div>
|
||||
<div className="image">
|
||||
<img src="assets/images/main-slider/content-image-2.png" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Slide */}
|
||||
<SwiperSlide>
|
||||
<div className="slide style-two">
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/main-slider/icon-1.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/main-slider/icon-7.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Content Column */}
|
||||
<div className="content-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<h1><span className="first-letter">Heathly</span><span className="second-letter">Smoothie</span></h1>
|
||||
<div className="text">Consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.</div>
|
||||
<div className="btns-box">
|
||||
<Link href="menu" className="theme-btn btn-style-one clearfix"><span className="icon"></span>Buy Now</Link>
|
||||
</div>
|
||||
<div className="icons-box">
|
||||
<img src="assets/images/main-slider/icons.png" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Image Column */}
|
||||
<div className="image-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<div className="icon-layer-three" style={{ backgroundImage: 'url(assets/images/main-slider/icon-3.png)' }} ></div>
|
||||
<div className="image">
|
||||
<img src="assets/images/main-slider/content-image-3.png" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
</Swiper>
|
||||
|
||||
</section>
|
||||
{/* End Banner Section */}
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
136
components/sections/home1/Beverage.js
Normal file
136
components/sections/home1/Beverage.js
Normal file
@ -0,0 +1,136 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Beverage() {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* Beverage Section */}
|
||||
<section className="beverage-section">
|
||||
<div className="icon-layer" style={{ backgroundImage: 'url(assets/images/resource/beverage.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<div className="title">Best for You</div>
|
||||
<h2>Our Beverage</h2>
|
||||
<div className="separate"></div>
|
||||
</div>
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Beverage Column */}
|
||||
<div className="beverage-block col-xl-3 col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="milkshake"><img src="assets/images/resource/beverage-1.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="milkshake">Milkshake</Link></h6>
|
||||
<div className="products">3 products</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Beverage Column */}
|
||||
<div className="beverage-block col-xl-3 col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="milkshake"><img src="assets/images/resource/beverage-2.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="milkshake">Frappe</Link></h6>
|
||||
<div className="products">3 products</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Beverage Column */}
|
||||
<div className="beverage-block col-xl-3 col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="milkshake"><img src="assets/images/resource/beverage-3.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="milkshake">Boba Drinks</Link></h6>
|
||||
<div className="products">3 products</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Beverage Column */}
|
||||
<div className="beverage-block col-xl-3 col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="milkshake"><img src="assets/images/resource/beverage-4.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="milkshake">Mojito</Link></h6>
|
||||
<div className="products">3 products</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Beverage Column */}
|
||||
<div className="beverage-block col-xl-3 col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="milkshake"><img src="assets/images/resource/beverage-5.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="milkshake">Slushy</Link></h6>
|
||||
<div className="products">3 products</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Beverage Column */}
|
||||
<div className="beverage-block col-xl-3 col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="milkshake"><img src="assets/images/resource/beverage-6.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="milkshake">Hot Chocolate</Link></h6>
|
||||
<div className="products">3 products</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Beverage Column */}
|
||||
<div className="beverage-block col-xl-3 col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="milkshake"><img src="assets/images/resource/beverage-7.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="milkshake">smoothie</Link></h6>
|
||||
<div className="products">3 products</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Beverage Column */}
|
||||
<div className="beverage-block col-xl-3 col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="milkshake"><img src="assets/images/resource/beverage-8.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="milkshake">coffee</Link></h6>
|
||||
<div className="products">3 products</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
{/* Button Box */}
|
||||
<div className="button-box text-center">
|
||||
<Link href="menu" className="theme-btn btn-style-two clearfix"><span className="icon"></span>View All Products</Link>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
{/* End Beverage Section */}
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
104
components/sections/home1/Blog.js
Normal file
104
components/sections/home1/Blog.js
Normal file
@ -0,0 +1,104 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Blog() {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* News Section */}
|
||||
<section className="news-section">
|
||||
<div className="pattern-layer" style={{ backgroundImage: 'url(assets/images/background/pattern-5.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<div className="title">News & Recipe</div>
|
||||
<h2>Our Fruitsome Blog</h2>
|
||||
<div className="separate"></div>
|
||||
<div className="text">Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, <br/> vel scelerisque nisl consectetur et.</div>
|
||||
</div>
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* News Block */}
|
||||
<div className="news-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-1.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/news-1.jpg" data-fancybox="news" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* News Block */}
|
||||
<div className="news-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInUp" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-2.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/news-2.jpg" data-fancybox="news" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* News Block */}
|
||||
<div className="news-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInRight" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-3.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/news-3.jpg" data-fancybox="news" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End News Section */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
35
components/sections/home1/Deal.js
Normal file
35
components/sections/home1/Deal.js
Normal file
@ -0,0 +1,35 @@
|
||||
|
||||
export default function Deal() {
|
||||
return (
|
||||
<>
|
||||
{/* Deal Section */}
|
||||
<section className="deal-section" style={{ backgroundImage: 'url(assets/images/background/2.jpg)' }} >
|
||||
<div className="top-pattern-layer" style={{ backgroundImage: 'url(assets/images/background/pattern-1.png)' }} ></div>
|
||||
<div className="bottom-pattern-layer" style={{ backgroundImage: 'url(assets/images/background/pattern-2.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="content-box" style={{ backgroundImage: 'url(assets/images/resource/deal.png)' }} >
|
||||
<div className="box-inner">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title light centered">
|
||||
<div className="title">30% Off For juice</div>
|
||||
<h2>Big Deals of the Week</h2>
|
||||
<div className="text">Us percipit urbanitas referrentur ea. Mei at numquam molestiae <br/> intellegam. Ansed dictas accumsan. </div>
|
||||
</div>
|
||||
{/* Email Form */}
|
||||
<div className="email-form">
|
||||
<div className="email-title">To Get New Of Our Deals</div>
|
||||
<form method="post">
|
||||
<div className="form-group">
|
||||
<input type="email" name="email" placeholder="type your email" />
|
||||
<button type="submit" className="submit-btn"><span className="icon flaticon-send"></span></button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Deal Section */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
35
components/sections/home1/Fluid.js
Normal file
35
components/sections/home1/Fluid.js
Normal file
@ -0,0 +1,35 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Fluid() {
|
||||
return (
|
||||
<>
|
||||
|
||||
<section className="fluid-section-one">
|
||||
<div className="outer-container clearfix">
|
||||
|
||||
<div className="content-column">
|
||||
<div className="icon-box" style={{ backgroundImage: 'url(assets/images/icons/icon-4.png)' }} ></div>
|
||||
<div className="inner-column">
|
||||
|
||||
<div className="sec-title">
|
||||
<h2>Upcoming Our <br/> Beverage</h2>
|
||||
<div className="separate"></div>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
|
||||
</div>
|
||||
|
||||
<div className="button-box">
|
||||
<Link href="menu" className="theme-btn btn-style-two clearfix"><span className="icon"></span>All Product</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div className="image-column" style={{ backgroundImage: 'url(assets/images/resource/image-1.jpg)' }} >
|
||||
<figure className="image-box"><img src="assets/images/resource/image-1.jpg" alt=""/></figure>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
</>
|
||||
)
|
||||
}
|
||||
255
components/sections/home1/Gallery.js
Normal file
255
components/sections/home1/Gallery.js
Normal file
@ -0,0 +1,255 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import { Autoplay, Navigation, Pagination } from "swiper/modules"
|
||||
import { Swiper, SwiperSlide } from "swiper/react"
|
||||
|
||||
|
||||
const swiperOptions = {
|
||||
modules: [Autoplay, Pagination, Navigation],
|
||||
slidesPerView: 5,
|
||||
spaceBetween: 0,
|
||||
// autoplay: {
|
||||
// delay: 2500,
|
||||
// disableOnInteraction: false,
|
||||
// },
|
||||
loop: true,
|
||||
|
||||
// Navigation
|
||||
navigation: {
|
||||
nextEl: '.h1n',
|
||||
prevEl: '.h1p',
|
||||
},
|
||||
|
||||
// Pagination
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
clickable: true,
|
||||
},
|
||||
|
||||
breakpoints: {
|
||||
320: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
575: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
767: {
|
||||
slidesPerView: 2,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
991: {
|
||||
slidesPerView: 3,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
1199: {
|
||||
slidesPerView: 3,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
1350: {
|
||||
slidesPerView: 5,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
export default function Gallery() {
|
||||
|
||||
return (
|
||||
<>
|
||||
{/* Gallery Section */}
|
||||
<section className="gallery-section">
|
||||
<div className="outer-container">
|
||||
<Swiper {...swiperOptions} className="gallery-carousel ">
|
||||
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/1.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/1.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/2.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/2.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/3.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/3.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/4.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/4.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/5.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/5.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/1.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/1.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/2.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/2.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/3.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/3.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/4.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/4.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/5.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/5.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
</Swiper>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
46
components/sections/home1/Juice.js
Normal file
46
components/sections/home1/Juice.js
Normal file
@ -0,0 +1,46 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Juice() {
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
|
||||
{/* Juice Section */}
|
||||
<section className="juice-section">
|
||||
<div className="section-text">yummy</div>
|
||||
<div className="pattern-layer" style={{ backgroundImage: 'url(assets/images/background/1.png)' }} ></div>
|
||||
<div className="pattern-layer-two" style={{ backgroundImage: 'url(assets/images/resource/juice-glass.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Image Column */}
|
||||
<div className="image-column col-lg-7 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/juice.png" alt=""/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Content Column */}
|
||||
<div className="content-column col-lg-5 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title">
|
||||
<div className="title">Drink for Health</div>
|
||||
<h2>Fresh Fruit <span className="theme_color">Juices</span></h2>
|
||||
<div className="separate"></div>
|
||||
<div className="text">Us percipit urbanitas referrentur ea. Mei at numquam molestiae intellegam. Ansed dictas accumsan. Nam sint atqui voluptatibus an, pro ne malis semper perpetua. Nam sint atqui voluptatibus an, pro ne malis semper perpetua.</div>
|
||||
</div>
|
||||
<Link href="menu" className="theme-btn btn-style-two clearfix"><span className="icon"></span>Buy Now</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Juice Section */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
91
components/sections/home1/Recipe.js
Normal file
91
components/sections/home1/Recipe.js
Normal file
@ -0,0 +1,91 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Recipe() {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* Recipe Section */}
|
||||
<section className="recipe-section">
|
||||
<div className="section-text">yummy</div>
|
||||
<div className="icon-layer-one" style={{ backgroundImage:'url(assets/images/icons/icon-1.png)'}} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage:'url(assets/images/icons/icon-2.png)'}} ></div>
|
||||
<div className="icon-layer-three" style={{ backgroundImage:'url(assets/images/icons/icon-3.png)'}} ></div>
|
||||
<div className="auto-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<div className="title">Best for You</div>
|
||||
<h2>Detox Smoothie Recipe</h2>
|
||||
<div className="separate"></div>
|
||||
</div>
|
||||
<div className="inner-container">
|
||||
<div className="circle-layer" style={{ backgroundImage:'url(assets/images/icons/circles.png)'}} ></div>
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Left Column */}
|
||||
<div className="left-column col-lg-5 col-md-6 col-sm-12">
|
||||
<div className="inner-column">
|
||||
|
||||
{/* Recipe Block */}
|
||||
<div className="recipe-block">
|
||||
<div className="inner-box">
|
||||
<div className="icon"><img src="assets/images/resource/recipe-1.png" alt=""/></div>
|
||||
<h6><Link href="menu">Cucumber</Link></h6>
|
||||
<div className="text">Us percipit urbanitas referrentur ea. Mei at numquam molestiae</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Recipe Block */}
|
||||
<div className="recipe-block">
|
||||
<div className="inner-box">
|
||||
<div className="icon"><img src="assets/images/resource/recipe-2.png" alt=""/></div>
|
||||
<h6><Link href="menu">Apple</Link></h6>
|
||||
<div className="text">Us percipit urbanitas referrentur ea. Mei at numquam molestiae</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Image Column */}
|
||||
<div className="image-column col-lg-2 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/recipe.png" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Right Column */}
|
||||
<div className="right-column col-lg-5 col-md-6 col-sm-12">
|
||||
<div className="inner-column">
|
||||
|
||||
{/* Recipe Block / Style Two */}
|
||||
<div className="recipe-block style-two">
|
||||
<div className="inner-box">
|
||||
<div className="icon"><img src="assets/images/resource/recipe-3.png" alt=""/></div>
|
||||
<h6><Link href="menu">Lemon</Link></h6>
|
||||
<div className="text">Us percipit urbanitas referrentur ea. Mei at numquam molestiae</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Recipe Block / Style Two */}
|
||||
<div className="recipe-block style-two">
|
||||
<div className="inner-box">
|
||||
<div className="icon"><img src="assets/images/resource/recipe-4.png" alt=""/></div>
|
||||
<h6><Link href="menu">Fresh Water</Link></h6>
|
||||
<div className="text">Us percipit urbanitas referrentur ea. Mei at numquam molestiae</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Recipe Section */}
|
||||
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
126
components/sections/home1/Testimonial.js
Normal file
126
components/sections/home1/Testimonial.js
Normal file
@ -0,0 +1,126 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import { Autoplay, Navigation, Pagination } from "swiper/modules"
|
||||
import { Swiper, SwiperSlide } from "swiper/react"
|
||||
|
||||
|
||||
const swiperOptions = {
|
||||
modules: [Autoplay, Pagination, Navigation],
|
||||
slidesPerView: 1,
|
||||
spaceBetween: 30,
|
||||
// autoplay: {
|
||||
// delay: 2500,
|
||||
// disableOnInteraction: false,
|
||||
// },
|
||||
loop: true,
|
||||
|
||||
// Navigation
|
||||
navigation: {
|
||||
nextEl: '.srn',
|
||||
prevEl: '.srp',
|
||||
},
|
||||
|
||||
// Pagination
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
clickable: true,
|
||||
},
|
||||
|
||||
breakpoints: {
|
||||
320: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
575: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
767: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
991: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
1199: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
1350: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
export default function Testimonial() {
|
||||
return (
|
||||
<>
|
||||
|
||||
|
||||
{/* Testimonial Section */}
|
||||
<section className="testimonial-section">
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/icons/icon-1.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/icons/icon-2.png)' }} ></div>
|
||||
<div className="icon-layer-three" style={{ backgroundImage: 'url(assets/images/icons/icon-3.png)' }} ></div>
|
||||
<div className="pattern-layer" style={{ backgroundImage: 'url(assets/images/background/pattern-4.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<div className="title">Testimonial</div>
|
||||
<h2>What People Say</h2>
|
||||
<div className="separate"></div>
|
||||
</div>
|
||||
<div className="inner-container">
|
||||
<Swiper {...swiperOptions} className="single-item-carousel ">
|
||||
|
||||
{/* Testimonial Block */}
|
||||
<SwiperSlide>
|
||||
<div className="testimonial-block">
|
||||
<div className="inner-box">
|
||||
<div className="author-image">
|
||||
<img src="assets/images/resource/author-1.jpg" alt="" />
|
||||
</div>
|
||||
<div className="text">“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et <br/> dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation <br/> ullamco.”</div>
|
||||
<div className="designation">Meredith Grant <span>- Host Mother</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Testimonial Block */}
|
||||
<SwiperSlide>
|
||||
<div className="testimonial-block">
|
||||
<div className="inner-box">
|
||||
<div className="author-image">
|
||||
<img src="assets/images/resource/author-1.jpg" alt="" />
|
||||
</div>
|
||||
<div className="text">“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et <br/> dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation <br/> ullamco.”</div>
|
||||
<div className="designation">Meredith Grant <span>- Host Mother</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Testimonial Block */}
|
||||
<SwiperSlide>
|
||||
<div className="testimonial-block">
|
||||
<div className="inner-box">
|
||||
<div className="author-image">
|
||||
<img src="assets/images/resource/author-1.jpg" alt="" />
|
||||
</div>
|
||||
<div className="text">“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et <br/> dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation <br/> ullamco.”</div>
|
||||
<div className="designation">Meredith Grant <span>- Host Mother</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
</Swiper>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Testimonial Section */}
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
151
components/sections/home2/Banner.js
Normal file
151
components/sections/home2/Banner.js
Normal file
@ -0,0 +1,151 @@
|
||||
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import { Autoplay, Navigation, Pagination } from "swiper/modules"
|
||||
import { Swiper, SwiperSlide } from "swiper/react"
|
||||
|
||||
const swiperOptions = {
|
||||
modules: [Autoplay, Pagination, Navigation],
|
||||
slidesPerView: 1,
|
||||
spaceBetween: 0,
|
||||
// autoplay: {
|
||||
// delay: 2500,
|
||||
// disableOnInteraction: false,
|
||||
// },
|
||||
loop: true,
|
||||
|
||||
// Navigation
|
||||
navigation: {
|
||||
nextEl: '.h1n',
|
||||
prevEl: '.h1p',
|
||||
},
|
||||
|
||||
// Pagination
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
clickable: true,
|
||||
},
|
||||
|
||||
|
||||
|
||||
}
|
||||
export default function Banner() {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* Banner Section Two */}
|
||||
<section className="banner-section-two" id="home">
|
||||
<div className="pattern-layer" style={{ backgroundImage: 'url(assets/images/main-slider/pattern-2.png)' }} ></div>
|
||||
<Swiper {...swiperOptions} className="main-slider-carousel ">
|
||||
|
||||
{/* Slide */}
|
||||
<SwiperSlide>
|
||||
<div className="slide">
|
||||
<div className="slide-middle-text">Foodily</div>
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/main-slider/icon-4.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/main-slider/icon-5.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Content Column */}
|
||||
<div className="content-column col-lg-7 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<div className="title">Best for You</div>
|
||||
<h1>Delicious Food <br/> on the street.</h1>
|
||||
<div className="text">We have the best sed non mauris vitae erat <br/> consequat auctor eu in elit.</div>
|
||||
<div className="btns-box">
|
||||
<Link href="menu" className="theme-btn btn-style-three clearfix"><span className="icon"></span>Buy Now</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Image Column */}
|
||||
<div className="image-column col-lg-5 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<div className="image">
|
||||
<img src="assets/images/main-slider/image-2.png" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div className="shadow-layer" style={{ backgroundImage: 'url(assets/images/main-slider/shadow.png)' }} ></div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Slide */}
|
||||
<SwiperSlide>
|
||||
<div className="slide">
|
||||
<div className="slide-middle-text">Foodily</div>
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/main-slider/icon-4.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/main-slider/icon-5.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Content Column */}
|
||||
<div className="content-column col-lg-7 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<div className="title">Best for You</div>
|
||||
<h1>Delicious Food <br/> on the street.</h1>
|
||||
<div className="text">We have the best sed non mauris vitae erat <br/> consequat auctor eu in elit.</div>
|
||||
<div className="btns-box">
|
||||
<Link href="menu" className="theme-btn btn-style-three clearfix"><span className="icon"></span>Buy Now</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Image Column */}
|
||||
<div className="image-column col-lg-5 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<div className="image">
|
||||
<img src="assets/images/main-slider/image-2.png" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Slide */}
|
||||
<SwiperSlide>
|
||||
<div className="slide">
|
||||
<div className="slide-middle-text">Foodily</div>
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/main-slider/icon-4.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/main-slider/icon-5.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Content Column */}
|
||||
<div className="content-column col-lg-7 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<div className="title">Best for You</div>
|
||||
<h1>Delicious Food <br/> on the street.</h1>
|
||||
<div className="text">We have the best sed non mauris vitae erat <br/> consequat auctor eu in elit.</div>
|
||||
<div className="btns-box">
|
||||
<Link href="menu" className="theme-btn btn-style-three clearfix"><span className="icon"></span>Buy Now</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Image Column */}
|
||||
<div className="image-column col-lg-5 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<div className="image">
|
||||
<img src="assets/images/main-slider/image-2.png" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
</Swiper>
|
||||
|
||||
</section>
|
||||
{/* End Banner Section */}
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
76
components/sections/home2/Contact.js
Normal file
76
components/sections/home2/Contact.js
Normal file
@ -0,0 +1,76 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Features() {
|
||||
return (
|
||||
<>
|
||||
{/* Contact Section */}
|
||||
<section className="contact-section" id="contact">
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Title Column */}
|
||||
<div className="title-column col-lg-5 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title">
|
||||
<div className="title">Hire for outdoor party.</div>
|
||||
<h2>Contact</h2>
|
||||
<div className="separate"></div>
|
||||
<div className="text">Us percipit urbanitas referrentur ea. Mei at numquam molestiae intellegam. Ansed dictas accumsan.</div>
|
||||
</div>
|
||||
<ul className="info-list">
|
||||
<li>
|
||||
<span className="icon flaticon-telephone"></span>
|
||||
<strong>Phone</strong>
|
||||
<Link href="tel:+123-45678-900">+ 123 45678 900</Link>
|
||||
</li>
|
||||
<li>
|
||||
<span className="icon flaticon-message"></span>
|
||||
<strong>Email</strong>
|
||||
<Link href="mailto:info@gmail.com">info@gmail.com</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Form Column */}
|
||||
<div className="form-column col-lg-7 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
|
||||
{/* Contact Form */}
|
||||
<div className="contact-form">
|
||||
<form method="post" id="contact-form">
|
||||
<div className="row clearfix">
|
||||
|
||||
<div className="col-lg-12 col-md-12 col-sm-12 form-group">
|
||||
<textarea className="" name="message" placeholder="Your Comment *"></textarea>
|
||||
</div>
|
||||
|
||||
<div className="col-lg-6 col-md-6 col-sm-12 form-group">
|
||||
<input type="text" name="username" placeholder="Your Name"/>
|
||||
</div>
|
||||
|
||||
<div className="col-lg-6 col-md-6 col-sm-12 form-group">
|
||||
<input type="email" name="email" placeholder="Your Email"/>
|
||||
</div>
|
||||
|
||||
<div className="col-lg-12 col-md-12 col-sm-12 form-group">
|
||||
<button className="theme-btn btn-style-four clearfix"><span className="icon flaticon-arrow-pointing-to-right"></span>Send</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
{/* End Contact Form */}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Contact Section */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
119
components/sections/home2/Gallery.js
Normal file
119
components/sections/home2/Gallery.js
Normal file
@ -0,0 +1,119 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Gallery() {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* Gallery Section Two */}
|
||||
<section className="gallery-section-two" id="gallery">
|
||||
<div className="outer-container">
|
||||
<div className="masonry-items-container row no-gutters clearfix">
|
||||
|
||||
<div className="col-lg-3 col-md-6 col-sm-12">
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/7.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div className="col-lg-3 col-md-6 col-sm-12">
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/8.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/11.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div className="col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="row no-gutters">
|
||||
<div className="col-lg-6 col-md-6 col-sm-12">
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/9.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<div className="col-lg-6 col-md-6 col-sm-12">
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item ">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/10.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div className="col-lg-12 col-md-12 col-sm-12">
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/12.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section Two */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
47
components/sections/home2/History.js
Normal file
47
components/sections/home2/History.js
Normal file
@ -0,0 +1,47 @@
|
||||
|
||||
export default function History() {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* History Section */}
|
||||
<section className="history-section" id="about">
|
||||
<div className="pattern-layer" style={{ backgroundImage: 'url(assets/images/resource/history-icon.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Image Column */}
|
||||
<div className="image-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/history-1.jpg" alt="" />
|
||||
</div>
|
||||
<div className="image-two">
|
||||
<img src="assets/images/resource/history-2.jpg" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Content Column */}
|
||||
<div className="content-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title">
|
||||
<div className="title">Our Vision and History</div>
|
||||
<h2>On the street since <br/> 1990 <span className="theme_color">Owner Jay Martin</span></h2>
|
||||
<div className="text">Us percipit urbanitas referrentur ea. Mei at numquam molestiae intellegam. Ansed dictas accumsan. Nam sint atqui voluptatibus an, pro ne malis semper perpetua. Nam sint atqui voluptatibus an, pro ne malis semper perpetua.</div>
|
||||
</div>
|
||||
<ul className="list-style-two">
|
||||
<li>Cras at mi luctus, tincidunt urna eu, posuere enim</li>
|
||||
<li>Vivamus elementum lorem vitae quam tincidunt</li>
|
||||
<li>Suspendisse accumsan eros eu erat condimentum</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End History Section */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
118
components/sections/home2/Location.js
Normal file
118
components/sections/home2/Location.js
Normal file
@ -0,0 +1,118 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Location() {
|
||||
return (
|
||||
<>
|
||||
|
||||
|
||||
{/* Location Section */}
|
||||
<section className="location-section" id="location">
|
||||
{/* Title Box */}
|
||||
<div className="title-box" style={{ backgroundImage: 'url(assets/images/background/3.jpg)' }} >
|
||||
<div className="auto-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title light centered">
|
||||
<div className="title">Find Us</div>
|
||||
<h2>Location and Time</h2>
|
||||
<div className="separate"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* End Title Box */}
|
||||
|
||||
<div className="auto-container">
|
||||
<div className="inner-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Location Block */}
|
||||
<div className="location-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="content">
|
||||
<div className="post-date">20 - 27 October</div>
|
||||
<h3><Link href="slushy">Brooklyn</Link></h3>
|
||||
<ul className="post-info">
|
||||
<li><span className="icon fa fa-map-marker"></span>20 Cooper Square, NY 10003</li>
|
||||
<li><span className="icon fa fa-clock-o"></span>09:00 - 18:00.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Location Block */}
|
||||
<div className="location-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="content">
|
||||
<div className="post-date">20 - 27 October</div>
|
||||
<h3><Link href="slushy">The Bronx</Link></h3>
|
||||
<ul className="post-info">
|
||||
<li><span className="icon fa fa-map-marker"></span>20 Cooper Square, NY 10003</li>
|
||||
<li><span className="icon fa fa-clock-o"></span>09:00 - 18:00.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Location Block */}
|
||||
<div className="location-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="content">
|
||||
<div className="post-date">20 - 27 October</div>
|
||||
<h3><Link href="slushy">Manhattan</Link></h3>
|
||||
<ul className="post-info">
|
||||
<li><span className="icon fa fa-map-marker"></span>20 Cooper Square, NY 10003</li>
|
||||
<li><span className="icon fa fa-clock-o"></span>09:00 - 18:00.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Location Block */}
|
||||
<div className="location-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="content">
|
||||
<div className="post-date">20 - 27 October</div>
|
||||
<h3><Link href="slushy">Staten Island</Link></h3>
|
||||
<ul className="post-info">
|
||||
<li><span className="icon fa fa-map-marker"></span>20 Cooper Square, NY 10003</li>
|
||||
<li><span className="icon fa fa-clock-o"></span>09:00 - 18:00.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Location Block */}
|
||||
<div className="location-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="content">
|
||||
<div className="post-date">20 - 27 October</div>
|
||||
<h3><Link href="slushy">Brooklyn</Link></h3>
|
||||
<ul className="post-info">
|
||||
<li><span className="icon fa fa-map-marker"></span>20 Cooper Square, NY 10003</li>
|
||||
<li><span className="icon fa fa-clock-o"></span>09:00 - 18:00.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Location Block */}
|
||||
<div className="location-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="content">
|
||||
<div className="post-date">20 - 27 October</div>
|
||||
<h3><Link href="slushy">Queens</Link></h3>
|
||||
<ul className="post-info">
|
||||
<li><span className="icon fa fa-map-marker"></span>20 Cooper Square, NY 10003</li>
|
||||
<li><span className="icon fa fa-clock-o"></span>09:00 - 18:00.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Location Section */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
101
components/sections/home2/Menus.js
Normal file
101
components/sections/home2/Menus.js
Normal file
@ -0,0 +1,101 @@
|
||||
'use client';
|
||||
import { useState } from 'react';
|
||||
import Link from 'next/link';
|
||||
import { menuData } from '@/utils/constant.utils';
|
||||
|
||||
export default function Menus() {
|
||||
const [activeTab, setActiveTab] = useState('Snacks');
|
||||
const tabs = Object.keys(menuData);
|
||||
const menuItems = menuData[activeTab] || [];
|
||||
|
||||
// Split the array into 2 halves
|
||||
const mid = Math.ceil(menuItems.length / 2);
|
||||
const firstHalf = menuItems.slice(0, mid);
|
||||
const secondHalf = menuItems.slice(mid);
|
||||
|
||||
return (
|
||||
<section className="menus-section" id="menu">
|
||||
{/* <div
|
||||
className="pattern-layer"
|
||||
style={{ backgroundImage: 'url(assets/images/background/4.jpg)' }}
|
||||
></div> */}
|
||||
<div className="auto-container">
|
||||
{/* Section Title */}
|
||||
<div className="sec-title centered">
|
||||
<div className="title">Softly & Crunchy</div>
|
||||
<h2>Menus</h2>
|
||||
<div className="separate"></div>
|
||||
</div>
|
||||
|
||||
{/* Tabs */}
|
||||
<ul className="nav nav-tabs justify-content-center mb-5 border-0">
|
||||
{tabs.map((tab) => (
|
||||
<li
|
||||
key={tab}
|
||||
className="nav-item"
|
||||
onClick={() => setActiveTab(tab)}
|
||||
style={{ cursor: 'pointer' }}
|
||||
>
|
||||
<span
|
||||
className={`nav-link ${activeTab === tab ? 'active fw-bold text-primary' : ''}`}
|
||||
>
|
||||
{tab}
|
||||
</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
|
||||
{/* Menu Items in Two Columns */}
|
||||
<div className="row clearfix">
|
||||
{/* Left Column */}
|
||||
<div className="menu-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
{firstHalf.map((item, index) => (
|
||||
<div className="menu-block" key={index}>
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="/menu">
|
||||
<img src={item.img} alt={item.name} />
|
||||
</Link>
|
||||
</div>
|
||||
<h6>
|
||||
<Link href="/menu">{item.name}</Link>
|
||||
</h6>
|
||||
<div className="title">{item.desc}</div>
|
||||
<div className="price-box">
|
||||
<span className="price">${item.price}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Right Column */}
|
||||
<div className="menu-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
{secondHalf.map((item, index) => (
|
||||
<div className="menu-block" key={index}>
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="/menu">
|
||||
<img src={item.img} alt={item.name} />
|
||||
</Link>
|
||||
</div>
|
||||
<h6>
|
||||
<Link href="/menu">{item.name}</Link>
|
||||
</h6>
|
||||
<div className="title">{item.desc}</div>
|
||||
<div className="price-box">
|
||||
<span className="price">${item.price}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
143
components/sections/home2/Specials.js
Normal file
143
components/sections/home2/Specials.js
Normal file
@ -0,0 +1,143 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Specials() {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* Specials Section */}
|
||||
<section className="specials-section" id="specials">
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/resource/special-icon-1.png)' }} ></div>
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/resource/special-icon-2.png)' }} ></div>
|
||||
<div className="icon-layer-three" style={{ backgroundImage: 'url(assets/images/resource/special-icon-3.png)' }} ></div>
|
||||
<div className="icon-layer-four" style={{ backgroundImage: 'url(assets/images/resource/special-icon-4.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<div className="title">Our most valuable asset</div>
|
||||
<h2>Today’s Specials</h2>
|
||||
<div className="separate"></div>
|
||||
</div>
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Special Block */}
|
||||
<div className="special-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="image">
|
||||
<Link href="milkshake"><img src="assets/images/resource/special-1.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="clearfix">
|
||||
<div className="pull-left">
|
||||
<h4><Link href="milkshake">Fried Potatoes</Link></h4>
|
||||
</div>
|
||||
<div className="pull-right">
|
||||
<div className="price">$15</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Special Block */}
|
||||
<div className="special-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInUp" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="image">
|
||||
<Link href="milkshake"><img src="assets/images/resource/special-2.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="clearfix">
|
||||
<div className="pull-left">
|
||||
<h4><Link href="milkshake">shawarma</Link></h4>
|
||||
</div>
|
||||
<div className="pull-right">
|
||||
<div className="price">$15</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Special Block */}
|
||||
<div className="special-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInRight" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="image">
|
||||
<Link href="milkshake"><img src="assets/images/resource/special-3.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="clearfix">
|
||||
<div className="pull-left">
|
||||
<h4><Link href="milkshake">pizza</Link></h4>
|
||||
</div>
|
||||
<div className="pull-right">
|
||||
<div className="price">$15</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Special Block */}
|
||||
<div className="special-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="image">
|
||||
<Link href="milkshake"><img src="assets/images/resource/special-4.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="clearfix">
|
||||
<div className="pull-left">
|
||||
<h4><Link href="milkshake">burger</Link></h4>
|
||||
</div>
|
||||
<div className="pull-right">
|
||||
<div className="price">$15</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Special Block */}
|
||||
<div className="special-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInUp" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="image">
|
||||
<Link href="milkshake"><img src="assets/images/resource/special-5.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="clearfix">
|
||||
<div className="pull-left">
|
||||
<h4><Link href="milkshake">club sandwiches</Link></h4>
|
||||
</div>
|
||||
<div className="pull-right">
|
||||
<div className="price">$15</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Special Block */}
|
||||
<div className="special-block col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInRight" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="image">
|
||||
<Link href="milkshake"><img src="assets/images/resource/special-6.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="clearfix">
|
||||
<div className="pull-left">
|
||||
<h4><Link href="milkshake">spicy chicken</Link></h4>
|
||||
</div>
|
||||
<div className="pull-right">
|
||||
<div className="price">$15</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Specials Section */}
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
100
components/sections/home3/AboutNews.js
Normal file
100
components/sections/home3/AboutNews.js
Normal file
@ -0,0 +1,100 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Testimonial() {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* About News Section */}
|
||||
<section className="about-news-section">
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* News Column */}
|
||||
<div className="news-column col-lg-8 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
|
||||
{/* News Block Two */}
|
||||
<div className="news-block-two">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-9.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/recipe-9.jpg" data-fancybox="news" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="content">
|
||||
<div className="category">smoothie</div>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation </div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* News Block Two */}
|
||||
<div className="news-block-two">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-9.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/recipe-9.jpg" data-fancybox="news" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="content">
|
||||
<div className="category">smoothie</div>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation </div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* About Column */}
|
||||
<div className="about-column col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<h6>About us</h6>
|
||||
<div className="author-image">
|
||||
<img src="assets/images/resource/author-2.jpg" alt="" />
|
||||
</div>
|
||||
<div className="author-name">Hi Marria</div>
|
||||
<div className="text">ut sem non aliquet. Nullam tincidunt vestibulum condimentum. </div>
|
||||
{/* Social Box */}
|
||||
<ul className="social-box">
|
||||
<li className="share">Share</li>
|
||||
<li><Link href="#" className="fa fa-facebook-f"></Link></li>
|
||||
<li><Link href="#" className="fa fa-dribbble"></Link></li>
|
||||
<li><Link href="#" className="fa fa-pinterest-p"></Link></li>
|
||||
<li><Link href="#" className="fa fa-google"></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End About News Section */}
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
103
components/sections/home3/Banner.js
Normal file
103
components/sections/home3/Banner.js
Normal file
@ -0,0 +1,103 @@
|
||||
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import { Autoplay, Navigation, Pagination } from "swiper/modules"
|
||||
import { Swiper, SwiperSlide } from "swiper/react"
|
||||
|
||||
const swiperOptions = {
|
||||
modules: [Autoplay, Pagination, Navigation],
|
||||
slidesPerView: 1,
|
||||
spaceBetween: 0,
|
||||
autoplay: {
|
||||
delay: 2500,
|
||||
disableOnInteraction: false,
|
||||
},
|
||||
loop: true,
|
||||
|
||||
// Navigation
|
||||
navigation: {
|
||||
nextEl: '.h1n',
|
||||
prevEl: '.h1p',
|
||||
},
|
||||
|
||||
// Pagination
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
clickable: true,
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
export default function Banner() {
|
||||
return (
|
||||
<>
|
||||
|
||||
|
||||
{/* Banner Section */}
|
||||
<section className="banner-section-three">
|
||||
<Swiper {...swiperOptions} className="main-slider-carousel ">
|
||||
|
||||
{/* Slide */}
|
||||
<SwiperSlide>
|
||||
<div className="slide" style={{ backgroundImage: 'url(assets/images/main-slider/1.jpg)' }} >
|
||||
<div className="auto-container">
|
||||
{/* Content Column */}
|
||||
<div className="content-box">
|
||||
<div className="box-inner">
|
||||
<div className="category">smoothie</div>
|
||||
<h3><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h3>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Slide */}
|
||||
<SwiperSlide>
|
||||
<div className="slide" style={{ backgroundImage: 'url(assets/images/main-slider/2.jpg)' }} >
|
||||
<div className="auto-container">
|
||||
{/* Content Column */}
|
||||
<div className="content-box">
|
||||
<div className="box-inner">
|
||||
<div className="category">smoothie</div>
|
||||
<h3><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h3>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Slide */}
|
||||
<SwiperSlide>
|
||||
<div className="slide" style={{ backgroundImage: 'url(assets/images/main-slider/3.jpg)' }} >
|
||||
<div className="auto-container">
|
||||
{/* Content Column */}
|
||||
<div className="content-box">
|
||||
<div className="box-inner">
|
||||
<div className="category">smoothie</div>
|
||||
<h3><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h3>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
</Swiper>
|
||||
</section>
|
||||
{/* End Banner Section */}
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
170
components/sections/home3/Blog.js
Normal file
170
components/sections/home3/Blog.js
Normal file
@ -0,0 +1,170 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Blog() {
|
||||
return (
|
||||
<>
|
||||
{/* News Section Two */}
|
||||
<section className="news-section-two">
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Left Column */}
|
||||
<div className="left-column col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-column">
|
||||
|
||||
{/* Recipe Block Three / Style Two */}
|
||||
<div className="recipe-block-three style-two">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-4.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/news-4.jpg" data-fancybox="news-images" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Recipe Block Three / Style Two */}
|
||||
<div className="recipe-block-three style-two">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-5.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/news-5.jpg" data-fancybox="news-images" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Middle Column */}
|
||||
<div className="middle-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
{/* Recipe Block Three */}
|
||||
<div className="recipe-block-three">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-8.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/news-8.jpg" data-fancybox="news-images" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ <br/> cheese bruschetta</Link></h6>
|
||||
<div className="text">
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in<br/><br/>
|
||||
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Right Column */}
|
||||
<div className="right-column col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-column">
|
||||
|
||||
{/* Recipe Block Three / Style Two */}
|
||||
<div className="recipe-block-three style-two">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-6.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/news-6.jpg" data-fancybox="news-images" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Recipe Block Three / Style Two */}
|
||||
<div className="recipe-block-three style-two">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-7.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/news-7.jpg" data-fancybox="news-images" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End News Section Two */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
180
components/sections/home3/Blog2.js
Normal file
180
components/sections/home3/Blog2.js
Normal file
@ -0,0 +1,180 @@
|
||||
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Blog2() {
|
||||
return (
|
||||
<>
|
||||
{/* News Section Three */}
|
||||
<section className="news-section-three">
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Recipe Block Three */}
|
||||
<div className="recipe-block-three col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-10.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/news-10.jpg" data-fancybox="news-section" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Recipe Block Three */}
|
||||
<div className="recipe-block-three col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-11.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/news-11.jpg" data-fancybox="news-section" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Recipe Block Three */}
|
||||
<div className="recipe-block-three col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-12.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/news-12.jpg" data-fancybox="news-section" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Recipe Block Three */}
|
||||
<div className="recipe-block-three col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-13.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/news-13.jpg" data-fancybox="news-section" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Recipe Block Three */}
|
||||
<div className="recipe-block-three col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-14.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/news-14.jpg" data-fancybox="news-section" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Recipe Block Three */}
|
||||
<div className="recipe-block-three col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/news-15.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/news-15.jpg" data-fancybox="news-section" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End News Section Three */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
37
components/sections/home3/Experience.js
Normal file
37
components/sections/home3/Experience.js
Normal file
@ -0,0 +1,37 @@
|
||||
'use client'
|
||||
export default function Experience() {
|
||||
return (
|
||||
<>
|
||||
<section className="experience-section" style={{ backgroundImage: 'url(assets/images/background/bg-8.jpg)' }}>
|
||||
<div className="auto-container">
|
||||
<div className="row">
|
||||
<div className="col-lg-6">
|
||||
<div className="sec-title light style-three">
|
||||
<h5>Why Choose Us</h5>
|
||||
<h2>Reason for choosing us</h2>
|
||||
<div className="text">To provide business planning and marketing services our being able to do what we like best.</div>
|
||||
</div>
|
||||
<div className="icon-box">
|
||||
<div className="icon"><span className="flaticon-bot" /></div>
|
||||
<h4>Tailored advice and <br />support</h4>
|
||||
<div className="text">Business it will frequently occur that pleasures have to repudiated accepted.</div>
|
||||
</div>
|
||||
<div className="icon-box">
|
||||
<div className="icon"><span className="flaticon-bot" /></div>
|
||||
<h4>Flexibility to serve you <br /> better service</h4>
|
||||
<div className="text">Complete accounts of the systems and expound teachings of the great explorers.</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div className="experience-wrapper">
|
||||
<div className="image"><img src="/assets/images/resource/graph.png" alt="" /></div>
|
||||
<h1>experience</h1>
|
||||
<div className="experience-year"><h2>08 </h2><div className="text">Years <br />of Experience</div></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</>
|
||||
)
|
||||
}
|
||||
41
components/sections/home3/Fluid.js
Normal file
41
components/sections/home3/Fluid.js
Normal file
@ -0,0 +1,41 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Fluid() {
|
||||
return (
|
||||
<>
|
||||
{/* Fluid Section Two */}
|
||||
<section className="fluid-section-two">
|
||||
<div className="section-text">Recipe book</div>
|
||||
<div className="outer-container clearfix">
|
||||
|
||||
{/* Content Column */}
|
||||
<div className="content-column">
|
||||
<div className="inner-column">
|
||||
{/* Title Box */}
|
||||
<div className="title-box">
|
||||
<h2>Free recipe book!</h2>
|
||||
<div className="text">Get your copy of spicy kitchen feauturing 10 of our most loved, <br/> highly-rated recipes!</div>
|
||||
</div>
|
||||
<ul className="book-list">
|
||||
<li><img src="assets/images/resource/book-list-1.png" alt="" /></li>
|
||||
<li><img src="assets/images/resource/book-list-2.png" alt="" /></li>
|
||||
<li><img src="assets/images/resource/book-list-3.png" alt="" /></li>
|
||||
</ul>
|
||||
{/* Button Box */}
|
||||
<div className="button-box">
|
||||
<Link href="menu" className="theme-btn btn-style-two clearfix"><span className="icon"></span>Get In Now</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Image Column */}
|
||||
<div className="image-column" style={{ backgroundImage: 'url(assets/images/resource/image-2.jpg)' }} >
|
||||
<figure className="image-box"><img src="assets/images/resource/image-2.jpg" alt=""/></figure>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
{/* End Fluid Section Two */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
297
components/sections/home3/Instagram.js
Normal file
297
components/sections/home3/Instagram.js
Normal file
@ -0,0 +1,297 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import { Autoplay, Navigation, Pagination } from "swiper/modules"
|
||||
import { Swiper, SwiperSlide } from "swiper/react"
|
||||
|
||||
|
||||
const swiperOptions = {
|
||||
modules: [Autoplay, Pagination, Navigation],
|
||||
slidesPerView: 6,
|
||||
spaceBetween: 2,
|
||||
// autoplay: {
|
||||
// delay: 2500,
|
||||
// disableOnInteraction: false,
|
||||
// },
|
||||
loop: true,
|
||||
|
||||
// Navigation
|
||||
navigation: {
|
||||
nextEl: '.srn',
|
||||
prevEl: '.srp',
|
||||
},
|
||||
|
||||
// Pagination
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
clickable: true,
|
||||
},
|
||||
|
||||
breakpoints: {
|
||||
320: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
575: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
767: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
991: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
1199: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
1350: {
|
||||
slidesPerView: 6,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
export default function Instagram() {
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* Instagram Post Section */}
|
||||
<section className="instagram-post-section">
|
||||
<div className="auto-container">
|
||||
{/* Sec Title Two */}
|
||||
<div className="sec-title-two">
|
||||
<div className="title">All post</div>
|
||||
<h4>@ yourinstagram</h4>
|
||||
<div className="separator"></div>
|
||||
</div>
|
||||
<Swiper {...swiperOptions} className="instagram-carousel ">
|
||||
|
||||
{/* Instagram Block */}
|
||||
<SwiperSlide>
|
||||
<div className="instagram-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/13.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/13.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Instagram Block */}
|
||||
<SwiperSlide>
|
||||
<div className="instagram-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/14.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/14.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Instagram Block */}
|
||||
<SwiperSlide>
|
||||
<div className="instagram-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/15.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/15.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Instagram Block */}
|
||||
<SwiperSlide>
|
||||
<div className="instagram-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/16.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/16.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Instagram Block */}
|
||||
<SwiperSlide>
|
||||
<div className="instagram-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/17.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/17.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Instagram Block */}
|
||||
<SwiperSlide>
|
||||
<div className="instagram-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/18.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/18.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Instagram Block */}
|
||||
<SwiperSlide>
|
||||
<div className="instagram-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/13.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/13.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Instagram Block */}
|
||||
<SwiperSlide>
|
||||
<div className="instagram-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/14.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/14.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Instagram Block */}
|
||||
<SwiperSlide>
|
||||
<div className="instagram-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/15.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/15.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Instagram Block */}
|
||||
<SwiperSlide>
|
||||
<div className="instagram-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/16.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/16.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Instagram Block */}
|
||||
<SwiperSlide>
|
||||
<div className="instagram-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/17.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/17.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Instagram Block */}
|
||||
<SwiperSlide>
|
||||
<div className="instagram-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/18.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/gallery/18.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
</Swiper>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Instagram Post Section */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
44
components/sections/home3/Newsletter.js
Normal file
44
components/sections/home3/Newsletter.js
Normal file
@ -0,0 +1,44 @@
|
||||
'use client'
|
||||
export default function Newsletter() {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* Newsletter Section */}
|
||||
<section className="newsletter-section">
|
||||
<div className="auto-container">
|
||||
<div className="inner-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Title Column */}
|
||||
<div className="title-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<div className="send-icon fa fa-send"></div>
|
||||
<h4>Join Our Newsletter</h4>
|
||||
<div className="title">We'll keep you posted and updates!</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Newsletter Column */}
|
||||
<div className="newsletter-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
{/* Newsletter Form Two */}
|
||||
<div className="newsletter-form-two">
|
||||
<form method="post">
|
||||
<div className="form-group">
|
||||
<input type="email" name="email" placeholder="Enter Your E-mail ..."/>
|
||||
<button type="submit" className="theme-btn btn-style-one clearfix"><span className="icon"></span>Buy Now</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Newsletter Section */}
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
391
components/sections/home3/PopularRecipe.js
Normal file
391
components/sections/home3/PopularRecipe.js
Normal file
@ -0,0 +1,391 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import { Autoplay, Navigation, Pagination } from "swiper/modules"
|
||||
import { Swiper, SwiperSlide } from "swiper/react"
|
||||
|
||||
|
||||
const swiperOptions = {
|
||||
modules: [Autoplay, Pagination, Navigation],
|
||||
slidesPerView: 6,
|
||||
spaceBetween: 20,
|
||||
// autoplay: {
|
||||
// delay: 2500,
|
||||
// disableOnInteraction: false,
|
||||
// },
|
||||
loop: true,
|
||||
|
||||
// Navigation
|
||||
navigation: {
|
||||
nextEl: '.srn',
|
||||
prevEl: '.srp',
|
||||
},
|
||||
|
||||
// Pagination
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
clickable: true,
|
||||
},
|
||||
|
||||
breakpoints: {
|
||||
320: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
575: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
767: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
991: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
1199: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
1350: {
|
||||
slidesPerView: 6,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
export default function PopularRecipe() {
|
||||
return (
|
||||
<>
|
||||
{/* Popular Recipe Section */}
|
||||
<section className="popular-recipe-section">
|
||||
<div className="auto-container">
|
||||
{/* Sec Title Two */}
|
||||
<div className="sec-title-two">
|
||||
<div className="title">All post</div>
|
||||
<h4>The most popular recipes </h4>
|
||||
<div className="separator"></div>
|
||||
</div>
|
||||
<Swiper {...swiperOptions} className="posts-carousel ">
|
||||
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-12.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-13.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-14.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-15.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-16.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-17.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-12.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-13.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-14.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-15.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-16.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-17.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-12.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-13.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-14.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-15.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-16.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-17.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-12.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-13.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-14.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-15.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-16.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Recipe Block Five */}
|
||||
<SwiperSlide>
|
||||
<div className="recipe-block-five">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="slushy"><img src="assets/images/resource/recipe-17.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6><Link href="slushy">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
</Swiper>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Popular Recipe Section */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
105
components/sections/home3/Recipe.js
Normal file
105
components/sections/home3/Recipe.js
Normal file
@ -0,0 +1,105 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Recipe() {
|
||||
return (
|
||||
<>
|
||||
|
||||
|
||||
{/* Recipe Section */}
|
||||
<section className="recipe-section-two">
|
||||
<div className="auto-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<div className="title">News & Recipe</div>
|
||||
<h2>Popular Recipes</h2>
|
||||
<div className="separate"></div>
|
||||
</div>
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Recipe Block Two */}
|
||||
<div className="recipe-block-two col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/recipe-5.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/recipe-5.jpg" data-fancybox="news" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Recipe Block Two */}
|
||||
<div className="recipe-block-two col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInUp" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/recipe-6.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/recipe-6.jpg" data-fancybox="news" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Recipe Block Two */}
|
||||
<div className="recipe-block-two col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInRight" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/recipe-7.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/recipe-7.jpg" data-fancybox="news" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Recipe Section Two */}
|
||||
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
141
components/sections/home3/Recipe2.js
Normal file
141
components/sections/home3/Recipe2.js
Normal file
@ -0,0 +1,141 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Recipe2() {
|
||||
return (
|
||||
<>
|
||||
{/* Recipe Section Three */}
|
||||
<section className="recipe-section-three">
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
{/* Column */}
|
||||
<div className="column col-lg-6 col-md-12 col-sm-12">
|
||||
{/* Sec Title Two */}
|
||||
<div className="sec-title-two">
|
||||
<div className="title">All post</div>
|
||||
<h4>Featured recipes</h4>
|
||||
<div className="separator"></div>
|
||||
</div>
|
||||
|
||||
{/* Recipe Block Three */}
|
||||
<div className="recipe-block-three">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/recipe-8.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/recipe-8.jpg" data-fancybox="news" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<div className="category">smoothie</div>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
<div className="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
{/* Column */}
|
||||
<div className="column col-lg-6 col-md-12 col-sm-12">
|
||||
{/* Sec Title Two */}
|
||||
<div className="sec-title-two">
|
||||
<div className="title">All post</div>
|
||||
<h4>Recent Recipes</h4>
|
||||
<div className="separator"></div>
|
||||
</div>
|
||||
|
||||
{/* Recipe Block Four */}
|
||||
<div className="recipe-block-four">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/recipe-9.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/recipe-9.jpg" data-fancybox="news" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="content">
|
||||
<div className="category">smoothie</div>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Recipe Block Four */}
|
||||
<div className="recipe-block-four">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/recipe-10.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/recipe-10.jpg" data-fancybox="news" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="content">
|
||||
<div className="category">smoothie</div>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Recipe Block Four */}
|
||||
<div className="recipe-block-four">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/recipe-11.jpg" alt="" />
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<Link href="assets/images/resource/recipe-11.jpg" data-fancybox="news" data-caption="" className="icon flaticon-gallery"></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="content">
|
||||
<div className="category">smoothie</div>
|
||||
<ul className="post-info">
|
||||
<li>May 21, 2021</li>
|
||||
<li>2 Comments</li>
|
||||
<li><Link href="news-detail">Share</Link></li>
|
||||
</ul>
|
||||
<h6><Link href="news-detail">Broad bean and goats’ cheese bruschetta</Link></h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Recipe Section Three */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
34
components/sections/home3/video.js
Normal file
34
components/sections/home3/video.js
Normal file
@ -0,0 +1,34 @@
|
||||
'use client'
|
||||
import { useState } from 'react'
|
||||
import ModalVideo from 'react-modal-video'
|
||||
|
||||
|
||||
export default function Video() {
|
||||
const [isOpen, setOpen] = useState(false)
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* Video Section */}
|
||||
<section className="video-section">
|
||||
<div className="image-layer" style={{ backgroundImage: 'url(assets/images/background/5.jpg)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="inner-container">
|
||||
{/* Video Box */}
|
||||
<div className="video-box">
|
||||
<figure className="video-image">
|
||||
<img src="assets/images/resource/video-image.jpg" alt=""/>
|
||||
</figure>
|
||||
<a onClick={() => setOpen(true)} className="lightbox-image overlay-box"><span className="flaticon-play-arrow"><i className="ripple"></i></span></a>
|
||||
</div>
|
||||
<div className="lower-content">
|
||||
<h6>New Recipes video</h6>
|
||||
<div className="text">Us percipit urbanitas referrentur ea. Mei at numquam molestiae <br/> intellegam.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Video Section */}
|
||||
<ModalVideo channel='youtube' autoplay isOpen={isOpen} videoId="Get7rqXYrbQ" onClose={() => setOpen(false)} />
|
||||
</>
|
||||
)
|
||||
}
|
||||
97
components/sections/home4/Banner.js
Normal file
97
components/sections/home4/Banner.js
Normal file
@ -0,0 +1,97 @@
|
||||
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import { Autoplay, Navigation, Pagination } from "swiper/modules"
|
||||
import { Swiper, SwiperSlide } from "swiper/react"
|
||||
|
||||
const swiperOptions = {
|
||||
modules: [Autoplay, Pagination, Navigation],
|
||||
slidesPerView: 1,
|
||||
spaceBetween: 0,
|
||||
// autoplay: {
|
||||
// delay: 2500,
|
||||
// disableOnInteraction: false,
|
||||
// },
|
||||
loop: true,
|
||||
|
||||
// Navigation
|
||||
navigation: {
|
||||
nextEl: '.h1n',
|
||||
prevEl: '.h1p',
|
||||
},
|
||||
|
||||
// Pagination
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
clickable: true,
|
||||
},
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
export default function Banner() {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* End Banner Section */}
|
||||
<section className="banner-section-four">
|
||||
<Swiper {...swiperOptions} className="main-slider-carousel ">
|
||||
|
||||
{/* Slide */}
|
||||
<SwiperSlide>
|
||||
<div className="slide" style={{ backgroundImage: 'url(assets/images/main-slider/1.jpg)' }} >
|
||||
<div className="auto-container">
|
||||
{/* Content Column */}
|
||||
<div className="content-box">
|
||||
<div className="box-inner">
|
||||
<h1>Unique <br/> Restaurant</h1>
|
||||
<div className="btn-box text-center">
|
||||
<Link href="menu" className="theme-btn btn-style-one clearfix"><span className="icon"></span>Buy Now</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Slide */}
|
||||
<SwiperSlide>
|
||||
<div className="slide" style={{ backgroundImage: 'url(assets/images/main-slider/2.jpg)' }} >
|
||||
<div className="auto-container">
|
||||
{/* Content Column */}
|
||||
<div className="content-box">
|
||||
<div className="box-inner">
|
||||
<h1>Unique <br/> Restaurant</h1>
|
||||
<div className="btn-box text-center">
|
||||
<Link href="menu" className="theme-btn btn-style-one clearfix"><span className="icon"></span>Buy Now</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Slide */}
|
||||
<SwiperSlide>
|
||||
<div className="slide" style={{ backgroundImage: 'url(assets/images/main-slider/3.jpg)' }} >
|
||||
<div className="auto-container">
|
||||
{/* Content Column */}
|
||||
<div className="content-box">
|
||||
<div className="box-inner">
|
||||
<h1>Unique <br/> Restaurant</h1>
|
||||
<div className="btn-box text-center">
|
||||
<Link href="menu" className="theme-btn btn-style-one clearfix"><span className="icon"></span>Buy Now</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
</Swiper>
|
||||
{/*Scroll Dwwn Btn*/}
|
||||
<div className="mouse-btn-down scroll-to-target" data-target=".testimonial-section-two"></div>
|
||||
</section>
|
||||
{/* End End Banner Section */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
104
components/sections/home4/Clients.js
Normal file
104
components/sections/home4/Clients.js
Normal file
@ -0,0 +1,104 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import { Autoplay, Navigation, Pagination } from "swiper/modules"
|
||||
import { Swiper, SwiperSlide } from "swiper/react"
|
||||
|
||||
|
||||
const swiperOptions = {
|
||||
modules: [Autoplay, Pagination, Navigation],
|
||||
slidesPerView: 5,
|
||||
spaceBetween: 30,
|
||||
// autoplay: {
|
||||
// delay: 2500,
|
||||
// disableOnInteraction: false,
|
||||
// },
|
||||
loop: true,
|
||||
|
||||
// Navigation
|
||||
navigation: {
|
||||
nextEl: '.srn',
|
||||
prevEl: '.srp',
|
||||
},
|
||||
|
||||
// Pagination
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
clickable: true,
|
||||
},
|
||||
|
||||
breakpoints: {
|
||||
320: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
575: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
767: {
|
||||
slidesPerView: 2,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
991: {
|
||||
slidesPerView: 3,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
1199: {
|
||||
slidesPerView: 3,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
1350: {
|
||||
slidesPerView: 5,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
export default function Clients() {
|
||||
return (
|
||||
<>
|
||||
|
||||
|
||||
{/* Clients Section */}
|
||||
<section className="clients-section">
|
||||
<div className="auto-container">
|
||||
<div className="inner-container">
|
||||
<div className="sponsors-outer">
|
||||
{/*Sponsors Carousel*/}
|
||||
<Swiper {...swiperOptions} className="sponsors-carousel ">
|
||||
<SwiperSlide>
|
||||
<li className="slide-item"><figure className="image-box"><Link href="#"><img src="assets/images/clients/1.jpg" alt=""/></Link></figure></li>
|
||||
</SwiperSlide>
|
||||
<SwiperSlide>
|
||||
<li className="slide-item"><figure className="image-box"><Link href="#"><img src="assets/images/clients/2.jpg" alt=""/></Link></figure></li>
|
||||
</SwiperSlide>
|
||||
<SwiperSlide>
|
||||
<li className="slide-item"><figure className="image-box"><Link href="#"><img src="assets/images/clients/3.jpg" alt=""/></Link></figure></li>
|
||||
</SwiperSlide>
|
||||
<SwiperSlide>
|
||||
<li className="slide-item"><figure className="image-box"><Link href="#"><img src="assets/images/clients/4.jpg" alt=""/></Link></figure></li>
|
||||
</SwiperSlide>
|
||||
<SwiperSlide>
|
||||
<li className="slide-item"><figure className="image-box"><Link href="#"><img src="assets/images/clients/5.jpg" alt=""/></Link></figure></li>
|
||||
</SwiperSlide>
|
||||
<SwiperSlide>
|
||||
<li className="slide-item"><figure className="image-box"><Link href="#"><img src="assets/images/clients/6.jpg" alt=""/></Link></figure></li>
|
||||
</SwiperSlide>
|
||||
<SwiperSlide>
|
||||
<li className="slide-item"><figure className="image-box"><Link href="#"><img src="assets/images/clients/1.jpg" alt=""/></Link></figure></li>
|
||||
</SwiperSlide>
|
||||
</Swiper>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Clients Section */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
114
components/sections/home4/Gallery.js
Normal file
114
components/sections/home4/Gallery.js
Normal file
@ -0,0 +1,114 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Gallery() {
|
||||
return (
|
||||
<>
|
||||
{/* Gallery Section Two */}
|
||||
<section className="gallery-section-two">
|
||||
<div className="outer-container">
|
||||
<div className="masonry-items-container row clearfix">
|
||||
<div className="col-lg-3 col-md-6 col-sm-12">
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/19.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div className="col-lg-3 col-md-6 col-sm-12">
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/20.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/21.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div className="col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="row no-gutters">
|
||||
<div className="col-lg-6 col-md-6 col-sm-12">
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/22.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<div className="col-lg-6 col-md-6 col-sm-12">
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item ">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/23.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div className="col-lg-12 col-md-12 col-sm-12">
|
||||
{/* Gallery Block Two */}
|
||||
<div className="gallery-block-two masonry-item">
|
||||
<div className="inner-box">
|
||||
<div className="image-box">
|
||||
<img src="assets/images/gallery/24.jpg" alt="" />
|
||||
<div className="overlay-box">
|
||||
<h6><Link href="gallery">Cornish cod fillet</Link></h6>
|
||||
<div className="title">Us percipit urbanitas referrentur ea.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Gallery Section Two */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
106
components/sections/home4/Menu.js
Normal file
106
components/sections/home4/Menu.js
Normal file
@ -0,0 +1,106 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Menu() {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* Menu Section Two */}
|
||||
<section className="menu-section-two">
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Menu Block Three */}
|
||||
<div className="menu-block-three col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="content">
|
||||
<div className="menu-title">morning</div>
|
||||
<h4>Breakfast</h4>
|
||||
{/* Menu Item */}
|
||||
<div className="menu-item">
|
||||
<h6><Link href="#">young keeps & Asparagus</Link></h6>
|
||||
<div className="sub-title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<div className="price">$15</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* Menu Item */}
|
||||
<div className="menu-item">
|
||||
<h6><Link href="#">young keeps & Asparagus</Link></h6>
|
||||
<div className="sub-title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<div className="price">$15</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/menu-35.jpg" alt="" /></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block Three */}
|
||||
<div className="menu-block-three col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInUp" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="content">
|
||||
<div className="menu-title">noon</div>
|
||||
<h4>lunch</h4>
|
||||
{/* Menu Item */}
|
||||
<div className="menu-item">
|
||||
<h6><Link href="#">young keeps & Asparagus</Link></h6>
|
||||
<div className="sub-title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<div className="price">$15</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* Menu Item */}
|
||||
<div className="menu-item">
|
||||
<h6><Link href="#">young keeps & Asparagus</Link></h6>
|
||||
<div className="sub-title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<div className="price">$15</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/menu-36.jpg" alt="" /></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block Three */}
|
||||
<div className="menu-block-three col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box wow fadeInRight" data-wow-delay="0ms" data-wow-duration="1500ms">
|
||||
<div className="content">
|
||||
<div className="menu-title">Night</div>
|
||||
<h4>Dinner</h4>
|
||||
{/* Menu Item */}
|
||||
<div className="menu-item">
|
||||
<h6><Link href="#">young keeps & Asparagus</Link></h6>
|
||||
<div className="sub-title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<div className="price">$15</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* Menu Item */}
|
||||
<div className="menu-item">
|
||||
<h6><Link href="#">young keeps & Asparagus</Link></h6>
|
||||
<div className="sub-title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<div className="price">$15</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/menu-37.jpg" alt="" /></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Menu Section Two */}
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
60
components/sections/home4/Menu2.js
Normal file
60
components/sections/home4/Menu2.js
Normal file
@ -0,0 +1,60 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Menu2() {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* Menu Page Section */}
|
||||
<section className="menu-page-section">
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Menu Block Two */}
|
||||
<div className="menu-block-two col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="side-icon">
|
||||
<img src="assets/images/icons/menu-icon-1.png" alt="" />
|
||||
</div>
|
||||
<div className="icon">
|
||||
<img src="assets/images/icons/menu-1.png" alt="" />
|
||||
</div>
|
||||
<h6><Link href="#">Awesome taste</Link></h6>
|
||||
<div className="text">Us percipit urbanitas referrentur ea. Mei at numquam molestiae intellegam.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block Two */}
|
||||
<div className="menu-block-two col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="side-icon">
|
||||
<img src="assets/images/icons/menu-icon-2.png" alt="" />
|
||||
</div>
|
||||
<div className="icon">
|
||||
<img src="assets/images/icons/menu-2.png" alt="" />
|
||||
</div>
|
||||
<h6><Link href="#">Organic fruits</Link></h6>
|
||||
<div className="text">Us percipit urbanitas referrentur ea. Mei at numquam molestiae intellegam.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block Two */}
|
||||
<div className="menu-block-two col-lg-4 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="side-icon">
|
||||
<img src="assets/images/icons/menu-icon-3.png" alt="" />
|
||||
</div>
|
||||
<div className="icon">
|
||||
<img src="assets/images/icons/menu-3.png" alt="" />
|
||||
</div>
|
||||
<h6><Link href="#">Healthy Blends</Link></h6>
|
||||
<div className="text">Us percipit urbanitas referrentur ea. Mei at numquam molestiae intellegam.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Restaurant Section */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
151
components/sections/home4/Menu3.js
Normal file
151
components/sections/home4/Menu3.js
Normal file
@ -0,0 +1,151 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Menu3() {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* Menus Section */}
|
||||
<section className="menus-section style-two">
|
||||
<figure className="menu-bottom-image">
|
||||
<img src="assets/images/resource/menu-9.jpg" alt=""/>
|
||||
</figure>
|
||||
<div className="auto-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<div className="title">Softly & Crunchy</div>
|
||||
<h2>Main Courses</h2>
|
||||
<div className="separate"></div>
|
||||
</div>
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Menu Column */}
|
||||
<div className="menu-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-1.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Grilled Toast Burger</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-3.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Fried snacks</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-5.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Pizza</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-7.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Sandwiches</Link></h6>
|
||||
<div className="title">Crispy black garlic</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Column */}
|
||||
<div className="menu-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-2.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Coca Cola</Link></h6>
|
||||
<div className="title">Carbonated Drinks</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-4.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Papsi</Link></h6>
|
||||
<div className="title">Carbonated Drinks</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-6.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Mirinda</Link></h6>
|
||||
<div className="title">Carbonated Drinks</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Menu Block */}
|
||||
<div className="menu-block">
|
||||
<div className="inner-box">
|
||||
<div className="menu-image">
|
||||
<Link href="menu"><img src="assets/images/resource/menu-8.jpg" alt="" /></Link>
|
||||
</div>
|
||||
<h6><Link href="menu">Fanta</Link></h6>
|
||||
<div className="title">Carbonated Drinks</div>
|
||||
<div className="price-box">
|
||||
<span className="price">$15</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Menus Section */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
105
components/sections/home4/Staff.js
Normal file
105
components/sections/home4/Staff.js
Normal file
@ -0,0 +1,105 @@
|
||||
import Link from "next/link"
|
||||
|
||||
|
||||
export default function Staff() {
|
||||
return (
|
||||
<>
|
||||
{/* Staff Section Two */}
|
||||
<section className="staff-section-two">
|
||||
<div className="outer-container">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<div className="title">our most valuable assets</div>
|
||||
<h2>Friendly Staff</h2>
|
||||
<div className="separate"></div>
|
||||
</div>
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Staff Block */}
|
||||
<div className="staff-block col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/staff-4.jpg" alt="" /></Link>
|
||||
<div className="overlay-box">
|
||||
<div className="content">
|
||||
<h6><Link href="#">Jusica Malina</Link></h6>
|
||||
<div className="designation">Pastry Chef</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-facebook-square"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter-square"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Staff Block */}
|
||||
<div className="staff-block col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/staff-5.jpg" alt="" /></Link>
|
||||
<div className="overlay-box">
|
||||
<div className="content">
|
||||
<h6><Link href="#">Jusica Malina</Link></h6>
|
||||
<div className="designation">Pastry Chef</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-facebook-square"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter-square"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Staff Block */}
|
||||
<div className="staff-block col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/staff-6.jpg" alt="" /></Link>
|
||||
<div className="overlay-box">
|
||||
<div className="content">
|
||||
<h6><Link href="#">Jusica Malina</Link></h6>
|
||||
<div className="designation">Pastry Chef</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-facebook-square"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter-square"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Staff Block */}
|
||||
<div className="staff-block col-lg-3 col-md-6 col-sm-12">
|
||||
<div className="inner-box">
|
||||
<div className="image">
|
||||
<Link href="#"><img src="assets/images/resource/staff-7.jpg" alt="" /></Link>
|
||||
<div className="overlay-box">
|
||||
<div className="content">
|
||||
<h6><Link href="#">Jusica Malina</Link></h6>
|
||||
<div className="designation">Pastry Chef</div>
|
||||
<ul className="social-list">
|
||||
<li><Link href="#"><span className="icon fa fa-instagram"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-facebook-square"></span></Link></li>
|
||||
<li><Link href="#"><span className="icon fa fa-twitter-square"></span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Staff Section Two */}
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
129
components/sections/home4/Testimonial.js
Normal file
129
components/sections/home4/Testimonial.js
Normal file
@ -0,0 +1,129 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
import { Autoplay, Navigation, Pagination } from "swiper/modules"
|
||||
import { Swiper, SwiperSlide } from "swiper/react"
|
||||
|
||||
|
||||
const swiperOptions = {
|
||||
modules: [Autoplay, Pagination, Navigation],
|
||||
slidesPerView: 1,
|
||||
spaceBetween: 30,
|
||||
// autoplay: {
|
||||
// delay: 2500,
|
||||
// disableOnInteraction: false,
|
||||
// },
|
||||
loop: true,
|
||||
|
||||
// Navigation
|
||||
navigation: {
|
||||
nextEl: '.srn',
|
||||
prevEl: '.srp',
|
||||
},
|
||||
|
||||
// Pagination
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
clickable: true,
|
||||
},
|
||||
|
||||
breakpoints: {
|
||||
320: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
575: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
767: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
991: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
1199: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
1350: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 30,
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
export default function Testimonial() {
|
||||
return (
|
||||
<>
|
||||
{/* Testimonial Section Two */}
|
||||
<section className="testimonial-section-two">
|
||||
<div className="icon-layer-one" style={{ backgroundImage: 'url(assets/images/resource/testimonial-icon.jpg)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="inner-container">
|
||||
<div className="icon-layer-two" style={{ backgroundImage: 'url(assets/images/resource/testimonial-icon-1.jpg)' }} ></div>
|
||||
<Swiper {...swiperOptions} className="single-item-carousel ">
|
||||
|
||||
{/* Testimonial Block Two */}
|
||||
<SwiperSlide>
|
||||
<div className="testimonial-block-two">
|
||||
<div className="inner-box">
|
||||
<div className="rating">
|
||||
<span className="fa fa-star"></span>
|
||||
<span className="fa fa-star"></span>
|
||||
<span className="fa fa-star"></span>
|
||||
<span className="fa fa-star"></span>
|
||||
<span className="fa fa-star"></span>
|
||||
</div>
|
||||
<div className="text">“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.”</div>
|
||||
<div className="designation">Wood Martin <span>- Host Mother</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Testimonial Block Two */}
|
||||
<SwiperSlide>
|
||||
<div className="testimonial-block-two">
|
||||
<div className="inner-box">
|
||||
<div className="rating">
|
||||
<span className="fa fa-star"></span>
|
||||
<span className="fa fa-star"></span>
|
||||
<span className="fa fa-star"></span>
|
||||
<span className="fa fa-star"></span>
|
||||
<span className="fa fa-star"></span>
|
||||
</div>
|
||||
<div className="text">“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.”</div>
|
||||
<div className="designation">Wood Martin <span>- Host Mother</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Testimonial Block Two */}
|
||||
<SwiperSlide>
|
||||
<div className="testimonial-block-two">
|
||||
<div className="inner-box">
|
||||
<div className="rating">
|
||||
<span className="fa fa-star"></span>
|
||||
<span className="fa fa-star"></span>
|
||||
<span className="fa fa-star"></span>
|
||||
<span className="fa fa-star"></span>
|
||||
<span className="fa fa-star"></span>
|
||||
</div>
|
||||
<div className="text">“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.”</div>
|
||||
<div className="designation">Wood Martin <span>- Host Mother</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
</Swiper>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Testimonial Section Two */}
|
||||
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
49
components/sections/home4/Tips.js
Normal file
49
components/sections/home4/Tips.js
Normal file
@ -0,0 +1,49 @@
|
||||
'use client'
|
||||
import Link from "next/link"
|
||||
export default function Tips() {
|
||||
return (
|
||||
<>
|
||||
{/* Tips Section */}
|
||||
<section className="tips-section">
|
||||
<div className="pattern-layer" style={{ backgroundImage: 'url(assets/images/resource/history-icon.png)' }} ></div>
|
||||
<div className="auto-container">
|
||||
<div className="row clearfix">
|
||||
|
||||
{/* Image Column */}
|
||||
<div className="image-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
<div className="image">
|
||||
<img src="assets/images/resource/history-1.jpg" alt="" />
|
||||
</div>
|
||||
<div className="image-two">
|
||||
<img src="assets/images/resource/history-2.jpg" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Content Column */}
|
||||
<div className="content-column col-lg-6 col-md-12 col-sm-12">
|
||||
<div className="inner-column">
|
||||
{/* Sec Title */}
|
||||
<div className="sec-title centered">
|
||||
<div className="title">Our food philosofty</div>
|
||||
<h2>Our Tips</h2>
|
||||
<div className="separate"></div>
|
||||
<div className="text">voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit.</div>
|
||||
</div>
|
||||
<div className="btns-box text-center">
|
||||
<Link href="menu" className="theme-btn btn-style-one clearfix"><span className="icon"></span>Buy Now</Link>
|
||||
</div>
|
||||
<div className="signature-image">
|
||||
<img src="assets/images/icons/signature.png" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Tips Section */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
23
components/sections/home4/Video.js
Normal file
23
components/sections/home4/Video.js
Normal file
@ -0,0 +1,23 @@
|
||||
'use client'
|
||||
import { useState } from 'react'
|
||||
import ModalVideo from 'react-modal-video'
|
||||
|
||||
export default function Video() {
|
||||
const [isOpen, setOpen] = useState(false)
|
||||
return (
|
||||
<>
|
||||
{/* Video Section Two */}
|
||||
<section className="video-section-two">
|
||||
{/* Video Box */}
|
||||
<div className="video-box">
|
||||
<figure className="video-image">
|
||||
<img src="assets/images/background/8.jpg" alt=""/>
|
||||
</figure>
|
||||
<a onClick={() => setOpen(true)} className="lightbox-image overlay-box"><span className="flaticon-play-arrow"><i className="ripple"></i></span></a>
|
||||
</div>
|
||||
</section>
|
||||
{/* End Video Section Two */}
|
||||
<ModalVideo channel='youtube' autoplay isOpen={isOpen} videoId="Get7rqXYrbQ" onClose={() => setOpen(false)} />
|
||||
</>
|
||||
)
|
||||
}
|
||||
266
components/slider/GallerySlider1.js
Normal file
266
components/slider/GallerySlider1.js
Normal file
@ -0,0 +1,266 @@
|
||||
'use client'
|
||||
import { Autoplay, Navigation, Pagination } from "swiper/modules"
|
||||
import { Swiper, SwiperSlide } from "swiper/react"
|
||||
|
||||
const swiperOptions = {
|
||||
modules: [Autoplay, Pagination, Navigation],
|
||||
slidesPerView: 5,
|
||||
// spaceBetween: 20,
|
||||
autoplay: {
|
||||
delay: 2500,
|
||||
disableOnInteraction: false,
|
||||
},
|
||||
loop: true,
|
||||
|
||||
// Navigation
|
||||
navigation: {
|
||||
nextEl: '.h1n',
|
||||
prevEl: '.h1p',
|
||||
},
|
||||
|
||||
// Pagination
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
clickable: true,
|
||||
},
|
||||
|
||||
breakpoints: {
|
||||
320: {
|
||||
slidesPerView: 1,
|
||||
// spaceBetween: 20,
|
||||
},
|
||||
575: {
|
||||
slidesPerView: 2,
|
||||
// spaceBetween: 20,
|
||||
},
|
||||
767: {
|
||||
slidesPerView: 3,
|
||||
// spaceBetween: 20,
|
||||
},
|
||||
991: {
|
||||
slidesPerView: 3,
|
||||
// spaceBetween: 20,
|
||||
},
|
||||
1199: {
|
||||
slidesPerView: 5,
|
||||
// spaceBetween: 20,
|
||||
},
|
||||
1350: {
|
||||
slidesPerView: 5,
|
||||
// spaceBetween: 20,
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
export default function AwardSlider1() {
|
||||
return (
|
||||
<>
|
||||
|
||||
{/* <Swiper {...swiperOptions} className="theme_carousel owl-theme">
|
||||
<SwiperSlide className="award-block-two">
|
||||
<div className="image"><img src="/assets/assets/images/resource/award-4.png" alt="" /></div>
|
||||
<h4>Best consulting <br /> company</h4>
|
||||
</SwiperSlide>
|
||||
<SwiperSlide className="award-block-two">
|
||||
<div className="image"><img src="/assets/assets/images/resource/award-5.png" alt="" /></div>
|
||||
<h4>Best outsourcing <br /> advisors</h4>
|
||||
</SwiperSlide>
|
||||
<SwiperSlide className="award-block-two">
|
||||
<div className="image"><img src="/assets/assets/images/resource/award-6.png" alt="" /></div>
|
||||
<h4>Customer choice for <br /> support</h4>
|
||||
</SwiperSlide>
|
||||
<SwiperSlide className="award-block-two">
|
||||
<div className="image"><img src="/assets/assets/images/resource/award-7.png" alt="" /></div>
|
||||
<h4>Best consulting <br /> company</h4>
|
||||
</SwiperSlide>
|
||||
</Swiper> */}
|
||||
|
||||
|
||||
<Swiper {...swiperOptions} className="gallery-carousel ">
|
||||
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/1.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<a href="assets/images/gallery/1.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/2.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<a href="assets/images/gallery/2.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/3.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<a href="assets/images/gallery/3.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/4.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<a href="assets/images/gallery/4.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/5.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<a href="assets/images/gallery/5.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/1.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<a href="assets/images/gallery/1.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/2.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<a href="assets/images/gallery/2.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/3.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<a href="assets/images/gallery/3.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/4.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<a href="assets/images/gallery/4.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
{/* Gallery Block */}
|
||||
<SwiperSlide>
|
||||
<div className="gallery-block">
|
||||
<div className="inner-box">
|
||||
<figure className="image-box">
|
||||
<img src="assets/images/gallery/5.jpg" alt=""/>
|
||||
{/* Overlay Box */}
|
||||
<div className="overlay-box">
|
||||
<div className="overlay-inner">
|
||||
<div className="content">
|
||||
<a href="assets/images/gallery/5.jpg" data-fancybox="gallery" data-caption="" className="icon flaticon-plus"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
</Swiper>
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
7
jsconfig.json
Normal file
7
jsconfig.json
Normal file
@ -0,0 +1,7 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"paths": {
|
||||
"@/*": ["./*"]
|
||||
}
|
||||
}
|
||||
}
|
||||
20
lib/font.js
Normal file
20
lib/font.js
Normal file
@ -0,0 +1,20 @@
|
||||
import { Niconne, Poppins, Tangerine } from 'next/font/google'
|
||||
|
||||
export const niconne = Niconne({
|
||||
weight: ['400'],
|
||||
subsets: ['latin'],
|
||||
variable: "--niconne",
|
||||
display: 'swap',
|
||||
})
|
||||
export const poppins = Poppins({
|
||||
weight: ['400', '500', '600', '700'],
|
||||
subsets: ['latin'],
|
||||
variable: "--poppins",
|
||||
display: 'swap',
|
||||
})
|
||||
export const tangerine = Tangerine({
|
||||
weight: ['400', '700'],
|
||||
subsets: ['latin'],
|
||||
variable: "--tangerine",
|
||||
display: 'swap',
|
||||
})
|
||||
4
next.config.js
Normal file
4
next.config.js
Normal file
@ -0,0 +1,4 @@
|
||||
/** @type {import('next').NextConfig} */
|
||||
const nextConfig = {}
|
||||
|
||||
module.exports = nextConfig
|
||||
1130
package-lock.json
generated
Normal file
1130
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
23
package.json
Normal file
23
package.json
Normal file
@ -0,0 +1,23 @@
|
||||
{
|
||||
"name": "start-app-dir",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev",
|
||||
"build": "next build",
|
||||
"start": "next start",
|
||||
"lint": "next lint",
|
||||
"sass": "sass --watch public/assets/scss/main.scss:public/assets/css/main.css"
|
||||
},
|
||||
"dependencies": {
|
||||
"isotope-layout": "^3.0.6",
|
||||
"next": "13.4.19",
|
||||
"react": "18.2.0",
|
||||
"react-curved-text": "^2.0.2",
|
||||
"react-dom": "18.2.0",
|
||||
"react-modal-video": "^2.0.1",
|
||||
"sass": "^1.66.1",
|
||||
"swiper": "^10.2.0",
|
||||
"wowjs": "^1.1.3"
|
||||
}
|
||||
}
|
||||
234
public/assets/css/flaticon.css
Normal file
234
public/assets/css/flaticon.css
Normal file
@ -0,0 +1,234 @@
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'flaticon';
|
||||
src: url("../fonts/flaticon.eot");
|
||||
src: url("../fonts/flaticond41d.eot?#iefix") format("embedded-opentype"),
|
||||
url("../fonts/flaticon.woff") format("woff"),
|
||||
url("../fonts/flaticon.ttf") format("truetype"),
|
||||
url("../fonts/flaticon.svg#Flaticon") format("svg");
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-display: block;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
[class^="flaticon-"],
|
||||
[class*=" flaticon-"] {
|
||||
font-family: 'flaticon' !important;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
line-height: 1;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.flaticon-24-hours:before { content: "\f100"; }
|
||||
.flaticon-open-book:before { content: "\f101"; }
|
||||
.flaticon-home:before { content: "\f102"; }
|
||||
.flaticon-quote:before { content: "\f103"; }
|
||||
.flaticon-placeholder:before { content: "\f104"; }
|
||||
.flaticon-placeholder-filled-point:before { content: "\f105"; }
|
||||
.flaticon-telephone:before { content: "\f106"; }
|
||||
.flaticon-phone-call:before { content: "\f107"; }
|
||||
.flaticon-comment:before { content: "\f108"; }
|
||||
.flaticon-timetable:before { content: "\f109"; }
|
||||
.flaticon-unlink:before { content: "\f10a"; }
|
||||
.flaticon-play-arrow:before { content: "\f10b"; }
|
||||
.flaticon-portfolio:before { content: "\f10c"; }
|
||||
.flaticon-money-bag:before { content: "\f10d"; }
|
||||
.flaticon-portfolio-1:before { content: "\f10e"; }
|
||||
.flaticon-award:before { content: "\f10f"; }
|
||||
.flaticon-winner:before { content: "\f110"; }
|
||||
.flaticon-trophy:before { content: "\f111"; }
|
||||
.flaticon-magnifying-glass:before { content: "\f112"; }
|
||||
.flaticon-menu:before { content: "\f113"; }
|
||||
.flaticon-shopping-cart-1:before { content: "\f114"; }
|
||||
.flaticon-shopping-cart-2:before { content: "\f115"; }
|
||||
.flaticon-back:before { content: "\f116"; }
|
||||
.flaticon-back-arrow:before { content: "\f117"; }
|
||||
.flaticon-growth:before { content: "\f118"; }
|
||||
.flaticon-target:before { content: "\f119"; }
|
||||
.flaticon-settings:before { content: "\f11a"; }
|
||||
.flaticon-avatar:before { content: "\f11b"; }
|
||||
.flaticon-share:before { content: "\f11c"; }
|
||||
.flaticon-heart:before { content: "\f11d"; }
|
||||
.flaticon-like:before { content: "\f11e"; }
|
||||
.flaticon-star:before { content: "\f11f"; }
|
||||
.flaticon-headphones:before { content: "\f120"; }
|
||||
.flaticon-garbage:before { content: "\f121"; }
|
||||
.flaticon-internet:before { content: "\f122"; }
|
||||
.flaticon-network:before { content: "\f123"; }
|
||||
.flaticon-shopping-cart-3:before { content: "\f124"; }
|
||||
.flaticon-email:before { content: "\f125"; }
|
||||
.flaticon-message:before { content: "\f126"; }
|
||||
.flaticon-full-screen:before { content: "\f127"; }
|
||||
.flaticon-send:before { content: "\f128"; }
|
||||
.flaticon-tick-inside-circle:before { content: "\f129"; }
|
||||
.flaticon-monitor-1:before { content: "\f12a"; }
|
||||
.flaticon-lock:before { content: "\f12b"; }
|
||||
.flaticon-eye:before { content: "\f12c"; }
|
||||
.flaticon-rocket-ship:before { content: "\f12d"; }
|
||||
.flaticon-headphones-1:before { content: "\f12e"; }
|
||||
.flaticon-pin:before { content: "\f12f"; }
|
||||
.flaticon-stopwatch:before { content: "\f130"; }
|
||||
.flaticon-email-1:before { content: "\f131"; }
|
||||
.flaticon-crown:before { content: "\f132"; }
|
||||
.flaticon-multiply:before { content: "\f133"; }
|
||||
.flaticon-media-play-symbol:before { content: "\f134"; }
|
||||
.flaticon-arrow-pointing-to-right:before { content: "\f135"; }
|
||||
.flaticon-back-1:before { content: "\f136"; }
|
||||
.flaticon-award-1:before { content: "\f137"; }
|
||||
.flaticon-pdf:before { content: "\f138"; }
|
||||
.flaticon-loupe:before { content: "\f139"; }
|
||||
.flaticon-link:before { content: "\f13a"; }
|
||||
.flaticon-user:before { content: "\f13b"; }
|
||||
.flaticon-trophy-1:before { content: "\f13c"; }
|
||||
.flaticon-house:before { content: "\f13d"; }
|
||||
.flaticon-bar-chart:before { content: "\f13e"; }
|
||||
.flaticon-coin:before { content: "\f13f"; }
|
||||
.flaticon-line-chart:before { content: "\f140"; }
|
||||
.flaticon-planet-earth:before { content: "\f141"; }
|
||||
.flaticon-pie-chart:before { content: "\f142"; }
|
||||
.flaticon-megaphone:before { content: "\f143"; }
|
||||
.flaticon-quote-1:before { content: "\f144"; }
|
||||
.flaticon-cloud:before { content: "\f145"; }
|
||||
.flaticon-wheel:before { content: "\f146"; }
|
||||
.flaticon-shopping-bag:before { content: "\f147"; }
|
||||
.flaticon-menu-1:before { content: "\f148"; }
|
||||
.flaticon-big-anchor:before { content: "\f149"; }
|
||||
.flaticon-flash:before { content: "\f14a"; }
|
||||
.flaticon-add:before { content: "\f14b"; }
|
||||
.flaticon-increase-size-option:before { content: "\f14c"; }
|
||||
.flaticon-double-angle-pointing-to-right:before { content: "\f14d"; }
|
||||
.flaticon-long-arrow-pointing-to-left:before { content: "\f14e"; }
|
||||
.flaticon-long-arrow-pointing-to-the-right:before { content: "\f14f"; }
|
||||
.flaticon-gallery:before { content: "\f150"; }
|
||||
.flaticon-right-arrow:before { content: "\f151"; }
|
||||
.flaticon-right-arrow-forward:before { content: "\f152"; }
|
||||
.flaticon-success:before { content: "\f153"; }
|
||||
.flaticon-paper-plane:before { content: "\f154"; }
|
||||
.flaticon-high-volume:before { content: "\f155"; }
|
||||
.flaticon-left-arrow:before { content: "\f156"; }
|
||||
.flaticon-go-back-left-arrow:before { content: "\f157"; }
|
||||
.flaticon-file:before { content: "\f158"; }
|
||||
.flaticon-share-symbol:before { content: "\f159"; }
|
||||
.flaticon-favourites-filled-star-symbol:before { content: "\f15a"; }
|
||||
.flaticon-star-1:before { content: "\f15b"; }
|
||||
.flaticon-gift:before { content: "\f15c"; }
|
||||
.flaticon-tick:before { content: "\f15d"; }
|
||||
.flaticon-email-2:before { content: "\f15e"; }
|
||||
.flaticon-placeholder-1:before { content: "\f15f"; }
|
||||
.flaticon-up-arrow:before { content: "\f160"; }
|
||||
.flaticon-angle-arrow-down:before { content: "\f161"; }
|
||||
.flaticon-right-arrow-1:before { content: "\f162"; }
|
||||
.flaticon-left-arrow-1:before { content: "\f163"; }
|
||||
.flaticon-placeholder-2:before { content: "\f164"; }
|
||||
.flaticon-24-hours-phone-service:before { content: "\f165"; }
|
||||
.flaticon-home-page:before { content: "\f166"; }
|
||||
.flaticon-safe:before { content: "\f167"; }
|
||||
.flaticon-zoom-increasing-symbol:before { content: "\f168"; }
|
||||
.flaticon-folder:before { content: "\f169"; }
|
||||
.flaticon-comment-1:before { content: "\f16a"; }
|
||||
.flaticon-paper-plane-1:before { content: "\f16b"; }
|
||||
.flaticon-24-hours-1:before { content: "\f16c"; }
|
||||
.flaticon-edit:before { content: "\f16d"; }
|
||||
.flaticon-clock:before { content: "\f16e"; }
|
||||
.flaticon-hand:before { content: "\f16f"; }
|
||||
.flaticon-plus-symbol:before { content: "\f170"; }
|
||||
.flaticon-substract:before { content: "\f171"; }
|
||||
.flaticon-pdf-file-format-symbol:before { content: "\f172"; }
|
||||
.flaticon-edit-1:before { content: "\f173"; }
|
||||
.flaticon-user-1:before { content: "\f174"; }
|
||||
.flaticon-hand-shake:before { content: "\f175"; }
|
||||
.flaticon-startup:before { content: "\f176"; }
|
||||
.flaticon-checked:before { content: "\f177"; }
|
||||
.flaticon-email-3:before { content: "\f178"; }
|
||||
.flaticon-24-hours-3:before { content: "\f179"; }
|
||||
.flaticon-menu-2:before { content: "\f17a"; }
|
||||
.flaticon-menu-3:before { content: "\f17b"; }
|
||||
.flaticon-search:before { content: "\f17c"; }
|
||||
.flaticon-plus:before { content: "\f17d"; }
|
||||
.flaticon-maps-and-flags:before { content: "\f17e"; }
|
||||
.flaticon-email-4:before { content: "\f17f"; }
|
||||
.flaticon-user-2:before { content: "\f180"; }
|
||||
.flaticon-user-3:before { content: "\f181"; }
|
||||
.flaticon-home-1:before { content: "\f182"; }
|
||||
.flaticon-home-2:before { content: "\f183"; }
|
||||
.flaticon-shopping-cart-4:before { content: "\f184"; }
|
||||
.flaticon-bar-chart-1:before { content: "\f185"; }
|
||||
.flaticon-suitcase:before { content: "\f186"; }
|
||||
.flaticon-shopping-bag-1:before { content: "\f187"; }
|
||||
.flaticon-world:before { content: "\f188"; }
|
||||
.flaticon-agreement:before { content: "\f189"; }
|
||||
.flaticon-up-arrow-1:before { content: "\f18a"; }
|
||||
.flaticon-right-arrow-2:before { content: "\f18b"; }
|
||||
.flaticon-left-arrow-2:before { content: "\f18c"; }
|
||||
.flaticon-call:before { content: "\f18d"; }
|
||||
.flaticon-envelope:before { content: "\f18e"; }
|
||||
.flaticon-diamond:before { content: "\f18f"; }
|
||||
.flaticon-heart-1:before { content: "\f190"; }
|
||||
.flaticon-down-arrow:before { content: "\f191"; }
|
||||
.flaticon-support:before { content: "\f192"; }
|
||||
.flaticon-sketch:before { content: "\f193"; }
|
||||
.flaticon-comment-2:before { content: "\f194"; }
|
||||
.flaticon-chat:before { content: "\f195"; }
|
||||
.flaticon-right-quote-sign:before { content: "\f196"; }
|
||||
.flaticon-quotation-mark:before { content: "\f197"; }
|
||||
.flaticon-blocks-with-angled-cuts:before { content: "\f198"; }
|
||||
.flaticon-straight-quotes:before { content: "\f199"; }
|
||||
.flaticon-percentage:before { content: "\f19a"; }
|
||||
.flaticon-left-arrow-3:before { content: "\f19b"; }
|
||||
.flaticon-right-arrow-3:before { content: "\f19c"; }
|
||||
.flaticon-down-arrow-1:before { content: "\f19d"; }
|
||||
.flaticon-wallet:before { content: "\f19e"; }
|
||||
.flaticon-reward:before { content: "\f19f"; }
|
||||
.flaticon-shopping-cart:before { content: "\f1a0"; }
|
||||
.flaticon-technical-support:before { content: "\f1a1"; }
|
||||
.flaticon-responsive:before { content: "\f1a2"; }
|
||||
.flaticon-monitor:before { content: "\f1a3"; }
|
||||
.flaticon-coding:before { content: "\f1a4"; }
|
||||
.flaticon-laptop:before { content: "\f1a5"; }
|
||||
.flaticon-coding-1:before { content: "\f1a6"; }
|
||||
.flaticon-mobile-app:before { content: "\f1a7"; }
|
||||
.flaticon-computer:before { content: "\f1a8"; }
|
||||
.flaticon-web:before { content: "\f1a9"; }
|
||||
.flaticon-monitor-2:before { content: "\f1aa"; }
|
||||
.flaticon-human-resources:before { content: "\f1ab"; }
|
||||
.flaticon-coding-2:before { content: "\f1ac"; }
|
||||
.flaticon-android:before { content: "\f1ad"; }
|
||||
.flaticon-apple:before { content: "\f1ae"; }
|
||||
.flaticon-iot:before { content: "\f1af"; }
|
||||
.flaticon-smartband:before { content: "\f1b0"; }
|
||||
.flaticon-tv:before { content: "\f1b1"; }
|
||||
.flaticon-html:before { content: "\f1b2"; }
|
||||
.flaticon-bootstrap:before { content: "\f1b3"; }
|
||||
.flaticon-css:before { content: "\f1b4"; }
|
||||
.flaticon-php:before { content: "\f1b5"; }
|
||||
.flaticon-java:before { content: "\f1b6"; }
|
||||
.flaticon-dashboard:before { content: "\f1b7"; }
|
||||
.flaticon-coding-3:before { content: "\f1b8"; }
|
||||
.flaticon-design:before { content: "\f1b9"; }
|
||||
.flaticon-web-browser:before { content: "\f1ba"; }
|
||||
.flaticon-network-1:before { content: "\f1bb"; }
|
||||
.flaticon-24-hours-2:before { content: "\f1bc"; }
|
||||
.flaticon-seo:before { content: "\f1bd"; }
|
||||
.flaticon-web-programming:before { content: "\f1be"; }
|
||||
.flaticon-web-1:before { content: "\f1bf"; }
|
||||
.flaticon-designer:before { content: "\f1c0"; }
|
||||
.flaticon-designer-1:before { content: "\f1c1"; }
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
1805
public/assets/css/font-awesome.css
vendored
Normal file
1805
public/assets/css/font-awesome.css
vendored
Normal file
File diff suppressed because it is too large
Load Diff
666
public/assets/css/global.css
Normal file
666
public/assets/css/global.css
Normal file
@ -0,0 +1,666 @@
|
||||
/* Globex HTML Template */
|
||||
|
||||
/************ TABLE OF CONTENTS ***************
|
||||
1. Fonts
|
||||
2. Reset
|
||||
3. Global
|
||||
4. Main Header / Style Two / Style Three
|
||||
5. Banner Section / Two / Two
|
||||
6. Juice Section
|
||||
7. Beverage Section
|
||||
8. Deal Section
|
||||
9. Recipe Section / Two
|
||||
10. Fluid Section One / Two
|
||||
11. Testimonial Section
|
||||
12. News Section / Two / Three
|
||||
13. Gallery Section / Two
|
||||
14. Main Footer / Two / Three
|
||||
15. Specials Section
|
||||
16. Location Section
|
||||
17. Menus Section
|
||||
18. History Section
|
||||
19. Contact Section
|
||||
20. Newsletter Section
|
||||
21. Instagram Post Section
|
||||
22. Video Section
|
||||
23. About News Section
|
||||
24. Popular Recipe Section
|
||||
25. Page Title Section
|
||||
26. Staff Section
|
||||
27. Team Section
|
||||
28. Restaurant Section
|
||||
29. Menu Section
|
||||
30. Video Section
|
||||
31. Milk Shake Section
|
||||
32. Frape Section
|
||||
33. Boba Tea Section
|
||||
34. Slushy Section
|
||||
35. Blog Classic
|
||||
36. Blog Widgets Section
|
||||
37. Blog Detail
|
||||
38. Not Found
|
||||
39. Contact Form Section
|
||||
40. Map Section
|
||||
|
||||
**********************************************/
|
||||
|
||||
/*
|
||||
font-family: 'Niconne', cursive;
|
||||
font-family: 'Poppins', sans-ser if;
|
||||
font-family: 'Tangerine', cursive;
|
||||
*/
|
||||
|
||||
/***
|
||||
|
||||
====================================================================
|
||||
Reset
|
||||
====================================================================
|
||||
|
||||
***/
|
||||
|
||||
* {
|
||||
margin:0px;
|
||||
padding:0px;
|
||||
border:none;
|
||||
outline:none;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'LillyBelle';
|
||||
src:
|
||||
url("../fonts/LillyBelle.woff") format("woff"),
|
||||
url("../fonts/LillyBelle.ttf") format("truetype");
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
/***
|
||||
|
||||
====================================================================
|
||||
Global Settings
|
||||
====================================================================
|
||||
|
||||
***/
|
||||
|
||||
body {
|
||||
font-size:14px;
|
||||
color:#777777;
|
||||
line-height:1.7em;
|
||||
font-weight:400;
|
||||
background:#ffffff;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-font-smoothing: antialiased;
|
||||
font-family: var(--poppins);
|
||||
}
|
||||
|
||||
.bordered-layout .page-wrapper{
|
||||
padding:0px 50px 0px;
|
||||
}
|
||||
|
||||
a{
|
||||
text-decoration:none;
|
||||
cursor:pointer;
|
||||
color:#de9190;
|
||||
}
|
||||
|
||||
button,
|
||||
a:hover,a:focus,a:visited{
|
||||
text-decoration:none;
|
||||
outline:none !important;
|
||||
}
|
||||
|
||||
h1,h2,h3,h4,h5,h6 {
|
||||
position:relative;
|
||||
font-weight:normal;
|
||||
margin:0px;
|
||||
background:none;
|
||||
line-height:1.6em;
|
||||
font-family: var(--poppins);
|
||||
}
|
||||
|
||||
input,button,select,textarea{
|
||||
font-family: var(--poppins);
|
||||
}
|
||||
|
||||
textarea{
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.text{
|
||||
position:relative;
|
||||
line-height:1.9em;
|
||||
font-family: var(--poppins);
|
||||
}
|
||||
|
||||
p{
|
||||
position:relative;
|
||||
line-height:1.8em;
|
||||
font-family: var(--poppins);
|
||||
}
|
||||
|
||||
/* Typography */
|
||||
|
||||
h1{
|
||||
font-size:112px;
|
||||
}
|
||||
|
||||
h2{
|
||||
position:relative;
|
||||
font-size:48px;
|
||||
line-height:1.3em;
|
||||
}
|
||||
|
||||
h3{
|
||||
position:relative;
|
||||
font-size:30px;
|
||||
line-height:1.3em;
|
||||
}
|
||||
|
||||
h4{
|
||||
position:relative;
|
||||
font-size:24px;
|
||||
line-height:1.3em;
|
||||
font-weight:700;
|
||||
}
|
||||
|
||||
h5{
|
||||
font-size:20px;
|
||||
}
|
||||
|
||||
h6{
|
||||
font-size:18px;
|
||||
}
|
||||
|
||||
.auto-container{
|
||||
position:static;
|
||||
max-width:1200px;
|
||||
padding:0px 15px;
|
||||
margin:0 auto;
|
||||
}
|
||||
|
||||
.medium-container{
|
||||
max-width:850px;
|
||||
}
|
||||
|
||||
.page-wrapper{
|
||||
position:relative;
|
||||
margin:0 auto;
|
||||
width:100%;
|
||||
min-width:300px;
|
||||
}
|
||||
|
||||
ul,li{
|
||||
list-style:none;
|
||||
padding:0px;
|
||||
margin:0px;
|
||||
}
|
||||
|
||||
img{
|
||||
display:inline-block;
|
||||
max-width:100%;
|
||||
}
|
||||
|
||||
.theme-btn{
|
||||
position:relative;
|
||||
cursor:pointer;
|
||||
display:inline-block;
|
||||
transition:all 0.3s ease;
|
||||
-moz-transition:all 0.3s ease;
|
||||
-webkit-transition:all 0.3s ease;
|
||||
-ms-transition:all 0.3s ease;
|
||||
-o-transition:all 0.3s ease;
|
||||
}
|
||||
|
||||
.centered{
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
/***
|
||||
|
||||
====================================================================
|
||||
Scroll To Top style
|
||||
====================================================================
|
||||
|
||||
***/
|
||||
|
||||
.scroll-to-top{
|
||||
position:fixed;
|
||||
bottom:15px;
|
||||
right:15px;
|
||||
width:40px;
|
||||
height:40px;
|
||||
color:#de9190;
|
||||
font-size:13px;
|
||||
text-transform:uppercase;
|
||||
line-height:38px;
|
||||
text-align:center;
|
||||
z-index:100;
|
||||
cursor:pointer;
|
||||
background:#ffffff;
|
||||
display:none;
|
||||
border-radius:50px;
|
||||
box-shadow:0px 0px 10px rgba(0,0,0,0.15);
|
||||
-webkit-transition:all 300ms ease;
|
||||
-ms-transition:all 300ms ease;
|
||||
-o-transition:all 300ms ease;
|
||||
-moz-transition:all 300ms ease;
|
||||
transition:all 300ms ease;
|
||||
}
|
||||
|
||||
.scroll-to-top:hover{
|
||||
color:#ffffff;
|
||||
background:#de9190;
|
||||
}
|
||||
|
||||
/* List Style One */
|
||||
|
||||
.list-style-one{
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.list-style-one li{
|
||||
position:relative;
|
||||
color:#ffffff;
|
||||
font-size:16px;
|
||||
padding-left:30px;
|
||||
font-weight:400;
|
||||
line-height:1.6em;
|
||||
margin-bottom:20px;
|
||||
}
|
||||
|
||||
.list-style-one li .icon{
|
||||
position:absolute;
|
||||
left:0px;
|
||||
top:5px;
|
||||
color:#de9190;
|
||||
font-size:18px;
|
||||
line-height:1em;
|
||||
font-weight:300;
|
||||
-webkit-transition:all 300ms ease;
|
||||
-moz-transition:all 300ms ease;
|
||||
-ms-transition:all 300ms ease;
|
||||
-o-transition:all 300ms ease;
|
||||
transition:all 300ms ease;
|
||||
}
|
||||
|
||||
/* List Style Two */
|
||||
|
||||
.list-style-two{
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.list-style-two li{
|
||||
position:relative;
|
||||
color:#505056;
|
||||
font-size:16px;
|
||||
padding-left:30px;
|
||||
font-weight:600;
|
||||
line-height:1.6em;
|
||||
margin-bottom:15px;
|
||||
}
|
||||
|
||||
.list-style-two li:before{
|
||||
position:absolute;
|
||||
content: "\f15d";
|
||||
left:0px;
|
||||
top:5px;
|
||||
color:#f7a392;
|
||||
font-size:16px;
|
||||
line-height:1em;
|
||||
font-family: "Flaticon";
|
||||
-webkit-transition:all 300ms ease;
|
||||
-moz-transition:all 300ms ease;
|
||||
-ms-transition:all 300ms ease;
|
||||
-o-transition:all 300ms ease;
|
||||
transition:all 300ms ease;
|
||||
}
|
||||
|
||||
/*Btn Style One*/
|
||||
|
||||
.btn-style-one{
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
line-height: 50px;
|
||||
color: #ffffff;
|
||||
padding: 11px 30px;
|
||||
font-weight: 500;
|
||||
overflow:hidden;
|
||||
overflow: hidden;
|
||||
border-radius: 50px;
|
||||
background-color:#de9190;
|
||||
padding:7px 35px 6px 7px;
|
||||
text-transform: capitalize;
|
||||
font-family: var(--poppins);
|
||||
}
|
||||
|
||||
.btn-style-one .icon{
|
||||
position:relative;
|
||||
width:48px;
|
||||
height:48px;
|
||||
line-height:48px;
|
||||
border-radius:50%;
|
||||
text-align:center;
|
||||
float:left;
|
||||
margin-right:22px;
|
||||
-webkit-transition:all 300ms ease;
|
||||
-moz-transition:all 300ms ease;
|
||||
-ms-transition:all 300ms ease;
|
||||
-o-transition:all 300ms ease;
|
||||
transition:all 300ms ease;
|
||||
background:#ffffff url(../images/icons/btn-icon.png) no-repeat;
|
||||
}
|
||||
|
||||
.btn-style-one:hover{
|
||||
color: #ffffff;
|
||||
background-color:#91ad41;
|
||||
}
|
||||
|
||||
/* Btn Style Two */
|
||||
|
||||
.btn-style-two{
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
line-height: 49px;
|
||||
color: #27272f;
|
||||
font-weight: 500;
|
||||
overflow:hidden;
|
||||
overflow: hidden;
|
||||
border-radius: 50px;
|
||||
border:1px solid #de9190;
|
||||
padding:7px 35px 5px 7px;
|
||||
text-transform: capitalize;
|
||||
font-family: var(--poppins);
|
||||
}
|
||||
|
||||
.btn-style-two .icon{
|
||||
position:relative;
|
||||
width:48px;
|
||||
height:48px;
|
||||
line-height:48px;
|
||||
border-radius:50%;
|
||||
text-align:center;
|
||||
float:left;
|
||||
margin-right:22px;
|
||||
-webkit-transition:all 300ms ease;
|
||||
-moz-transition:all 300ms ease;
|
||||
-ms-transition:all 300ms ease;
|
||||
-o-transition:all 300ms ease;
|
||||
transition:all 300ms ease;
|
||||
background:#de9190 url(../images/icons/btn-icon-1.png) no-repeat;
|
||||
}
|
||||
|
||||
.btn-style-two:hover .icon{
|
||||
background-color:#111111;
|
||||
}
|
||||
|
||||
.btn-style-two:hover{
|
||||
color: #ffffff;
|
||||
background-color:#de9190;
|
||||
}
|
||||
|
||||
/* Btn Style Three */
|
||||
|
||||
.btn-style-three{
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
line-height: 50px;
|
||||
color: #de9190;
|
||||
padding: 11px 30px;
|
||||
font-weight: 500;
|
||||
overflow:hidden;
|
||||
overflow: hidden;
|
||||
border-radius: 50px;
|
||||
background-color:#ffffff;
|
||||
padding:7px 35px 6px 7px;
|
||||
text-transform: capitalize;
|
||||
font-family: var(--poppins);
|
||||
}
|
||||
|
||||
.btn-style-three .icon{
|
||||
position:relative;
|
||||
width:48px;
|
||||
height:48px;
|
||||
line-height:48px;
|
||||
border-radius:50%;
|
||||
text-align:center;
|
||||
float:left;
|
||||
margin-right:22px;
|
||||
-webkit-transition:all 300ms ease;
|
||||
-moz-transition:all 300ms ease;
|
||||
-ms-transition:all 300ms ease;
|
||||
-o-transition:all 300ms ease;
|
||||
transition:all 300ms ease;
|
||||
background:#de9190 url(../images/icons/btn-icon-1.png) no-repeat;
|
||||
}
|
||||
|
||||
.btn-style-three:hover .icon{
|
||||
background-color:#111111;
|
||||
}
|
||||
|
||||
.btn-style-three:hover{
|
||||
color: #ffffff;
|
||||
background-color:#de9190;
|
||||
}
|
||||
|
||||
/* Btn Style Four */
|
||||
|
||||
.btn-style-four{
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
line-height: 50px;
|
||||
color: #ffffff;
|
||||
padding: 11px 30px;
|
||||
font-weight: 500;
|
||||
overflow:hidden;
|
||||
overflow: hidden;
|
||||
border-radius: 50px;
|
||||
background-color:#5dca89;
|
||||
padding:7px 35px 6px 7px;
|
||||
text-transform: capitalize;
|
||||
font-family: var(--poppins);
|
||||
}
|
||||
|
||||
.btn-style-four .icon{
|
||||
position:relative;
|
||||
width:48px;
|
||||
height:48px;
|
||||
line-height:48px;
|
||||
border-radius:50%;
|
||||
text-align:center;
|
||||
float:left;
|
||||
color:#f7a392;
|
||||
margin-right:22px;
|
||||
-webkit-transition:all 300ms ease;
|
||||
-moz-transition:all 300ms ease;
|
||||
-ms-transition:all 300ms ease;
|
||||
-o-transition:all 300ms ease;
|
||||
transition:all 300ms ease;
|
||||
background-color:#f5f5f5;
|
||||
}
|
||||
|
||||
.btn-style-four:hover .icon{
|
||||
background-color:#111111;
|
||||
}
|
||||
|
||||
.btn-style-four:hover{
|
||||
color: #ffffff;
|
||||
background-color:#de9190;
|
||||
}
|
||||
|
||||
/* Social Icon One */
|
||||
|
||||
.social-icon-one{
|
||||
position: relative;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.social-icon-one .title{
|
||||
position: relative;
|
||||
font-size: 20px;
|
||||
line-height: 26px;
|
||||
color: #ffffff;
|
||||
font-weight: 700;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.social-icon-one li{
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
color: #ffffff;
|
||||
margin-right: 22px;
|
||||
}
|
||||
|
||||
.social-icon-one li:last-child{
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.social-icon-one li a{
|
||||
position: relative;
|
||||
display: block;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
color: #ffffff;
|
||||
-webkit-transition: all 300ms ease;
|
||||
-moz-transition: all 300ms ease;
|
||||
-ms-transition: all 300ms ease;
|
||||
-o-transition: all 300ms ease;
|
||||
transition: all 300ms ease;
|
||||
}
|
||||
|
||||
.social-icon-one li a:hover{
|
||||
color: #de9190;
|
||||
}
|
||||
|
||||
.theme_color{
|
||||
color:#de9190;
|
||||
}
|
||||
|
||||
.preloader{ position:fixed; left:0px; top:0px; width:100%; height:100%; z-index:999999; background-color:#ffffff; background-position:center center; background-repeat:no-repeat; background-image:url(../images/icons/preloader.svg); background-size:100px; }
|
||||
|
||||
img{
|
||||
display:inline-block;
|
||||
max-width:100%;
|
||||
height:auto;
|
||||
}
|
||||
|
||||
/***
|
||||
|
||||
====================================================================
|
||||
Section Title
|
||||
====================================================================
|
||||
|
||||
***/
|
||||
|
||||
.sec-title{
|
||||
position:relative;
|
||||
margin-bottom:45px;
|
||||
}
|
||||
|
||||
.sec-title .title{
|
||||
position:relative;
|
||||
color:#beb996;
|
||||
font-size:24px;
|
||||
font-weight:400;
|
||||
letter-spacing:2px;
|
||||
text-transform:capitalize;
|
||||
font-family: var(--niconne);
|
||||
}
|
||||
|
||||
.sec-title h2{
|
||||
color:#27272f;
|
||||
font-weight: 600;
|
||||
line-height: 1.3em;
|
||||
margin-top:8px;
|
||||
}
|
||||
|
||||
.sec-title .separate{
|
||||
position:relative;
|
||||
width:70px;
|
||||
height:22px;
|
||||
margin-top:10px !important;
|
||||
background:url(../images/icons/separate.png) no-repeat;
|
||||
}
|
||||
|
||||
.sec-title.centered .separate{
|
||||
margin:0 auto;
|
||||
}
|
||||
|
||||
.sec-title .text{
|
||||
color:#5e5e5e;
|
||||
font-weight: 400;
|
||||
margin-top:22px;
|
||||
font-size:16px;
|
||||
}
|
||||
|
||||
.sec-title.light .text,
|
||||
.sec-title.light .title,
|
||||
.sec-title.light h2{
|
||||
color:#ffffff;
|
||||
}
|
||||
|
||||
.sec-title.centered{
|
||||
text-align: center !important;
|
||||
}
|
||||
|
||||
/***
|
||||
|
||||
====================================================================
|
||||
Section Title Two
|
||||
====================================================================
|
||||
|
||||
***/
|
||||
|
||||
.sec-title-two{
|
||||
position:relative;
|
||||
margin-bottom:60px;
|
||||
}
|
||||
|
||||
.sec-title-two .title{
|
||||
position:relative;
|
||||
color:#de9190;
|
||||
font-size:18px;
|
||||
font-weight:400;
|
||||
letter-spacing:2px;
|
||||
text-transform:capitalize;
|
||||
font-family: 'Niconne', cursive;
|
||||
}
|
||||
|
||||
.sec-title-two h4{
|
||||
color:#27272f;
|
||||
font-weight: 600;
|
||||
line-height: 1.3em;
|
||||
margin-top:10px;
|
||||
text-transform:uppercase;
|
||||
}
|
||||
|
||||
.sec-title-two .separator{
|
||||
position:relative;
|
||||
width:370px;
|
||||
height:10px;
|
||||
margin-top:15px !important;
|
||||
border-top:1px dashed #acacac;
|
||||
border-bottom:1px dashed #acacac;
|
||||
}
|
||||
|
||||
.sec-title-two.centered .separator{
|
||||
margin:0 auto;
|
||||
}
|
||||
|
||||
.sec-title-two .text{
|
||||
color:#5e5e5e;
|
||||
font-weight: 400;
|
||||
margin-top:22px;
|
||||
font-size:14px;
|
||||
}
|
||||
|
||||
.sec-title-two.light .text,
|
||||
.sec-title-two.light .title,
|
||||
.sec-title-two.light h2{
|
||||
color:#ffffff;
|
||||
}
|
||||
|
||||
.sec-title-two.centered{
|
||||
text-align: center !important;
|
||||
}
|
||||
1240
public/assets/css/header.css
Normal file
1240
public/assets/css/header.css
Normal file
File diff suppressed because it is too large
Load Diff
43
public/assets/css/owl.css
Normal file
43
public/assets/css/owl.css
Normal file
File diff suppressed because one or more lines are too long
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user