Introduction
First of all, Thank you so much for purchasing this template and for being my loyal customer. You are awesome!. You are entitled to get free lifetime updates to this product + exceptional support from the author directly.
Etiam rhoncus lacus consequat, euismod leo et, efficitur odio. Nam pulvinar neque eget mollis tempor. Integer augue lacus, egestas vel justo non, consequat pellentesque sem. Donec suscipit erat ut ante pharetra, sit amet venenatis lectus pharetra. Donec a rutrum purus. Integer ac leo non lorem tristique sollicitudin.
- Item Name:
- Item Version :
- Author Name:
- License :
Etiam rhoncus : lacus consequat, euismod leo et, efficitur odio. Nam pulvinar neque eget mollis tempor. Integer augue lacus, egestas vel justo non, consequat pellentesque sem. Donec suscipit erat ut ante pharetra, sit amet venenatis lectus pharetra. Donec a rutrum purus. Integer ac leo non lorem tristique sollicitudin.
Full Features
- 2 Unique Home Pages and Unique Inner Pages
- Multi-Purpose Design
- Build with Bootstrap v5 and SCSS
- Unlimited variant image
- Modern & Clean Design
- Sticky Header
- Smooth Scroll
- Google Fonts
- Fully Responsive to all devices
- Cross browser compatible
- Developer Friendly Coding
- Very Well Documented
- 180+ Reusable Component Blocks
- Built with Latest React v17+
- React Hooks
- Free Updates
React Features
- JSX
- React Hooks
- Components
- Data Binding
- Virtual DOM
- Simplicity
- Performance
HTML Structure
<!doctype html>
<html lang="en">
<head>
<---Required meta tags --->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<---Bootstrap CSS --->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3"
crossorigin="anonymous">
<title>Hello, world !</title>
</head>
</html>
If you would like to edit the color, font, or style of any elements in one of these columns, you would do the following :
.text-contain h3 { color: #some_color; }
If you find that your new style is not overriding, it is most likely because of a specificity problem. Scroll down in your CSS file and make sure that there isn’t a similar style that has more weight.
.service-area .text-contain h3 { color: #some_color; }
So, to ensure that your new styles are applied, make sure that they carry enough “weight” and that there isn’t a style lower in the CSS file that is being applied after yours.
CSS Files and Structure
This theme imports many Css files:
- jquery.fancybox.min.css
- jquery-ui.css
- swiper.css
- flaticon.css
- bootstrap-icons.css
- bootstrap.min.css
- style.css
- responsive.css
Proin turpis sapien, accumsan nec aliquam at, laoreet id erat. Pellentesque id consequat neque. Viva mus eget nunc porta, fringilla ex in, vestibulum mi. Donec sit amet turpis eget ex luctus laoreet. Nullam quis lacus ipsum. Nullam in congue libero.
The second file contains all of the specific stylings for the page. The file is separated into sections using
/*=========================== 1. Global CSS
============================*/
some code
/*=========================== 2.Bootstrap CSS
============================*/
some code
/*=========================== 3.Top Bar CSS
============================*/
some code, etc.
If you would like to edit a specific section of the site, simply find the appropriate label in the CSS file, and then scroll down until you find the appropriate style that needs to be edited.
JavaScript
This theme imports many Javascript files and TypeScript Files:
- jquery-3.6.0.min.js
- bootstrap.bundle.min.js
- jquery-ui.min.js
- popper.min.js
- swiper.js
- jquery.fancybox.min.js
// ==== Loading Page ==== //
$(window).on('load', function () {
'use strict';
$('body .loading-screen').fadeOut(1000);
$('html').css('overflow-y', 'visible');
}); // This function is used to hide the loading section
JavaScript Most of the animation in this site is carried out from the customs scripts. There are a few functions worth looking over.
Sources and Credits
I’ve used the following images, icons or other files as listed :
01. Images
- SRC 1: https://www.pexels.com/
- SRC 2: http://www.freepik.com/
02. CSS Files
- Bootstrap V5: https://getbootstrap.com/…
- Bootstrap icons: https://icons.getbootstrap.com
- Swiper: https://swiperjs.com/
03. JavaScript Files
- bootstrap.min.js: https://getbootstrap.com/
- jquery-3.6.0.min.js: https://jquery.com/
- popper.js: https://popper.js.org/
- fancybox js: http://fancybox.net/
- Swiper js: http://fancybox.net/
04. Fonts
- Maven+Pro: https://fonts.googleapis.com/css2?family=Maven+Pro
- Jost : https://fonts.googleapis.com/css2?family=Jost:ital
Image Hotspots Widget
FAQs
Frequently asked questions and answers.
01. Articles
- Maven+Pro: https://fonts.googleapis.com/css2?family=Maven+Pro
- Jost : https://fonts.googleapis.com/css2?family=Jost:ital
Morbi aliquam quis quam in luctus. Nullam tincidunt pulvinar imperdiet. Sed varius, diam vitae posuere semper, libero ex hendrerit nunc, ac sagittis eros metus ut diam. Donec a nibh in libero maximus vehicula. Etiam sit amet condimentum erat. Pellentesque ultrices sagittis turpis, quis tempus ante viverra et.Morbi aliquam quis quam in luctus. Nullam tincidunt pulvinar imperdiet. Sed varius, diam vitae posuere semper, tincidunt pulvinar imperdiet. Sed varius, diam vitae posuere semper.
Morbi aliquam quis quam in luctus. Nullam tincidunt pulvinar imperdiet. Sed varius, diam vitae posuere semper, libero ex hendrerit nunc, ac sagittis eros metus ut diam. Donec a nibh in libero maximus vehicula. Etiam sit amet condimentum erat. Pellentesque ultrices sagittis turpis, quis tempus ante viverra et.Morbi aliquam quis quam in luctus. Nullam tincidunt pulvinar imperdiet. Sed varius, diam vitae posuere semper, tincidunt pulvinar imperdiet. Sed varius, diam vitae posuere semper.
Morbi aliquam quis quam in luctus. Nullam tincidunt pulvinar imperdiet. Sed varius, diam vitae posuere semper, libero ex hendrerit nunc, ac sagittis eros metus ut diam. Donec a nibh in libero maximus vehicula. Etiam sit amet condimentum erat. Pellentesque ultrices sagittis turpis, quis tempus ante viverra et.Morbi aliquam quis quam in luctus. Nullam tincidunt pulvinar imperdiet. Sed varius, diam vitae posuere semper, tincidunt pulvinar imperdiet. Sed varius, diam vitae posuere semper.
Morbi aliquam quis quam in luctus. Nullam tincidunt pulvinar imperdiet. Sed varius, diam vitae posuere semper, libero ex hendrerit nunc, ac sagittis eros metus ut diam. Donec a nibh in libero maximus vehicula. Etiam sit amet condimentum erat. Pellentesque ultrices sagittis turpis, quis tempus ante viverra et.Morbi aliquam quis quam in luctus. Nullam tincidunt pulvinar imperdiet. Sed varius, diam vitae posuere semper, tincidunt pulvinar imperdiet. Sed varius, diam vitae posuere semper.
