Ajmal Cybro
4 years ago
127 changed files with 15432 additions and 0 deletions
@ -0,0 +1,41 @@ |
|||||
|
Theme Fuge |
||||
|
========== |
||||
|
* Design Web Pages with Theme Fuge |
||||
|
|
||||
|
Installation |
||||
|
============ |
||||
|
- www.odoo.com/documentation/15.0/setup/install.html |
||||
|
- Install our custom addon |
||||
|
|
||||
|
License |
||||
|
------- |
||||
|
General Public License, Version 3 (LGPL v3). |
||||
|
(https://www.odoo.com/documentation/user/15.0/legal/licenses/licenses.html) |
||||
|
|
||||
|
Company |
||||
|
------- |
||||
|
* `Cybrosys Techno Solutions <https://cybrosys.com/>`__ |
||||
|
|
||||
|
Credits |
||||
|
------- |
||||
|
* Developer: |
||||
|
Alvin Francis @ cybrosys |
||||
|
|
||||
|
Contacts |
||||
|
-------- |
||||
|
* Mail Contact : odoo@cybrosys.com |
||||
|
|
||||
|
Bug Tracker |
||||
|
----------- |
||||
|
Bugs are tracked on GitHub Issues. In case of trouble, please check there if your issue has already been reported. |
||||
|
|
||||
|
Maintainer |
||||
|
========== |
||||
|
This module is maintained by Cybrosys Technologies. |
||||
|
|
||||
|
For support and more information, please visit https://www.cybrosys.com |
||||
|
|
||||
|
Further information |
||||
|
=================== |
||||
|
HTML Description: `<static/description/index.html>`__ |
||||
|
|
||||
@ -0,0 +1,4 @@ |
|||||
|
# -*- coding: utf-8 -*- |
||||
|
from . import controllers |
||||
|
from . import models |
||||
|
|
||||
@ -0,0 +1,71 @@ |
|||||
|
# -*- coding: utf-8 -*- |
||||
|
############################################################################# |
||||
|
# |
||||
|
# Cybrosys Technologies Pvt. Ltd. |
||||
|
# |
||||
|
# Copyright (C) 2021-TODAY Cybrosys Technologies(<https://www.cybrosys.com>) |
||||
|
# Author: Cybrosys Techno Solutions(<https://www.cybrosys.com>) |
||||
|
# |
||||
|
# You can modify it under the terms of the GNU LESSER |
||||
|
# GENERAL PUBLIC LICENSE (LGPL v3), Version 3. |
||||
|
# |
||||
|
# This program is distributed in the hope that it will be useful, |
||||
|
# but WITHOUT ANY WARRANTY; without even the implied warranty of |
||||
|
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
||||
|
# GNU LESSER GENERAL PUBLIC LICENSE (LGPL v3) for more details. |
||||
|
# |
||||
|
# You should have received a copy of the GNU LESSER GENERAL PUBLIC LICENSE |
||||
|
# (LGPL v3) along with this program. |
||||
|
# If not, see <http://www.gnu.org/licenses/>. |
||||
|
# |
||||
|
############################################################################# |
||||
|
{ |
||||
|
'name': 'Theme Fuge', |
||||
|
'description': 'Theme Fuge is an attractive and modern eCommerce Website theme', |
||||
|
'summary': 'Design Web Pages with theme fuge', |
||||
|
'category': 'Theme/eCommerce', |
||||
|
'version': '15.0.1.0.0', |
||||
|
'author': 'Cybrosys Techno Solutions', |
||||
|
'company': 'Cybrosys Techno Solutions', |
||||
|
'maintainer': 'Cybrosys Techno Solutions', |
||||
|
'website': "https://www.cybrosys.com", |
||||
|
'depends': ['website', 'website_sale_wishlist', 'website_blog'], |
||||
|
'data': [ |
||||
|
'views/views.xml', |
||||
|
'views/shop_view.xml', |
||||
|
'views/shop_sidebar_view.xml', |
||||
|
'views/product_view.xml', |
||||
|
'views/blog.xml', |
||||
|
'views/popular_posts.xml', |
||||
|
'views/blog_details.xml', |
||||
|
'views/about.xml', |
||||
|
'views/contact.xml', |
||||
|
'views/header.xml', |
||||
|
'views/footer.xml', |
||||
|
'views/snippets/banner.xml', |
||||
|
'views/snippets/shop_with_us.xml', |
||||
|
'views/snippets/offer_men.xml', |
||||
|
'views/snippets/offer_women.xml', |
||||
|
'views/snippets/product_section.xml', |
||||
|
'views/snippets/latest_blogs.xml', |
||||
|
'views/snippets/customer_review.xml', |
||||
|
'views/snippets/subscribe.xml', |
||||
|
], |
||||
|
'images': [ |
||||
|
'static/description/banner.png', |
||||
|
'static/description/theme_screenshot.gif', |
||||
|
], |
||||
|
'installable': True, |
||||
|
'application': True, |
||||
|
'auto_install': False, |
||||
|
'assets': { |
||||
|
'web.assets_frontend': [ |
||||
|
'theme_fuge/static/src/css/style.css', |
||||
|
'theme_fuge/static/src/css/owl.carousel.min.css', |
||||
|
'theme_fuge/static/src/css/owl.theme.default.min.css', |
||||
|
'theme_fuge/static/src/js/product.js', |
||||
|
'theme_fuge/static/src/js/scroll_navbar.js', |
||||
|
], |
||||
|
}, |
||||
|
'license': 'LGPL-3', |
||||
|
} |
||||
@ -0,0 +1,25 @@ |
|||||
|
# -*- coding: utf-8 -*- |
||||
|
############################################################################# |
||||
|
# |
||||
|
# Cybrosys Technologies Pvt. Ltd. |
||||
|
# |
||||
|
# Copyright (C) 2021-TODAY Cybrosys Technologies(<https://www.cybrosys.com>) |
||||
|
# Author: Cybrosys Techno Solutions(<https://www.cybrosys.com>) |
||||
|
# |
||||
|
# You can modify it under the terms of the GNU LESSER |
||||
|
# GENERAL PUBLIC LICENSE (LGPL v3), Version 3. |
||||
|
# |
||||
|
# This program is distributed in the hope that it will be useful, |
||||
|
# but WITHOUT ANY WARRANTY; without even the implied warranty of |
||||
|
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
||||
|
# GNU LESSER GENERAL PUBLIC LICENSE (LGPL v3) for more details. |
||||
|
# |
||||
|
# You should have received a copy of the GNU LESSER GENERAL PUBLIC LICENSE |
||||
|
# (LGPL v3) along with this program. |
||||
|
# If not, see <http://www.gnu.org/licenses/>. |
||||
|
# |
||||
|
############################################################################# |
||||
|
|
||||
|
from . import main |
||||
|
from . import popular_post |
||||
|
|
||||
@ -0,0 +1,59 @@ |
|||||
|
# -*- coding: utf-8 -*- |
||||
|
############################################################################# |
||||
|
# |
||||
|
# Cybrosys Technologies Pvt. Ltd. |
||||
|
# |
||||
|
# Copyright (C) 2021-TODAY Cybrosys Technologies(<https://www.cybrosys.com>) |
||||
|
# Author: Cybrosys Techno Solutions(<https://www.cybrosys.com>) |
||||
|
# |
||||
|
# You can modify it under the terms of the GNU LESSER |
||||
|
# GENERAL PUBLIC LICENSE (LGPL v3), Version 3. |
||||
|
# |
||||
|
# This program is distributed in the hope that it will be useful, |
||||
|
# but WITHOUT ANY WARRANTY; without even the implied warranty of |
||||
|
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
||||
|
# GNU LESSER GENERAL PUBLIC LICENSE (LGPL v3) for more details. |
||||
|
# |
||||
|
# You should have received a copy of the GNU LESSER GENERAL PUBLIC LICENSE |
||||
|
# (LGPL v3) along with this program. |
||||
|
# If not, see <http://www.gnu.org/licenses/>. |
||||
|
# |
||||
|
############################################################################# |
||||
|
|
||||
|
from odoo import http, fields |
||||
|
from odoo.http import request |
||||
|
|
||||
|
|
||||
|
class MainProduct(http.Controller): |
||||
|
|
||||
|
@http.route('/get_main_product', auth="public", type='json', |
||||
|
website=True) |
||||
|
def get_main_product(self): |
||||
|
main_products = request.env['product.template'].sudo().search( |
||||
|
[('website_published', '=', True)], |
||||
|
order='create_date asc', limit=8) |
||||
|
|
||||
|
values = { |
||||
|
'main_products': main_products, |
||||
|
} |
||||
|
response = http.Response(template='theme_fuge.product_section', |
||||
|
qcontext=values) |
||||
|
return response.render() |
||||
|
|
||||
|
|
||||
|
class WebsiteBlog(http.Controller): |
||||
|
|
||||
|
@http.route('/get_blog_post', auth="public", type='json', |
||||
|
website=True) |
||||
|
def get_blog_post(self): |
||||
|
posts = request.env['blog.post'].sudo().search( |
||||
|
[('website_published', '=', True), |
||||
|
('post_date', '<=', fields.Datetime.now())], |
||||
|
order='published_date desc', limit=4) |
||||
|
|
||||
|
values = { |
||||
|
'posts_recent': posts, |
||||
|
} |
||||
|
response = http.Response(template='theme_fuge.latest_blog', |
||||
|
qcontext=values) |
||||
|
return response.render() |
||||
@ -0,0 +1,68 @@ |
|||||
|
# -*- coding: utf-8 -*- |
||||
|
############################################################################# |
||||
|
# |
||||
|
# Cybrosys Technologies Pvt. Ltd. |
||||
|
# |
||||
|
# Copyright (C) 2021-TODAY Cybrosys Technologies(<https://www.cybrosys.com>) |
||||
|
# Author: Cybrosys Techno Solutions(<https://www.cybrosys.com>) |
||||
|
# |
||||
|
# You can modify it under the terms of the GNU LESSER |
||||
|
# GENERAL PUBLIC LICENSE (LGPL v3), Version 3. |
||||
|
# |
||||
|
# This program is distributed in the hope that it will be useful, |
||||
|
# but WITHOUT ANY WARRANTY; without even the implied warranty of |
||||
|
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
||||
|
# GNU LESSER GENERAL PUBLIC LICENSE (LGPL v3) for more details. |
||||
|
# |
||||
|
# You should have received a copy of the GNU LESSER GENERAL PUBLIC LICENSE |
||||
|
# (LGPL v3) along with this program. |
||||
|
# If not, see <http://www.gnu.org/licenses/>. |
||||
|
# |
||||
|
############################################################################# |
||||
|
|
||||
|
from odoo import http, fields |
||||
|
from odoo.http import request |
||||
|
from odoo.osv import expression |
||||
|
from odoo.addons.website_blog.controllers.main import WebsiteBlog |
||||
|
|
||||
|
|
||||
|
class WebsiteBlogInherit(WebsiteBlog): |
||||
|
|
||||
|
@http.route([ |
||||
|
'/blog', |
||||
|
'/blog/page/<int:page>', |
||||
|
'/blog/tag/<string:tag>', |
||||
|
'/blog/tag/<string:tag>/page/<int:page>', |
||||
|
'''/blog/<model("blog.blog"):blog>''', |
||||
|
'''/blog/<model("blog.blog"):blog>/page/<int:page>''', |
||||
|
'''/blog/<model("blog.blog"):blog>/tag/<string:tag>''', |
||||
|
'''/blog/<model("blog.blog"):blog>/tag/<string:tag>/page/<int:page>''', |
||||
|
], type='http', auth="public", website=True, sitemap=True) |
||||
|
def blog(self, blog=None, tag=None, page=1, search=None, **opt): |
||||
|
limit = 3 |
||||
|
order = 'published_date desc' |
||||
|
dom = expression.AND([ |
||||
|
[('website_published', '=', True), ('post_date', '<=', fields.Datetime.now())], |
||||
|
request.website.website_domain() |
||||
|
]) |
||||
|
posts = request.env['blog.post'].search(dom, limit=limit, order=order) |
||||
|
res = super(WebsiteBlogInherit, self).blog(blog=blog, tag=tag, page=1, search=search, **opt) |
||||
|
res.qcontext.update({'posts_popular': posts}) |
||||
|
return res |
||||
|
|
||||
|
@http.route(['''/blog/<model("blog.blog"):blog>/<model("blog.post", "[('blog_id','=',blog.id)]"):blog_post>''',], |
||||
|
type='http', auth="public", website=True, sitemap=True) |
||||
|
def blog_post(self, blog, blog_post, tag_id=None, page=1, |
||||
|
enable_editor=None, **post): |
||||
|
limit = 3 |
||||
|
order = 'published_date desc' |
||||
|
dom = expression.AND([ |
||||
|
[('website_published', '=', True), |
||||
|
('post_date', '<=', fields.Datetime.now())], |
||||
|
request.website.website_domain() |
||||
|
]) |
||||
|
posts = request.env['blog.post'].search(dom, limit=limit, order=order) |
||||
|
res = super(WebsiteBlogInherit, self).blog_post(blog, blog_post, tag_id=tag_id, page=1, |
||||
|
enable_editor=None, **post) |
||||
|
res.qcontext.update({'posts_popular': posts}) |
||||
|
return res |
||||
@ -0,0 +1,6 @@ |
|||||
|
## Module <theme_fuge> |
||||
|
|
||||
|
#### 06.11.2021 |
||||
|
#### Version 15.0.1.0.0 |
||||
|
#### ADD |
||||
|
- Initial commit for Theme Fuge |
||||
@ -0,0 +1,24 @@ |
|||||
|
# -*- coding: utf-8 -*- |
||||
|
############################################################################# |
||||
|
# |
||||
|
# Cybrosys Technologies Pvt. Ltd. |
||||
|
# |
||||
|
# Copyright (C) 2021-TODAY Cybrosys Technologies(<https://www.cybrosys.com>) |
||||
|
# Author: Cybrosys Techno Solutions(<https://www.cybrosys.com>) |
||||
|
# |
||||
|
# You can modify it under the terms of the GNU LESSER |
||||
|
# GENERAL PUBLIC LICENSE (LGPL v3), Version 3. |
||||
|
# |
||||
|
# This program is distributed in the hope that it will be useful, |
||||
|
# but WITHOUT ANY WARRANTY; without even the implied warranty of |
||||
|
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
||||
|
# GNU LESSER GENERAL PUBLIC LICENSE (LGPL v3) for more details. |
||||
|
# |
||||
|
# You should have received a copy of the GNU LESSER GENERAL PUBLIC LICENSE |
||||
|
# (LGPL v3) along with this program. |
||||
|
# If not, see <http://www.gnu.org/licenses/>. |
||||
|
# |
||||
|
############################################################################# |
||||
|
from . import theme_fuge |
||||
|
|
||||
|
|
||||
@ -0,0 +1,33 @@ |
|||||
|
# -*- coding: utf-8 -*- |
||||
|
############################################################################# |
||||
|
# |
||||
|
# Cybrosys Technologies Pvt. Ltd. |
||||
|
# |
||||
|
# Copyright (C) 2021-TODAY Cybrosys Technologies(<https://www.cybrosys.com>) |
||||
|
# Author: Cybrosys Techno Solutions(<https://www.cybrosys.com>) |
||||
|
# |
||||
|
# You can modify it under the terms of the GNU LESSER |
||||
|
# GENERAL PUBLIC LICENSE (LGPL v3), Version 3. |
||||
|
# |
||||
|
# This program is distributed in the hope that it will be useful, |
||||
|
# but WITHOUT ANY WARRANTY; without even the implied warranty of |
||||
|
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
||||
|
# GNU LESSER GENERAL PUBLIC LICENSE (LGPL v3) for more details. |
||||
|
# |
||||
|
# You should have received a copy of the GNU LESSER GENERAL PUBLIC LICENSE |
||||
|
# (LGPL v3) along with this program. |
||||
|
# If not, see <http://www.gnu.org/licenses/>. |
||||
|
# |
||||
|
############################################################################# |
||||
|
from odoo import models |
||||
|
|
||||
|
|
||||
|
class FugeTheme(models.AbstractModel): |
||||
|
_inherit = 'theme.utils' |
||||
|
|
||||
|
def _fuge_theme_post_copy(self, mod): |
||||
|
self.enable_view('website_blog.opt_blog_sidebar_show') |
||||
|
self.enable_view('website_blog.opt_blog_list_view') |
||||
|
self.disable_view('website_blog.opt_posts_loop_show_author') |
||||
|
self.disable_view('website_sale.add_grid_or_list_option') |
||||
|
self.disable_view('website_sale.products_list_view') |
||||
|
After Width: | Height: | Size: 1.9 MiB |
|
After Width: | Height: | Size: 31 KiB |
|
After Width: | Height: | Size: 109 KiB |
|
After Width: | Height: | Size: 3.7 MiB |
|
After Width: | Height: | Size: 1.6 MiB |
|
After Width: | Height: | Size: 135 KiB |
|
After Width: | Height: | Size: 145 KiB |
|
After Width: | Height: | Size: 96 KiB |
|
After Width: | Height: | Size: 132 KiB |
|
After Width: | Height: | Size: 138 KiB |
|
After Width: | Height: | Size: 51 KiB |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 28 KiB |
|
After Width: | Height: | Size: 346 KiB |
|
After Width: | Height: | Size: 371 KiB |
|
After Width: | Height: | Size: 350 KiB |
|
After Width: | Height: | Size: 490 KiB |
|
After Width: | Height: | Size: 377 KiB |
|
After Width: | Height: | Size: 357 KiB |
|
After Width: | Height: | Size: 156 KiB |
|
After Width: | Height: | Size: 137 KiB |
@ -0,0 +1,323 @@ |
|||||
|
<!-- Hero Section --> |
||||
|
<div class="container pt-4 mt-4 rounded" style="background-color: #fff; font-family: Montserrat, 'sans-serif';"> |
||||
|
<div class="row"> |
||||
|
<div class="col-lg-12 mb-4"> |
||||
|
<img src="images/Cybrosys.png" alt="Cybrosys Logo" style="width: 120px; height: auto;"> |
||||
|
<hr style="border-color: #e1e5e9;" /> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="row"> |
||||
|
<div class="col-lg-12 text-center"> |
||||
|
<img src="images/hero.png" width=60% height="auto" class="mb-4" alt="Theme Screenshot"> |
||||
|
</div> |
||||
|
<div class="col-lg-12 text-center"> |
||||
|
<h1 class="mt-4">Fugestore</h1> |
||||
|
<p class="lead mb-4" style="max-width: 700px; margin: 0 auto;"> |
||||
|
Fugestore is a new kind of Theme. The theme is a very user-friendly and is suitable for your |
||||
|
eCommerce website with blog. |
||||
|
It is the most powerful, easy to use theme. Many custom designed snippets facilitates to add |
||||
|
better |
||||
|
user experience. |
||||
|
Contains Hot sales, New arrival and Deal of the week with Counter snippets that are configured |
||||
|
from |
||||
|
the backend. |
||||
|
It have instagram feed snippet and deal of the week snippet with counter. |
||||
|
It is a fully Responsive Theme with a premium design and attractive front-end theme. |
||||
|
it contains price filter and brand filter options by default and it easily configure from |
||||
|
backend. |
||||
|
This theme is a perfect choice for your online store you are looking for. This theme is fully |
||||
|
customized |
||||
|
the eCommerce website, shop view, custom categories view, product view, contact us page, cart, |
||||
|
blog, |
||||
|
blog preview...etc. |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<!-- End of Hero Section --> |
||||
|
|
||||
|
<!-- Alternate Section --> |
||||
|
<div class="row p-4"> |
||||
|
<div class="col-lg-6 px-4" style="margin-top: 100px;"> |
||||
|
<h2>Desktop View</h2> |
||||
|
<p class="lead"> |
||||
|
It is easy to customize and use. Just drag and drop the building blocks to make attractive |
||||
|
webpages. |
||||
|
</p> |
||||
|
</div> |
||||
|
<div class="col-lg-6 px-4"> |
||||
|
<img style="border-radius: 0.5em;" src="images/laptop-screenshots.jpg" width="90%" height="auto" |
||||
|
class="mb-4 shadow-sm" alt="Theme Screenshot"> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="row p-4"> |
||||
|
<div class="col-lg-6 px-4"> |
||||
|
<img style="border-radius: 0.5em;" src="images/phone-screenshots.jpg" width="90%" height="auto" |
||||
|
class="mb-4 shadow-sm" alt="Theme Screenshot"> |
||||
|
</div> |
||||
|
<div class="col-lg-6 px-4" style="margin-top: 100px;"> |
||||
|
<h2>Mobile View</h2> |
||||
|
<p class="lead"> |
||||
|
User friendly and modern looking theme makes your page more Stylish And Beautiful. |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- End of Alternate Section --> |
||||
|
|
||||
|
<!-- Two Columns Section --> |
||||
|
<div class="row p-4"> |
||||
|
<!-- Column 1 --> |
||||
|
<div class="col-lg-6"> |
||||
|
<div class="row"> |
||||
|
<div class="col-lg-12"> |
||||
|
<img style="border-radius: 0.5em;" src="images/1.jpg" width="100%" height="auto" |
||||
|
class="mb-4 shadow-sm" alt="Theme Screenshot"> |
||||
|
</div> |
||||
|
<div class="col-lg-12 mt-4"> |
||||
|
<h2 class="text-center">Home Page</h2> |
||||
|
<p class="lead text-center"> |
||||
|
It is easy to customize and use. Just drag and drop the building blocks to make |
||||
|
attractive |
||||
|
webpages.Customizable building blocks in home page design helps you to edit them as per |
||||
|
needs. </p> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- End of Column 1 --> |
||||
|
|
||||
|
<!-- Column 2 --> |
||||
|
<div class="col-lg-6"> |
||||
|
<div class="row"> |
||||
|
<div class="col-lg-12"> |
||||
|
<img style="border-radius: 0.5em;" src="images/4.jpg" width="100%" height="auto" |
||||
|
class="mb-4 shadow-sm" alt="Theme Screenshot"> |
||||
|
</div> |
||||
|
<div class="col-lg-12 mt-4"> |
||||
|
<h2 class="text-center">Shop Page</h2> |
||||
|
<p class="lead text-center"> |
||||
|
The shop display you products in a stylish way. It displaying 3 products in a row and it |
||||
|
will attract your customers. |
||||
|
Also the Category side are customized in collapsible style. Display high quality images |
||||
|
for |
||||
|
your products |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- End of Column 2 --> |
||||
|
</div> |
||||
|
<!-- End of Two Columns Section --> |
||||
|
|
||||
|
|
||||
|
<!-- One Column Section --> |
||||
|
<div class="row p-4"> |
||||
|
<div class="col-lg-6"> |
||||
|
<img style="border-radius: 0.5em;" src="images/3.jpg" width="90%" height="auto" class="mb-4 shadow-sm" |
||||
|
alt="Theme Screenshot"> |
||||
|
</div> |
||||
|
<div class="col-lg-6" style="padding-top: 100px;"> |
||||
|
<h2>Overview</h2> |
||||
|
<p class="lead"> |
||||
|
It is an attractive and modern eCommerce Website theme. It make your eCommerce website is |
||||
|
attractive. |
||||
|
Just drag & drop the building blocks you need to easily build your layout. |
||||
|
Fugestore is a perfect choice for your online store you are looking for. |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- End of One Columns Section --> |
||||
|
|
||||
|
<!-- Three Columns Section --> |
||||
|
<div class="row p-4"> |
||||
|
<!-- Column 1 --> |
||||
|
<div class="col-lg-4"> |
||||
|
<div class="row"> |
||||
|
<div class="col-lg-12"> |
||||
|
<img style="border-radius: 0.5em;" src="images/12.jpg" width="100%" height="auto" |
||||
|
class="mb-4 shadow-sm" alt="Theme Screenshot"> |
||||
|
</div> |
||||
|
<div class="col-lg-12 mt-4"> |
||||
|
<h2 class="text-center">Cart</h2> |
||||
|
<p class="lead text-center"> |
||||
|
The cart display your products in a stylish way. it will display the all needed details |
||||
|
of |
||||
|
the product |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- End of Column 1 --> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<!-- Column 2 --> |
||||
|
<div class="col-lg-4"> |
||||
|
<div class="row"> |
||||
|
<div class="col-lg-12"> |
||||
|
<img style="border-radius: 0.5em;" src="images/2.jpg" width="100%" height="auto" |
||||
|
class="mb-4 shadow-sm" alt="Theme Screenshot"> |
||||
|
</div> |
||||
|
<div class="col-lg-12 mt-4"> |
||||
|
<h2 class="text-center">Blog Preview</h2> |
||||
|
<p class="lead text-center"> |
||||
|
Fugestore have a fully customized blog preview with big cover image of the blog with |
||||
|
share |
||||
|
buttons. |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- End of Column 2 --> |
||||
|
|
||||
|
|
||||
|
<!-- Column 4 --> |
||||
|
<div class="col-lg-4"> |
||||
|
<div class="row"> |
||||
|
<div class="col-lg-12"> |
||||
|
<img style="border-radius: 0.5em;" src="images/11.jpg" width="100%" height="auto" |
||||
|
class="mb-4 shadow-sm" alt="Theme Screenshot"> |
||||
|
</div> |
||||
|
<div class="col-lg-12 mt-4"> |
||||
|
<h2 class="text-center">Product Preview</h2> |
||||
|
<p class="lead text-center"> |
||||
|
It have a fully customized Product preview with full details of the product with an |
||||
|
attractive design. |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- End of Column 4 --> |
||||
|
</div> |
||||
|
<!-- End of Three Columns Section --> |
||||
|
|
||||
|
<!--<!– Video Section –>--> |
||||
|
<!--<div class="row p-4">--> |
||||
|
<!-- <div class="col-lg-12 d-flex flex-column justify-content-center">--> |
||||
|
<!-- <h4 class="mt-4 text-center">Video</h4>--> |
||||
|
<!-- <hr style="border-width: 3px; border-color: #0984e3; width: 100px;">--> |
||||
|
<!-- </div>--> |
||||
|
<!-- <div class="col-lg-12 d-flex justify-content-center mt-4">--> |
||||
|
<!-- <div class="s_panel_video" data-video-id="peAp2Tx_XIs?rel=0" style="cursor:pointer;">--> |
||||
|
<!-- <img class="img-fluid s_tooltip_tabs_tooltip_image s_figure_link pb0"--> |
||||
|
<!-- src="images/your-video-cover.jpg" alt="Cybrosys Cover Video" style="max-width:100%;">--> |
||||
|
<!-- </div>--> |
||||
|
<!-- </div>--> |
||||
|
<!--</div>--> |
||||
|
<!--<!– End of Video Section–>--> |
||||
|
|
||||
|
<!-- Demo Pages --> |
||||
|
<section class="oe_container"> |
||||
|
<div class="row" style="margin: 60px auto -30px;"> |
||||
|
<div class="col-lg-12 text-center"> |
||||
|
<h4 class="mt-4">Demo Pages</h4> |
||||
|
<hr style="border-width: 3px; border-color: #0984e3; width: 100px;"> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="row" style="margin: 40px auto; border-radius: 15px; padding: 38px;"> |
||||
|
<div class="col-sm-6 col-md-4 px-2"> |
||||
|
<div class="bg-white shadow overflow-hidden mb32" |
||||
|
style="border-radius: 15px; width: 300px; padding-bottom: 0; margin-right: 30px;"> |
||||
|
<img src="./images/demo-1.jpg" width="300px" height="auto"> |
||||
|
<h6 class="text-center my-3">Home</h6> |
||||
|
<hr style="border-width: 5px; border-color: #0984e3; width: 150px; margin-bottom: 0;"> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="col-sm-6 col-md-4 px-2"> |
||||
|
<div class="bg-white shadow overflow-hidden mb32" |
||||
|
style="border-radius: 15px; width: 300px; padding-bottom: 0;"> |
||||
|
<img src="./images/demo-2.jpg" width="300px" height="auto"> |
||||
|
<h6 class="text-center my-3">Blog Preview</h6> |
||||
|
<hr style="border-width: 5px; border-color: #05c46b; width: 150px; margin-bottom: 0;"> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="col-sm-6 col-md-4 px-2"> |
||||
|
<div class="bg-white shadow overflow-hidden mb32" |
||||
|
style="border-radius: 15px; width: 300px; padding-bottom: 0;"> |
||||
|
<img src="./images/demo-3.jpg" width="300px" height="auto"> |
||||
|
<h6 class="text-center my-3">Shop Page</h6> |
||||
|
<hr style="border-width: 5px; border-color: #f44f52; width: 150px; margin-bottom: 0;"> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="row d-flex justify-content-center" style="margin: 40px auto; border-radius: 15px; padding: 38px;"> |
||||
|
<div class="col-sm-6 col-md-4 px-2"> |
||||
|
<div class="bg-white shadow overflow-hidden mb32" |
||||
|
style="border-radius: 15px; width: 300px; padding-bottom: 0;"> |
||||
|
<img src="./images/demo-4.jpg" width="300px" height="auto"> |
||||
|
<h6 class="text-center my-3">Blog Page</h6> |
||||
|
<hr style="border-width: 5px; border-color: #ffa801; width: 150px; margin-bottom: 0;"> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="col-sm-6 col-md-4 px-2"> |
||||
|
<div class="bg-white shadow overflow-hidden mb32" |
||||
|
style="border-radius: 15px; width: 300px; padding-bottom: 0;"> |
||||
|
<img src="./images/demo-5.jpg" width="300px" height="auto"> |
||||
|
<h6 class="text-center my-3">About Page</h6> |
||||
|
<hr style="border-width: 5px; border-color: #3c40c6; width: 150px; margin-bottom: 0;"> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
</div> |
||||
|
</section> |
||||
|
<!-- End of Demo Pages --> |
||||
|
|
||||
|
<!-- Footer --> |
||||
|
<div class="row" style="margin-top: 4rem;"> |
||||
|
<div class="col-lg-12 text-center"> |
||||
|
<h2>Get Help</h2> |
||||
|
<hr style=" border: 2px solid #b22126; margin-top: 2px;" width="40px"> |
||||
|
<p class="text-center" style="max-width: 650px; margin: 0 auto;">If you have anything to share with |
||||
|
us |
||||
|
based |
||||
|
on |
||||
|
your use of this module, please let us know. We are ready to offer our support.</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="row"> |
||||
|
<div class="col px-4 pt-3 pb-2 shadow-sm" |
||||
|
style="background-color: #fff; max-width: 450px; border-radius: 0.5em; margin: 1em auto;"> |
||||
|
<div class="row"> |
||||
|
<div class="col-lg-8"> |
||||
|
<h6><a href="mailto:odoo@cybrosys.com" target="_blank" |
||||
|
style="color: #050505; text-decoration: none;"><i |
||||
|
class="fa fa-envelope mr-2"></i>odoo@cybrosys.com</a></h6> |
||||
|
</div> |
||||
|
<div class="col-lg-4 d-flex justify-content-end" style="position: relative;"> |
||||
|
<h6><a href="mailto:odoo@cybrosys.com" target="_blank" |
||||
|
style="color: #050505; text-decoration: none;"><i class="fa fa-chevron-right"></i></a> |
||||
|
</h6> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="row"> |
||||
|
<div class="col px-4 pt-3 pb-2 shadow-sm" |
||||
|
style="background-color: #fff; max-width: 450px; border-radius: 0.5em; margin: 1em auto;"> |
||||
|
<div class="row"> |
||||
|
<div class="col-lg-8"> |
||||
|
<h6><a href="https://www.cybrosys.com" target="_blank" |
||||
|
style="color: #050505; text-decoration: none;"><i |
||||
|
class="fa fa-globe mr-2"></i>www.cybrosys.com</a></h6> |
||||
|
</div> |
||||
|
<div class="col-lg-4 d-flex justify-content-end" style="position: relative;"> |
||||
|
<h6><a href="https://www.cybrosys.com" target="_blank" |
||||
|
style="color: #050505; text-decoration: none;"><i class="fa fa-chevron-right"></i></a> |
||||
|
</h6> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="row"> |
||||
|
<div class="col-lg-12 mt-4 mb-2 text-center"> |
||||
|
<p style="font-weight: bold">A Quality Theme From</p> |
||||
|
</div> |
||||
|
<div class="col-lg-12 text-center"> |
||||
|
<img src="images/cybro-logo-oca.png" width="80px" height="auto"> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- End of Footer --> |
||||
|
</div> |
||||
|
After Width: | Height: | Size: 228 KiB |
@ -0,0 +1,6 @@ |
|||||
|
/** |
||||
|
* Owl Carousel v2.3.4 |
||||
|
* Copyright 2013-2018 David Deutsch |
||||
|
* Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE |
||||
|
*/ |
||||
|
.owl-carousel,.owl-carousel .owl-item{-webkit-tap-highlight-color:transparent;position:relative}.owl-carousel{display:none;width:100%;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y;touch-action:manipulation;-moz-backface-visibility:hidden}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0,0,0)}.owl-carousel .owl-item,.owl-carousel .owl-wrapper{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)}.owl-carousel .owl-item{min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-touch-callout:none}.owl-carousel .owl-item img{display:block;width:100%}.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled{display:none}.no-js .owl-carousel,.owl-carousel.owl-loaded{display:flex}.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev{cursor:pointer;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel .owl-nav button.owl-next,.owl-carousel .owl-nav button.owl-prev,.owl-carousel button.owl-dot{background:0 0;color:inherit;border:none;padding:0!important;font:inherit}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel.owl-refresh .owl-item{visibility:hidden}.owl-carousel.owl-drag .owl-item{-ms-touch-action:pan-y;touch-action:pan-y;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-grab{cursor:move;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.owl-carousel .animated{animation-duration:1s;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{animation-name:fadeOut}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{transition:height .5s ease-in-out}.owl-carousel .owl-item .owl-lazy{opacity:0;transition:opacity .4s ease}.owl-carousel .owl-item .owl-lazy:not([src]),.owl-carousel .owl-item .owl-lazy[src^=""]{max-height:0}.owl-carousel .owl-item img.owl-lazy{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;transition:transform .1s ease}.owl-carousel .owl-video-play-icon:hover{-ms-transform:scale(1.3,1.3);transform:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;transition:opacity .4s ease}.owl-carousel .owl-video-frame{position:relative;z-index:1;height:100%;width:100%} |
||||
@ -0,0 +1,6 @@ |
|||||
|
/** |
||||
|
* Owl Carousel v2.3.4 |
||||
|
* Copyright 2013-2018 David Deutsch |
||||
|
* Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE |
||||
|
*/ |
||||
|
.owl-theme .owl-dots,.owl-theme .owl-nav{text-align:center;-webkit-tap-highlight-color:transparent}.owl-theme .owl-nav{margin-top:10px}.owl-theme .owl-nav [class*=owl-]{color:#FFF;font-size:14px;margin:5px;padding:4px 7px;background:#D6D6D6;display:inline-block;cursor:pointer;border-radius:3px}.owl-theme .owl-nav [class*=owl-]:hover{background:#869791;color:#FFF;text-decoration:none}.owl-theme .owl-nav .disabled{opacity:.5;cursor:default}.owl-theme .owl-nav.disabled+.owl-dots{margin-top:10px}.owl-theme .owl-dots .owl-dot{display:inline-block;zoom:1}.owl-theme .owl-dots .owl-dot span{width:10px;height:10px;margin:5px 7px;background:#D6D6D6;display:block;-webkit-backface-visibility:visible;transition:opacity .2s ease;border-radius:30px}.owl-theme .owl-dots .owl-dot.active span,.owl-theme .owl-dots .owl-dot:hover span{background:#869791} |
||||
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 215 KiB |
|
After Width: | Height: | Size: 215 KiB |
|
After Width: | Height: | Size: 568 KiB |
|
After Width: | Height: | Size: 159 KiB |
|
After Width: | Height: | Size: 237 KiB |
|
After Width: | Height: | Size: 34 KiB |
|
After Width: | Height: | Size: 35 KiB |
|
After Width: | Height: | Size: 41 KiB |
|
After Width: | Height: | Size: 32 KiB |
|
After Width: | Height: | Size: 9.4 KiB |
|
After Width: | Height: | Size: 8.1 KiB |
|
After Width: | Height: | Size: 271 KiB |
|
After Width: | Height: | Size: 268 KiB |
|
After Width: | Height: | Size: 486 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 18 KiB |
|
After Width: | Height: | Size: 3.1 KiB |
|
After Width: | Height: | Size: 8.0 KiB |
|
After Width: | Height: | Size: 398 KiB |
|
After Width: | Height: | Size: 486 KiB |
|
After Width: | Height: | Size: 4.4 KiB |
|
After Width: | Height: | Size: 1.1 MiB |
|
After Width: | Height: | Size: 1.1 MiB |
|
After Width: | Height: | Size: 182 KiB |
|
After Width: | Height: | Size: 215 KiB |
|
After Width: | Height: | Size: 159 KiB |
|
After Width: | Height: | Size: 35 KiB |
|
After Width: | Height: | Size: 27 KiB |
|
After Width: | Height: | Size: 175 KiB |
|
After Width: | Height: | Size: 186 KiB |
|
After Width: | Height: | Size: 120 KiB |
|
After Width: | Height: | Size: 5.5 KiB |
|
After Width: | Height: | Size: 32 KiB |
|
After Width: | Height: | Size: 7.8 KiB |
|
After Width: | Height: | Size: 26 KiB |
|
After Width: | Height: | Size: 24 KiB |
|
After Width: | Height: | Size: 10 MiB |
|
After Width: | Height: | Size: 398 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 25 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 186 KiB |
@ -0,0 +1,32 @@ |
|||||
|
odoo.define('theme_fuge.product', function(require){ |
||||
|
'use strict'; |
||||
|
|
||||
|
var Animation = require('website.content.snippets.animation'); |
||||
|
var ajax = require('web.ajax'); |
||||
|
|
||||
|
Animation.registry.get_blog_post = Animation.Class.extend({ |
||||
|
selector : '.blog', |
||||
|
start: function(){ |
||||
|
var self = this; |
||||
|
ajax.jsonRpc('/get_blog_post', 'call', {}) |
||||
|
.then(function (data) { |
||||
|
if(data){ |
||||
|
self.$target.empty().append(data); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
}); |
||||
|
|
||||
|
Animation.registry.get_main_product = Animation.Class.extend({ |
||||
|
selector : '.product', |
||||
|
start: function(){ |
||||
|
var self = this; |
||||
|
ajax.jsonRpc('/get_main_product', 'call', {}) |
||||
|
.then(function (data) { |
||||
|
if(data){ |
||||
|
self.$target.empty().append(data); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
}); |
||||
|
}); |
||||
@ -0,0 +1,5 @@ |
|||||
|
|
||||
|
$("#wrapwrap").on('scroll', function(){ |
||||
|
$('.navbar').css({"position":"static","top":"auto"}); |
||||
|
console.log('Event Fired'); |
||||
|
}); |
||||
@ -0,0 +1,350 @@ |
|||||
|
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ |
||||
|
|
||||
|
/* Document |
||||
|
========================================================================== */ |
||||
|
|
||||
|
/** |
||||
|
* 1. Correct the line height in all browsers. |
||||
|
* 2. Prevent adjustments of font size after orientation changes in iOS. |
||||
|
*/ |
||||
|
|
||||
|
html { |
||||
|
line-height: 1.15; /* 1 */ |
||||
|
-webkit-text-size-adjust: 100%; /* 2 */ |
||||
|
} |
||||
|
|
||||
|
/* Sections |
||||
|
========================================================================== */ |
||||
|
|
||||
|
/** |
||||
|
* Remove the margin in all browsers. |
||||
|
*/ |
||||
|
|
||||
|
body { |
||||
|
margin: 0; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Render the `main` element consistently in IE. |
||||
|
*/ |
||||
|
|
||||
|
main { |
||||
|
display: block; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Correct the font size and margin on `h1` elements within `section` and |
||||
|
* `article` contexts in Chrome, Firefox, and Safari. |
||||
|
*/ |
||||
|
|
||||
|
h1 { |
||||
|
font-size: 2em; |
||||
|
margin: 0.67em 0; |
||||
|
} |
||||
|
|
||||
|
/* Grouping content |
||||
|
========================================================================== */ |
||||
|
|
||||
|
/** |
||||
|
* 1. Add the correct box sizing in Firefox. |
||||
|
* 2. Show the overflow in Edge and IE. |
||||
|
*/ |
||||
|
|
||||
|
hr { |
||||
|
box-sizing: content-box; /* 1 */ |
||||
|
height: 0; /* 1 */ |
||||
|
overflow: visible; /* 2 */ |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* 1. Correct the inheritance and scaling of font size in all browsers. |
||||
|
* 2. Correct the odd `em` font sizing in all browsers. |
||||
|
*/ |
||||
|
|
||||
|
pre { |
||||
|
font-family: monospace, monospace; /* 1 */ |
||||
|
font-size: 1em; /* 2 */ |
||||
|
} |
||||
|
|
||||
|
/* Text-level semantics |
||||
|
========================================================================== */ |
||||
|
|
||||
|
/** |
||||
|
* Remove the gray background on active links in IE 10. |
||||
|
*/ |
||||
|
|
||||
|
a { |
||||
|
background-color: transparent; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* 1. Remove the bottom border in Chrome 57- |
||||
|
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. |
||||
|
*/ |
||||
|
|
||||
|
abbr[title] { |
||||
|
border-bottom: none; /* 1 */ |
||||
|
text-decoration: underline; /* 2 */ |
||||
|
text-decoration: underline dotted; /* 2 */ |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Add the correct font weight in Chrome, Edge, and Safari. |
||||
|
*/ |
||||
|
|
||||
|
b, |
||||
|
strong { |
||||
|
font-weight: bolder; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* 1. Correct the inheritance and scaling of font size in all browsers. |
||||
|
* 2. Correct the odd `em` font sizing in all browsers. |
||||
|
*/ |
||||
|
|
||||
|
code, |
||||
|
kbd, |
||||
|
samp { |
||||
|
font-family: monospace, monospace; /* 1 */ |
||||
|
font-size: 1em; /* 2 */ |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Add the correct font size in all browsers. |
||||
|
*/ |
||||
|
|
||||
|
small { |
||||
|
font-size: 80%; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Prevent `sub` and `sup` elements from affecting the line height in |
||||
|
* all browsers. |
||||
|
*/ |
||||
|
|
||||
|
sub, |
||||
|
sup { |
||||
|
font-size: 75%; |
||||
|
line-height: 0; |
||||
|
position: relative; |
||||
|
vertical-align: baseline; |
||||
|
} |
||||
|
|
||||
|
sub { |
||||
|
bottom: -0.25em; |
||||
|
} |
||||
|
|
||||
|
sup { |
||||
|
top: -0.5em; |
||||
|
} |
||||
|
|
||||
|
/* Embedded content |
||||
|
========================================================================== */ |
||||
|
|
||||
|
/** |
||||
|
* Remove the border on images inside links in IE 10. |
||||
|
*/ |
||||
|
|
||||
|
img { |
||||
|
border-style: none; |
||||
|
} |
||||
|
|
||||
|
/* Forms |
||||
|
========================================================================== */ |
||||
|
|
||||
|
/** |
||||
|
* 1. Change the font styles in all browsers. |
||||
|
* 2. Remove the margin in Firefox and Safari. |
||||
|
*/ |
||||
|
|
||||
|
button, |
||||
|
input, |
||||
|
optgroup, |
||||
|
select, |
||||
|
textarea { |
||||
|
font-family: inherit; /* 1 */ |
||||
|
font-size: 100%; /* 1 */ |
||||
|
line-height: 1.15; /* 1 */ |
||||
|
margin: 0; /* 2 */ |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Show the overflow in IE. |
||||
|
* 1. Show the overflow in Edge. |
||||
|
*/ |
||||
|
|
||||
|
button, |
||||
|
input { /* 1 */ |
||||
|
overflow: visible; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Remove the inheritance of text transform in Edge, Firefox, and IE. |
||||
|
* 1. Remove the inheritance of text transform in Firefox. |
||||
|
*/ |
||||
|
|
||||
|
button, |
||||
|
select { /* 1 */ |
||||
|
text-transform: none; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Correct the inability to style clickable types in iOS and Safari. |
||||
|
*/ |
||||
|
|
||||
|
button, |
||||
|
[type="button"], |
||||
|
[type="reset"], |
||||
|
[type="submit"] { |
||||
|
-webkit-appearance: button; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Remove the inner border and padding in Firefox. |
||||
|
*/ |
||||
|
|
||||
|
button::-moz-focus-inner, |
||||
|
[type="button"]::-moz-focus-inner, |
||||
|
[type="reset"]::-moz-focus-inner, |
||||
|
[type="submit"]::-moz-focus-inner { |
||||
|
border-style: none; |
||||
|
padding: 0; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Restore the focus styles unset by the previous rule. |
||||
|
*/ |
||||
|
|
||||
|
button:-moz-focusring, |
||||
|
[type="button"]:-moz-focusring, |
||||
|
[type="reset"]:-moz-focusring, |
||||
|
[type="submit"]:-moz-focusring { |
||||
|
outline: 1px dotted ButtonText; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Correct the padding in Firefox. |
||||
|
*/ |
||||
|
|
||||
|
fieldset { |
||||
|
padding: 0.35em 0.75em 0.625em; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* 1. Correct the text wrapping in Edge and IE. |
||||
|
* 2. Correct the color inheritance from `fieldset` elements in IE. |
||||
|
* 3. Remove the padding so developers are not caught out when they zero out |
||||
|
* `fieldset` elements in all browsers. |
||||
|
*/ |
||||
|
|
||||
|
legend { |
||||
|
box-sizing: border-box; /* 1 */ |
||||
|
color: inherit; /* 2 */ |
||||
|
display: table; /* 1 */ |
||||
|
max-width: 100%; /* 1 */ |
||||
|
padding: 0; /* 3 */ |
||||
|
white-space: normal; /* 1 */ |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Add the correct vertical alignment in Chrome, Firefox, and Opera. |
||||
|
*/ |
||||
|
|
||||
|
progress { |
||||
|
vertical-align: baseline; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Remove the default vertical scrollbar in IE 10+. |
||||
|
*/ |
||||
|
|
||||
|
textarea { |
||||
|
overflow: auto; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* 1. Add the correct box sizing in IE 10. |
||||
|
* 2. Remove the padding in IE 10. |
||||
|
*/ |
||||
|
|
||||
|
[type="checkbox"], |
||||
|
[type="radio"] { |
||||
|
box-sizing: border-box; /* 1 */ |
||||
|
padding: 0; /* 2 */ |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Correct the cursor style of increment and decrement buttons in Chrome. |
||||
|
*/ |
||||
|
|
||||
|
[type="number"]::-webkit-inner-spin-button, |
||||
|
[type="number"]::-webkit-outer-spin-button { |
||||
|
height: auto; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* 1. Correct the odd appearance in Chrome and Safari. |
||||
|
* 2. Correct the outline style in Safari. |
||||
|
*/ |
||||
|
|
||||
|
[type="search"] { |
||||
|
-webkit-appearance: textfield; /* 1 */ |
||||
|
outline-offset: -2px; /* 2 */ |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Remove the inner padding in Chrome and Safari on macOS. |
||||
|
*/ |
||||
|
|
||||
|
[type="search"]::-webkit-search-decoration { |
||||
|
-webkit-appearance: none; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* 1. Correct the inability to style clickable types in iOS and Safari. |
||||
|
* 2. Change font properties to `inherit` in Safari. |
||||
|
*/ |
||||
|
|
||||
|
::-webkit-file-upload-button { |
||||
|
-webkit-appearance: button; /* 1 */ |
||||
|
font: inherit; /* 2 */ |
||||
|
} |
||||
|
|
||||
|
/* Interactive |
||||
|
========================================================================== */ |
||||
|
|
||||
|
/* |
||||
|
* Add the correct display in Edge, IE 10+, and Firefox. |
||||
|
*/ |
||||
|
|
||||
|
details { |
||||
|
display: block; |
||||
|
} |
||||
|
|
||||
|
/* |
||||
|
* Add the correct display in all browsers. |
||||
|
*/ |
||||
|
|
||||
|
summary { |
||||
|
display: list-item; |
||||
|
} |
||||
|
|
||||
|
/* Misc |
||||
|
========================================================================== */ |
||||
|
|
||||
|
/** |
||||
|
* Add the correct display in IE 10+. |
||||
|
*/ |
||||
|
|
||||
|
template { |
||||
|
display: none; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Add the correct display in IE 10. |
||||
|
*/ |
||||
|
|
||||
|
[hidden] { |
||||
|
display: none; |
||||
|
} |
||||
|
|
||||
@ -0,0 +1,27 @@ |
|||||
|
//font |
||||
|
$font-default:'Roboto', sans-serif; |
||||
|
$font-offer: 'Kaushan Script', cursive; |
||||
|
|
||||
|
|
||||
|
//colors |
||||
|
$color-white: #ffffff; |
||||
|
$color-orange: #3fc0b6; |
||||
|
$color-black: #000000; |
||||
|
$color-button: #00000056; |
||||
|
$color-grey: #6b778d; |
||||
|
$color-bg:#f4f4f4; |
||||
|
$color-footer:#a09292; |
||||
|
$color-carousel:#232020; |
||||
|
$color-border:#cfcdcd; |
||||
|
|
||||
|
|
||||
|
//fon-size |
||||
|
$font-size-h1: 36px; |
||||
|
$font-size-h6:14px; |
||||
|
$font-size-subheading:25px; |
||||
|
$font-size-text: 14px; |
||||
|
$font-size-s:15px; |
||||
|
$font-size-demo:40px; |
||||
|
$font-size-form:12px; |
||||
|
$font-sub-head:16px; |
||||
|
$font-sub-blog:20px; |
||||
@ -0,0 +1,232 @@ |
|||||
|
.btn { |
||||
|
border: none !important; |
||||
|
outline: none !important; |
||||
|
&-primary { |
||||
|
background-color: #6f6f6f57 !important; |
||||
|
border-color: #6f6f6f57 !important; |
||||
|
padding: 9px 15px; |
||||
|
border-radius: 30px; |
||||
|
&:hover { |
||||
|
background-color: $color-orange !important; |
||||
|
border: none !important; |
||||
|
color: #ffffff !important; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
&-banner1 { |
||||
|
background-color: #ffffff !important; |
||||
|
border-color: #ffffff !important; |
||||
|
padding: 10px 17px; |
||||
|
border-radius: 30px; |
||||
|
color: black; |
||||
|
font-weight: 600; |
||||
|
&:hover { |
||||
|
background-color: $color-orange !important; |
||||
|
border: none !important; |
||||
|
color: #ffffff !important; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
&-contact { |
||||
|
background-color: $color-orange !important; |
||||
|
border-color: $color-orange !important; |
||||
|
padding: 11px 60px; |
||||
|
border-radius: 5px; |
||||
|
color: white; |
||||
|
font-weight: 600; |
||||
|
&:hover { |
||||
|
background-color:#ecb500 !important; |
||||
|
border: none !important; |
||||
|
color: #ffffff !important; |
||||
|
} |
||||
|
} |
||||
|
&-banner2 { |
||||
|
background-color: #ffffff !important; |
||||
|
border-color: #ffffff !important; |
||||
|
padding: 9px 33px; |
||||
|
border-radius: 30px; |
||||
|
color: black; |
||||
|
font-weight: 600; |
||||
|
&:hover { |
||||
|
background-color: $color-orange !important; |
||||
|
border: none !important; |
||||
|
color: #ffffff !important; |
||||
|
} |
||||
|
} |
||||
|
&-men { |
||||
|
background-color: #000000 !important; |
||||
|
border-color: #000000 !important; |
||||
|
padding: 10px 17px; |
||||
|
border-radius: 30px; |
||||
|
color: #ffffff; |
||||
|
font-weight: 600; |
||||
|
&:hover { |
||||
|
background-color: $color-orange !important; |
||||
|
border: none !important; |
||||
|
color: #ffffff !important; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
&-play { |
||||
|
background-color: #00000070 !important; |
||||
|
border-color: #00000070 !important; |
||||
|
padding: 16px 16px; |
||||
|
border-radius: 39px; |
||||
|
color: #ffffff; |
||||
|
font-weight: 600; |
||||
|
width: 60px; |
||||
|
position: absolute; |
||||
|
top: 207px; |
||||
|
left: 431px; |
||||
|
&:hover { |
||||
|
background-color: $color-orange !important; |
||||
|
border: none !important; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
&-sub { |
||||
|
background-color: $color-orange !important; |
||||
|
border-color: $color-orange !important; |
||||
|
padding: 14px 30px; |
||||
|
border-top-right-radius: 25px; |
||||
|
border-bottom-right-radius: 25px; |
||||
|
|
||||
|
border-top-left-radius: 0; |
||||
|
border-bottom-left-radius: 0; |
||||
|
color: #ffffff; |
||||
|
font-weight: 600; |
||||
|
width: 80%; |
||||
|
|
||||
|
&:hover { |
||||
|
background-color: $color-black !important; |
||||
|
border: none !important; |
||||
|
color: $color-white; |
||||
|
} |
||||
|
@media screen and(max-width:991px){ |
||||
|
|
||||
|
width: 100% !important; |
||||
|
|
||||
|
} |
||||
|
@media screen and(max-width:767px){ |
||||
|
|
||||
|
width: 80% !important; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
&-search { |
||||
|
background-color: $color-black !important; |
||||
|
border-color: $color-black !important; |
||||
|
padding: 14px 30px; |
||||
|
border-top-right-radius: 5px; |
||||
|
border-bottom-right-radius: 5px; |
||||
|
|
||||
|
border-top-left-radius: 0; |
||||
|
border-bottom-left-radius: 0; |
||||
|
color: #ffffff; |
||||
|
font-weight: 600; |
||||
|
width: 80%; |
||||
|
&:hover { |
||||
|
background-color: $color-orange !important; |
||||
|
border: none !important; |
||||
|
color: $color-white; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
&-buy { |
||||
|
background-color: $color-orange !important; |
||||
|
border-color: #000000 !important; |
||||
|
padding:10px 52px; |
||||
|
font-weight: 600; |
||||
|
border-radius: 30px; |
||||
|
color: white; |
||||
|
|
||||
|
&:hover { |
||||
|
background-color: #000000 !important; |
||||
|
border: none !important; |
||||
|
color: #ffffff !important; |
||||
|
} |
||||
|
|
||||
|
@media screen and(max-width:991px) { |
||||
|
width: 100%; |
||||
|
} |
||||
|
} |
||||
|
&-cart_p { |
||||
|
|
||||
|
background-color: #000000 !important; |
||||
|
border-color: #000000 !important; |
||||
|
padding:10px 52px; |
||||
|
border-radius: 30px; |
||||
|
font-weight: 600; |
||||
|
color: white; |
||||
|
&:hover { |
||||
|
background-color: $color-orange !important; |
||||
|
border: none !important; |
||||
|
color: #ffffff !important; |
||||
|
} |
||||
|
|
||||
|
@media screen and(max-width:991px) { |
||||
|
width: 100%; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
&-tag { |
||||
|
background-color:transparent !important; |
||||
|
border-color: $color-orange !important; |
||||
|
padding: 2px 5px; |
||||
|
border: 1px solid !important; |
||||
|
|
||||
|
color: #000000; |
||||
|
font-weight: 600; |
||||
|
margin-bottom: 7px; |
||||
|
margin-right: 5px; |
||||
|
&:hover { |
||||
|
background-color: $color-orange !important; |
||||
|
border: none !important; |
||||
|
color: #ffffff !important; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
&-fb { |
||||
|
background-color:#0084ff !important; |
||||
|
border-color: #0084ff !important; |
||||
|
padding: 11px 30px; |
||||
|
border-radius: 5px; |
||||
|
color: white; |
||||
|
font-weight: 600; |
||||
|
&:hover { |
||||
|
background-color:#0099ff !important; |
||||
|
border: none !important; |
||||
|
color: #ffffff !important; |
||||
|
} |
||||
|
} |
||||
|
&-twitter { |
||||
|
background-color:#319db8 !important; |
||||
|
border-color: #319db8 !important; |
||||
|
padding: 11px 30px; |
||||
|
border-radius: 5px; |
||||
|
color: white; |
||||
|
font-weight: 600; |
||||
|
&:hover { |
||||
|
background-color:rgb(13, 103, 163) !important; |
||||
|
border: none !important; |
||||
|
color: #ffffff !important; |
||||
|
} |
||||
|
} |
||||
|
&-google { |
||||
|
background-color:#ff3434 !important; |
||||
|
border-color: #ff3434 !important; |
||||
|
padding: 11px 30px; |
||||
|
border-radius: 5px; |
||||
|
color: white; |
||||
|
font-weight: 600; |
||||
|
&:hover { |
||||
|
background-color:#f54343 !important; |
||||
|
border: none !important; |
||||
|
color: #ffffff !important; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
} |
||||
@ -0,0 +1,2 @@ |
|||||
|
@import './buttons'; |
||||
|
@import './product'; |
||||
@ -0,0 +1,123 @@ |
|||||
|
.product{ |
||||
|
margin-top: 90px; |
||||
|
|
||||
|
h1{ |
||||
|
|
||||
|
font-weight: 700; |
||||
|
margin-bottom: 10px; |
||||
|
span{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
p{ |
||||
|
color: $color-grey; |
||||
|
font-size: $font-sub-head; |
||||
|
} |
||||
|
|
||||
|
.product_sectoin{ |
||||
|
padding-top:70px ; |
||||
|
} |
||||
|
|
||||
|
.img_wrapper{ |
||||
|
position: relative; |
||||
|
|
||||
|
img{ |
||||
|
width: 100%; |
||||
|
border-radius: 7px; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.product_details{ |
||||
|
|
||||
|
|
||||
|
a{ |
||||
|
text-decoration: none !important; |
||||
|
} |
||||
|
h4{ |
||||
|
text-decoration: none !important; |
||||
|
font-weight: 600; |
||||
|
color: $color-black !important; |
||||
|
&:hover{ |
||||
|
color: $color-orange !important; |
||||
|
} |
||||
|
} |
||||
|
.old_rate{ |
||||
|
color: $color-grey !important; |
||||
|
margin-right: 10px; |
||||
|
font-weight: normal; |
||||
|
} |
||||
|
span{ |
||||
|
font-weight: 600; |
||||
|
color: $color-black; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
img{ |
||||
|
width: 100%; |
||||
|
border-radius: 7px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.img_wrapper:hover .button { |
||||
|
position: absolute; |
||||
|
display: block; |
||||
|
text-decoration: none !important; |
||||
|
top: 280px; |
||||
|
width: 100%; |
||||
|
padding: 9px 77px; |
||||
|
font-size: 20px; |
||||
|
text-align: center; |
||||
|
color: #ffffff; |
||||
|
background-color: #ff7315; |
||||
|
&:hover{ |
||||
|
background-color: #000000; |
||||
|
} |
||||
|
@media screen and(max-width:1199px) { |
||||
|
|
||||
|
top: 230px; |
||||
|
width: 100%; |
||||
|
padding: 9px 50px; |
||||
|
font-size: 16px; |
||||
|
text-align: center; |
||||
|
|
||||
|
} |
||||
|
@media screen and(max-width:991px) { |
||||
|
|
||||
|
top: 377px; |
||||
|
width: 100%; |
||||
|
padding: 11px 50px; |
||||
|
font-size: 18px; |
||||
|
text-align: center; |
||||
|
|
||||
|
} |
||||
|
@media screen and(max-width:767px) { |
||||
|
|
||||
|
top: 260px; |
||||
|
padding: 11px 50px; |
||||
|
font-size: 18px; |
||||
|
text-align: center; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
.button{ |
||||
|
display:none; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
@-webkit-keyframes flash { |
||||
|
0% { opacity: .3; } |
||||
|
100% { opacity: 1; } |
||||
|
} |
||||
|
@keyframes flash { |
||||
|
0% { opacity: .3; } |
||||
|
100% { opacity: 1; } |
||||
|
} |
||||
@ -0,0 +1,197 @@ |
|||||
|
.footer{ |
||||
|
background-color:$color-carousel; |
||||
|
padding-top: 90px; |
||||
|
padding-bottom: 90px; |
||||
|
|
||||
|
.footer_top{ |
||||
|
|
||||
|
border: 1px solid; |
||||
|
border-color: transparent; |
||||
|
border-bottom-color: $color-footer !important; |
||||
|
padding-bottom: 43px; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.footer_left{ |
||||
|
text-align: left; |
||||
|
margin-top: 20px; |
||||
|
|
||||
|
.footer_logo{ |
||||
|
text-transform: uppercase; |
||||
|
font-size: 33px; |
||||
|
font-weight: 600; |
||||
|
|
||||
|
a{ |
||||
|
color: $color-white; |
||||
|
text-decoration: none; |
||||
|
} |
||||
|
|
||||
|
color: $color-white; |
||||
|
span{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.footer_desc{ |
||||
|
color: $color-footer; |
||||
|
margin-top: 30px; |
||||
|
font-size: 14px; |
||||
|
} |
||||
|
|
||||
|
.footer_icons{ |
||||
|
|
||||
|
ul{ |
||||
|
display: flex; |
||||
|
list-style: none; |
||||
|
padding-left: 0; |
||||
|
margin-top: 40px; |
||||
|
|
||||
|
li{ |
||||
|
color: $color-white; |
||||
|
|
||||
|
font-size: 18px; |
||||
|
width: 40px; |
||||
|
height: 40px; |
||||
|
border-radius: 50%; |
||||
|
margin-right: 20px; |
||||
|
background-color: #363434; |
||||
|
text-align: center; |
||||
|
padding-top: 11px; |
||||
|
|
||||
|
&:hover{ |
||||
|
background-color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.footer_right{ |
||||
|
margin-top: 20px; |
||||
|
|
||||
|
.footer_discount{ |
||||
|
color: $color-white; |
||||
|
font-size: 33px; |
||||
|
font-weight: 700; |
||||
|
} |
||||
|
|
||||
|
.footer_right_bottom{ |
||||
|
|
||||
|
margin-top: 40px; |
||||
|
padding-top: 20px; |
||||
|
|
||||
|
|
||||
|
.ul_wrapper{ |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
ul{ |
||||
|
padding-left: 0; |
||||
|
|
||||
|
padding-top: 10px; |
||||
|
|
||||
|
a{ |
||||
|
text-decoration: none; |
||||
|
} |
||||
|
|
||||
|
li{ |
||||
|
font-size: 14px; |
||||
|
list-style: none; |
||||
|
padding-bottom: 10px; |
||||
|
|
||||
|
color: $color-footer; |
||||
|
&:hover{ |
||||
|
color: $color-orange; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.f_r_h{ |
||||
|
color: $color-white; |
||||
|
font-weight: 600; |
||||
|
} |
||||
|
|
||||
|
.address{ |
||||
|
color: $color-footer; |
||||
|
padding-top: 10px; |
||||
|
padding-bottom: 60px; |
||||
|
font-size: 14px; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
.payment{ |
||||
|
|
||||
|
ul{ |
||||
|
display: flex; |
||||
|
list-style: none; |
||||
|
padding-left: 0; |
||||
|
margin-top: 20px; |
||||
|
|
||||
|
li{ |
||||
|
|
||||
|
font-size: 34px; |
||||
|
margin: 0 14px 0px 0; |
||||
|
color: #acb2b7; |
||||
|
&:hover{ |
||||
|
color: #636363; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
.footer_bottom{ |
||||
|
|
||||
|
padding-top: 50px; |
||||
|
.bottom_left{ |
||||
|
span{ |
||||
|
|
||||
|
margin: 0 14px 0px 0; |
||||
|
font-size: 16px; |
||||
|
a{ |
||||
|
color: $color-footer; |
||||
|
text-decoration: none; |
||||
|
|
||||
|
&:hover{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
} |
||||
|
|
||||
|
.bottom_right{ |
||||
|
color: $color-footer; |
||||
|
font-size: 16px; |
||||
|
text-align: left !important; |
||||
|
a{ |
||||
|
color: $color-footer; |
||||
|
text-decoration: none; |
||||
|
|
||||
|
&:hover{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.f_b_r{ |
||||
|
display: flex; |
||||
|
justify-content: end; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
@ -0,0 +1,226 @@ |
|||||
|
.banner{ |
||||
|
position: relative; |
||||
|
.carousel-control-next-icon, .carousel-control-prev-icon{ |
||||
|
|
||||
|
} |
||||
|
.carousel-indicators li{display: none;} |
||||
|
.carousel-control-prev { |
||||
|
left: -33px; |
||||
|
|
||||
|
@media screen and (max-width:1080px){ |
||||
|
left:3px |
||||
|
} |
||||
|
} |
||||
|
.bg-right{ |
||||
|
background-image: linear-gradient(#11111191, #11111191),url(./../images/banner/banner1.jpg); |
||||
|
|
||||
|
height: 100vh; |
||||
|
|
||||
|
background-size: cover; |
||||
|
width: 100%; |
||||
|
background-repeat: no-repeat; |
||||
|
background-position: center; |
||||
|
padding-bottom: 200px; |
||||
|
|
||||
|
} |
||||
|
.bg-right2{ |
||||
|
background-image: linear-gradient(#11111191, #11111191),url(./../images/banner/banner3.jpg); |
||||
|
|
||||
|
height: 100vh; |
||||
|
|
||||
|
background-size: cover; |
||||
|
width: 100%; |
||||
|
background-repeat: no-repeat; |
||||
|
background-position: center; |
||||
|
padding-bottom: 200px; |
||||
|
|
||||
|
} |
||||
|
.bg-right3{ |
||||
|
background-image: linear-gradient(#11111191, #11111191),url(./../images/banner/banner4.jpg); |
||||
|
|
||||
|
height: 100vh; |
||||
|
|
||||
|
background-size: cover; |
||||
|
width: 100%; |
||||
|
background-repeat: no-repeat; |
||||
|
background-position: center; |
||||
|
padding-bottom: 200px; |
||||
|
|
||||
|
} |
||||
|
.bg-left{ |
||||
|
height: 100vh; |
||||
|
padding-bottom: 200px; |
||||
|
background-image: linear-gradient(#11111191, #11111191),url(./../images/banner/left3.jpg); |
||||
|
background-size: cover; |
||||
|
width: 100%; |
||||
|
background-repeat: no-repeat; |
||||
|
background-position: center; |
||||
|
|
||||
|
@media screen and(max-width:767px){ |
||||
|
|
||||
|
height: 50vh; |
||||
|
|
||||
|
padding-bottom: 20px; |
||||
|
} |
||||
|
} |
||||
|
.left_card{ |
||||
|
margin-top: 200px; |
||||
|
background: transparent; |
||||
|
border: none; |
||||
|
margin-left: 50px; |
||||
|
|
||||
|
.card-title{ |
||||
|
color: #fff; |
||||
|
font-size: 50px; |
||||
|
text-align: left; |
||||
|
font-weight: 900; |
||||
|
@media screen and(max-width:839px){ |
||||
|
|
||||
|
font-size:40px; |
||||
|
|
||||
|
} |
||||
|
@media screen and(max-width:790px){ |
||||
|
|
||||
|
font-size:35px; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
@media screen and(max-width:768px){ |
||||
|
|
||||
|
font-size:50px; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
.right_card{ |
||||
|
margin-top: 200px; |
||||
|
background: transparent; |
||||
|
border: none; |
||||
|
margin-left: 0; |
||||
|
@media screen and(max-width:767px){ |
||||
|
|
||||
|
margin-top: 75px; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
.card-title{color: #ffffff; |
||||
|
font-size: 50px; |
||||
|
text-align: left; |
||||
|
font-weight: 900; |
||||
|
|
||||
|
@media screen and(max-width:1250px){ |
||||
|
|
||||
|
font-size:35px; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
@media screen and(max-width:768px){ |
||||
|
|
||||
|
font-size:55px; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
} |
||||
|
|
||||
|
.top_wrapper{ |
||||
|
position: absolute; |
||||
|
display: flex; |
||||
|
z-index: 1; |
||||
|
justify-content: space-between; |
||||
|
width: 100%; |
||||
|
padding: 0px 46px; |
||||
|
|
||||
|
@media screen and(max-width:800px){ |
||||
|
padding-right: 14px; |
||||
|
|
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
.top-right{ |
||||
|
margin-left: 19px; |
||||
|
padding-top: 20px; |
||||
|
align-items: baseline; |
||||
|
|
||||
|
@media screen and(max-width:800px){ |
||||
|
padding-right: 14px; |
||||
|
display: none !important; |
||||
|
|
||||
|
} |
||||
|
h6{ |
||||
|
color:$color-white ; |
||||
|
font-weight: 700; |
||||
|
font-size: $font-size-h6; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
p{ |
||||
|
margin-left: 6px; |
||||
|
color:$color-white ; |
||||
|
font-weight: 600; |
||||
|
|
||||
|
} |
||||
|
.more{ |
||||
|
color:$color-orange; |
||||
|
margin-left: 5px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
.top-left{ |
||||
|
padding-top: 20px; |
||||
|
align-items: baseline; |
||||
|
|
||||
|
margin-right: 20px; |
||||
|
|
||||
|
@media screen and(max-width:800px){ |
||||
|
width: 100%; |
||||
|
margin-right: 0; |
||||
|
justify-content: space-between !important; |
||||
|
|
||||
|
} |
||||
|
span{ |
||||
|
margin-right: 20px; |
||||
|
color: #fff; |
||||
|
width: 36px; |
||||
|
height: 36px; |
||||
|
background: rgba(255, 255, 255, 0.141); |
||||
|
border-radius: 50%; |
||||
|
display: inline-block; |
||||
|
text-align: center; |
||||
|
line-height: 36px; |
||||
|
|
||||
|
&:hover{ |
||||
|
background-color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.cart{ |
||||
|
color: $color-white; |
||||
|
background: rgba(255, 255, 255, 0.141); |
||||
|
} |
||||
|
|
||||
|
.cart-svg{ |
||||
|
width: 20px; |
||||
|
list-style: none; |
||||
|
margin-right: 0 !important; |
||||
|
margin-left: 5px; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
} |
||||
@ -0,0 +1,5 @@ |
|||||
|
@import './header'; |
||||
|
@import './navigation'; |
||||
|
@import './footer'; |
||||
|
@import './sidebar'; |
||||
|
@import './sidebar2'; |
||||
@ -0,0 +1,111 @@ |
|||||
|
.header_wrapper{ |
||||
|
.navbar{ |
||||
|
z-index: 1030; |
||||
|
position: absolute; |
||||
|
top: 70px; |
||||
|
width: 100%; |
||||
|
background-color: rgb(114, 89, 89); |
||||
|
|
||||
|
@media screen and(max-width:991px){ |
||||
|
|
||||
|
padding: 0px 34px; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
.navbar-brand{ |
||||
|
color: #fff; |
||||
|
font-size: 30px; |
||||
|
padding: 0; |
||||
|
font-weight: 900; |
||||
|
text-transform: uppercase; |
||||
|
|
||||
|
.lohny{color: $color-orange; |
||||
|
&:hover{ |
||||
|
color: $color-white; |
||||
|
}} |
||||
|
} |
||||
|
|
||||
|
} .search-right{ |
||||
|
margin-left: 100px; |
||||
|
font-size: 20px; |
||||
|
@media screen and(max-width:767px){ |
||||
|
margin-left: 0px; |
||||
|
} |
||||
|
|
||||
|
a{color: #fff !important; |
||||
|
text-decoration: none !important; |
||||
|
|
||||
|
|
||||
|
} |
||||
|
.search-text{ |
||||
|
color: #fff !important; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.navbar-nav{ |
||||
|
|
||||
|
|
||||
|
|
||||
|
.active{ |
||||
|
color: $color-orange !important; |
||||
|
} |
||||
|
li{ |
||||
|
text-transform: uppercase; |
||||
|
font-size: 16px; |
||||
|
margin: 0 15px 0 0; |
||||
|
.nav-link{color: #fff !important; |
||||
|
&:hover{ |
||||
|
color: $color-orange !important; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
.navbar-light .navbar-toggler{ |
||||
|
|
||||
|
color: #fff; |
||||
|
border-color: #fff; |
||||
|
background-color: white; |
||||
|
|
||||
|
|
||||
|
padding-top: 1px; |
||||
|
padding-right: 1px; |
||||
|
padding-bottom: 0px; |
||||
|
padding-left: 1px; |
||||
|
|
||||
|
|
||||
|
&:before{ |
||||
|
visibility: hidden; |
||||
|
} |
||||
|
.navbar-toggler-icon{ |
||||
|
color: $color-orange; |
||||
|
padding-top: 4px; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.navbar-collapse{ |
||||
|
|
||||
|
ul{ |
||||
|
background-color: transparent !important; |
||||
|
border: none !important; |
||||
|
@media screen and (max-width:992px) { |
||||
|
|
||||
|
background: #232020f2 !important; |
||||
|
padding: 10px !important; |
||||
|
border-radius: 6px; |
||||
|
position: relative; |
||||
|
border: 1px #232020 solid; |
||||
|
max-height: calc(100vh - 120px); |
||||
|
overflow: auto; |
||||
|
margin-top: 6px; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.navbar-light .navbar-toggler-icon { |
||||
|
background-image:none !important; |
||||
|
} |
||||
@ -0,0 +1,502 @@ |
|||||
|
.filter_sidebar { |
||||
|
text-align: left; |
||||
|
background-color: $color-bg; |
||||
|
padding-top: 40px; |
||||
|
padding-left: 30px; |
||||
|
.filter_heading { |
||||
|
font-size: 24px; |
||||
|
color: $color-black; |
||||
|
margin-bottom: 30px; |
||||
|
font-weight: 700; |
||||
|
span { |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
.filter_sidebar_sub { |
||||
|
.signin-form { |
||||
|
margin-bottom: 20px; |
||||
|
} |
||||
|
.forms-gds { |
||||
|
display: grid; |
||||
|
grid-template-columns: 2fr 1fr; |
||||
|
.form-input { |
||||
|
input { |
||||
|
width: 100%; |
||||
|
background-color: #ffffff; |
||||
|
border-top-left-radius: 5px; |
||||
|
border-bottom-left-radius: 5px; |
||||
|
border: none; |
||||
|
padding: 15px 30px; |
||||
|
color: #2f2f2f; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
ul { |
||||
|
padding-left: 0px; |
||||
|
list-style: none; |
||||
|
li { |
||||
|
line-height: 30px; |
||||
|
a { |
||||
|
color: #828282; |
||||
|
text-decoration: none; |
||||
|
&:hover { |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.hh { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
border: 1px solid; |
||||
|
border-color: transparent; |
||||
|
border-bottom-color: $color-grey !important ; |
||||
|
width: 85%; |
||||
|
padding-bottom: 13px; |
||||
|
margin-bottom: 10px; |
||||
|
font-size: 14px; |
||||
|
color: $color-grey; |
||||
|
} |
||||
|
} |
||||
|
.nu { |
||||
|
color: #ffffff; |
||||
|
height: 29px; |
||||
|
width: 39px; |
||||
|
background-color: #000000; |
||||
|
border-radius: 11px; |
||||
|
display: inline-block; |
||||
|
padding: 0px 13px; |
||||
|
font-size: 12px; |
||||
|
} |
||||
|
.check { |
||||
|
.container { |
||||
|
display: block; |
||||
|
position: relative; |
||||
|
padding-left: 35px; |
||||
|
margin-bottom: 16px; |
||||
|
cursor: pointer; |
||||
|
font-size: 14px; |
||||
|
color: $color-grey; |
||||
|
-webkit-user-select: none; |
||||
|
-moz-user-select: none; |
||||
|
-ms-user-select: none; |
||||
|
user-select: none; |
||||
|
} |
||||
|
.container input { |
||||
|
position: absolute; |
||||
|
opacity: 0; |
||||
|
cursor: pointer; |
||||
|
height: 0; |
||||
|
width: 0; |
||||
|
} |
||||
|
.checkmark { |
||||
|
position: absolute; |
||||
|
top: 0; |
||||
|
left: 0; |
||||
|
height: 20px; |
||||
|
width: 20px; |
||||
|
border: 2px solid; |
||||
|
border-color: $color-grey; |
||||
|
background-color: $color-white; |
||||
|
} |
||||
|
.container:hover input ~ .checkmark { |
||||
|
background-color: $color-black; |
||||
|
} |
||||
|
.container input:checked ~ .checkmark { |
||||
|
background-color: $color-orange; |
||||
|
} |
||||
|
.checkmark:after { |
||||
|
content: ""; |
||||
|
position: absolute; |
||||
|
display: none; |
||||
|
} |
||||
|
.container input:checked ~ .checkmark:after { |
||||
|
display: block; |
||||
|
} |
||||
|
.container .checkmark:after { |
||||
|
left: 6px; |
||||
|
top: 3px; |
||||
|
width: 5px; |
||||
|
height: 10px; |
||||
|
border: solid white; |
||||
|
border-width: 0 3px 3px 0; |
||||
|
-webkit-transform: rotate(45deg); |
||||
|
-ms-transform: rotate(45deg); |
||||
|
transform: rotate(45deg); |
||||
|
} |
||||
|
} |
||||
|
.top { |
||||
|
font-weight: 800; |
||||
|
} |
||||
|
} |
||||
|
.white { |
||||
|
background-color: #fff !important; |
||||
|
margin-right: 5px; |
||||
|
border: 1px solid; |
||||
|
border-color: black; |
||||
|
&:hover { |
||||
|
color: $color-white; |
||||
|
background-color: darken(rgb(194, 194, 194), 5%) !important; |
||||
|
border: none; |
||||
|
} |
||||
|
} |
||||
|
.black { |
||||
|
background-color: $color-black !important; |
||||
|
margin-right: 5px; |
||||
|
border: 1px solid; |
||||
|
border-color: black; |
||||
|
&:hover { |
||||
|
color: $color-white; |
||||
|
background-color: darken(rgb(51, 49, 49), 5%) !important; |
||||
|
border: none; |
||||
|
} |
||||
|
} |
||||
|
.grey { |
||||
|
background-color: $color-grey !important; |
||||
|
margin-right: 5px; |
||||
|
border: 1px solid; |
||||
|
border-color: black; |
||||
|
&:hover { |
||||
|
background-color: darken(rgb(63, 62, 62), 5%) !important; |
||||
|
border: none; |
||||
|
} |
||||
|
} |
||||
|
.blue { |
||||
|
background-color: #4c00ff !important; |
||||
|
margin-right: 5px; |
||||
|
border: 1px solid; |
||||
|
border-color: black; |
||||
|
&:hover { |
||||
|
background-color: darken(#4c00ff, 5%) !important; |
||||
|
border: none; |
||||
|
} |
||||
|
} |
||||
|
.green { |
||||
|
background-color: #00ff62 !important; |
||||
|
border: 1px solid; |
||||
|
border-color: black; |
||||
|
&:hover { |
||||
|
background-color: darken(#00ff62, 5%) !important; |
||||
|
border: none; |
||||
|
} |
||||
|
} |
||||
|
.red { |
||||
|
background-color: red !important; |
||||
|
border: 1px solid; |
||||
|
border-color: black; |
||||
|
&:hover { |
||||
|
background-color: darken(red, 5%) !important; |
||||
|
border: none; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.ddd { |
||||
|
li { |
||||
|
margin-bottom: 15px; |
||||
|
span { |
||||
|
font-size: 12px; |
||||
|
margin-right: 5px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.recent { |
||||
|
margin-top: 10px; |
||||
|
.rec_img { |
||||
|
width: 150px; |
||||
|
margin-bottom: 20px; |
||||
|
img { |
||||
|
border-radius: 4px; |
||||
|
width: 100%; |
||||
|
} |
||||
|
.product_details { |
||||
|
margin-left: 20px; |
||||
|
a { |
||||
|
color: $color-black; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.filter_sidebar_main { |
||||
|
margin-bottom: 30px; |
||||
|
} |
||||
|
.range-field { |
||||
|
width: 100%; |
||||
|
// @media screen and (max-width:768px){ |
||||
|
// width: 30%; |
||||
|
} |
||||
|
.ui-menu .ui-menu-icon { |
||||
|
position: static; |
||||
|
float: right; |
||||
|
} |
||||
|
.ui-progressbar { |
||||
|
height: 2em; |
||||
|
text-align: left; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
.ui-progressbar .ui-progressbar-value { |
||||
|
margin: -1px; |
||||
|
height: 100%; |
||||
|
} |
||||
|
.ui-resizable { |
||||
|
position: relative; |
||||
|
} |
||||
|
.ui-resizable-handle { |
||||
|
position: absolute; |
||||
|
font-size: 0.1px; |
||||
|
display: block; |
||||
|
} |
||||
|
.ui-resizable-disabled .ui-resizable-handle, |
||||
|
.ui-resizable-autohide .ui-resizable-handle { |
||||
|
display: none; |
||||
|
} |
||||
|
.ui-resizable-n { |
||||
|
cursor: n-resize; |
||||
|
height: 7px; |
||||
|
width: 100%; |
||||
|
top: -5px; |
||||
|
left: 0; |
||||
|
} |
||||
|
.ui-resizable-s { |
||||
|
cursor: s-resize; |
||||
|
height: 7px; |
||||
|
width: 100%; |
||||
|
bottom: -5px; |
||||
|
left: 0; |
||||
|
} |
||||
|
.ui-resizable-e { |
||||
|
cursor: e-resize; |
||||
|
width: 7px; |
||||
|
right: -5px; |
||||
|
top: 0; |
||||
|
height: 100%; |
||||
|
} |
||||
|
.ui-resizable-w { |
||||
|
cursor: w-resize; |
||||
|
width: 7px; |
||||
|
left: -5px; |
||||
|
top: 0; |
||||
|
height: 100%; |
||||
|
} |
||||
|
.ui-resizable-se { |
||||
|
cursor: se-resize; |
||||
|
width: 12px; |
||||
|
height: 12px; |
||||
|
right: 1px; |
||||
|
bottom: 1px; |
||||
|
} |
||||
|
.ui-resizable-sw { |
||||
|
cursor: sw-resize; |
||||
|
width: 9px; |
||||
|
height: 9px; |
||||
|
left: -5px; |
||||
|
bottom: -5px; |
||||
|
} |
||||
|
.ui-resizable-nw { |
||||
|
cursor: nw-resize; |
||||
|
width: 9px; |
||||
|
height: 9px; |
||||
|
left: -5px; |
||||
|
top: -5px; |
||||
|
} |
||||
|
.ui-resizable-ne { |
||||
|
cursor: ne-resize; |
||||
|
width: 9px; |
||||
|
height: 9px; |
||||
|
right: -5px; |
||||
|
top: -5px; |
||||
|
} |
||||
|
.ui-selectable-helper { |
||||
|
position: absolute; |
||||
|
z-index: 100; |
||||
|
border: 1px dotted black; |
||||
|
} |
||||
|
.ui-slider { |
||||
|
position: relative; |
||||
|
text-align: left; |
||||
|
} |
||||
|
.ui-slider .ui-slider-handle { |
||||
|
position: absolute; |
||||
|
z-index: 2; |
||||
|
width: 1.2em; |
||||
|
height: 1.2em; |
||||
|
cursor: default; |
||||
|
} |
||||
|
.ui-slider .ui-slider-range { |
||||
|
position: absolute; |
||||
|
z-index: 1; |
||||
|
font-size: 0.7em; |
||||
|
display: block; |
||||
|
border: 0; |
||||
|
background-position: 0 0; |
||||
|
} |
||||
|
.ui-slider-horizontal { |
||||
|
height: 6px; |
||||
|
} |
||||
|
.ui-slider-horizontal .ui-slider-handle { |
||||
|
top: -5px; |
||||
|
margin-left: 0; |
||||
|
} |
||||
|
.ui-slider-horizontal .ui-slider-range { |
||||
|
top: 0; |
||||
|
height: 100%; |
||||
|
} |
||||
|
.ui-slider-horizontal .ui-slider-range-min { |
||||
|
left: 0; |
||||
|
} |
||||
|
.ui-slider-horizontal .ui-slider-range-max { |
||||
|
right: 0; |
||||
|
} |
||||
|
.ui-slider-vertical { |
||||
|
width: 0.3em; |
||||
|
height: 100px; |
||||
|
} |
||||
|
.ui-slider-vertical .ui-slider-handle { |
||||
|
left: -0.3em; |
||||
|
margin-left: 0; |
||||
|
margin-bottom: -0.6em; |
||||
|
} |
||||
|
.ui-slider-vertical .ui-slider-range { |
||||
|
left: 0; |
||||
|
width: 100%; |
||||
|
} |
||||
|
.ui-slider-vertical .ui-slider-range-min { |
||||
|
bottom: 0; |
||||
|
} |
||||
|
.ui-slider-vertical .ui-slider-range-max { |
||||
|
top: 0; |
||||
|
} |
||||
|
.ui-spinner { |
||||
|
position: relative; |
||||
|
display: inline-block; |
||||
|
overflow: hidden; |
||||
|
padding: 0; |
||||
|
vertical-align: middle; |
||||
|
} |
||||
|
.ui-spinner-input { |
||||
|
border: none; |
||||
|
background: none; |
||||
|
padding: 0; |
||||
|
margin: 0.2em 0; |
||||
|
vertical-align: middle; |
||||
|
margin-left: 0.4em; |
||||
|
margin-right: 22px; |
||||
|
} |
||||
|
.ui-spinner-button { |
||||
|
width: 16px; |
||||
|
height: 50%; |
||||
|
font-size: 0.5em; |
||||
|
padding: 0; |
||||
|
margin: 0; |
||||
|
text-align: center; |
||||
|
position: absolute; |
||||
|
cursor: default; |
||||
|
display: block; |
||||
|
overflow: hidden; |
||||
|
right: 0; |
||||
|
} |
||||
|
.ui-spinner a.ui-spinner-button { |
||||
|
border-top: none; |
||||
|
border-bottom: none; |
||||
|
border-right: none; |
||||
|
} |
||||
|
/* more specificity required here to overide default borders */ |
||||
|
.ui-spinner .ui-icon { |
||||
|
position: absolute; |
||||
|
margin-top: -8px; |
||||
|
top: 50%; |
||||
|
left: 0; |
||||
|
} |
||||
|
/* vertical centre icon */ |
||||
|
.ui-spinner-up { |
||||
|
top: 0; |
||||
|
} |
||||
|
.ui-spinner-down { |
||||
|
bottom: 0; |
||||
|
} |
||||
|
/* Fades and background-images don't work well together in IE6, drop the image */ |
||||
|
/* Component containers |
||||
|
----------------------------------*/ |
||||
|
.ui-widget { |
||||
|
font-family: Verdana, Arial, sans-serif; |
||||
|
font-size: 1.1em; |
||||
|
} |
||||
|
.ui-widget .ui-widget { |
||||
|
font-size: 1em; |
||||
|
} |
||||
|
.ui-widget input, |
||||
|
.ui-widget select, |
||||
|
.ui-widget textarea, |
||||
|
.ui-widget button { |
||||
|
font-family: Verdana, Arial, sans-serif; |
||||
|
font-size: 1em; |
||||
|
} |
||||
|
.ui-widget-content { |
||||
|
background: #e0ddda; |
||||
|
color: #222222; |
||||
|
margin-top: 3em; |
||||
|
} |
||||
|
.ui-widget-content a { |
||||
|
color: #222222; |
||||
|
} |
||||
|
.ui-widget-header { |
||||
|
background: #2b2d2d; |
||||
|
color: #222222; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
.ui-widget-header a { |
||||
|
color: #222222; |
||||
|
} |
||||
|
/* Interaction states |
||||
|
----------------------------------*/ |
||||
|
.ui-state-default, |
||||
|
.ui-widget-content .ui-state-default, |
||||
|
.ui-widget-header .ui-state-default { |
||||
|
border: 0px solid #ff7315; |
||||
|
/*{borderColorDefault}*/ |
||||
|
background: #ff7315; |
||||
|
font-weight: normal; |
||||
|
color: #444; |
||||
|
outline: none; |
||||
|
width: 15px; |
||||
|
height: 15px; |
||||
|
cursor: pointer; |
||||
|
border-radius: 100%; |
||||
|
} |
||||
|
.ui-state-default a, |
||||
|
.ui-state-default a:link, |
||||
|
.ui-state-default a:visited { |
||||
|
color: #555555; |
||||
|
text-decoration: none; |
||||
|
} |
||||
|
ul.dropdown-vjm-transitu6, |
||||
|
ul.dropdown-vjm-transitu5 { |
||||
|
margin: 0; |
||||
|
position: relative; |
||||
|
} |
||||
|
ul.dropdown-vjm-transitu6 li { |
||||
|
list-style: none; |
||||
|
} |
||||
|
ul.dropdown-vjm-transitu6 li p { |
||||
|
width: 100%; |
||||
|
} |
||||
|
span.amount { |
||||
|
color: #ffffff; |
||||
|
font-size: 16px; |
||||
|
} |
||||
|
input#amount, |
||||
|
input#amount1 { |
||||
|
font-size: 15px; |
||||
|
outline: none; |
||||
|
background: none; |
||||
|
word-spacing: 1em; |
||||
|
color: #5a5a5a !important; |
||||
|
position: absolute; |
||||
|
left: 0%; |
||||
|
top: -27px; |
||||
|
margin-top: -10px; |
||||
|
} |
||||
|
.range, |
||||
|
.w3-brand-select, |
||||
|
.w3ls-featured-ads { |
||||
|
padding: 20px 20px; |
||||
|
border: 1px solid #e4e4e4; |
||||
|
} |
||||
@ -0,0 +1,325 @@ |
|||||
|
.filter_sidebar2{ |
||||
|
text-align: left; |
||||
|
background-color: $color-bg; |
||||
|
|
||||
|
padding-top: 40px; |
||||
|
padding-left: 30px; |
||||
|
|
||||
|
.filter_heading{ |
||||
|
font-size: 24px; |
||||
|
color: $color-black; |
||||
|
margin-bottom: 30px; |
||||
|
font-weight: 700; |
||||
|
span{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
.filter_sidebar_sub{ |
||||
|
|
||||
|
|
||||
|
|
||||
|
.signin-form{ |
||||
|
margin-bottom: 20px; |
||||
|
} |
||||
|
.forms-gds{ |
||||
|
display: grid; |
||||
|
grid-template-columns: 2fr 1fr; |
||||
|
|
||||
|
|
||||
|
.form-input{ |
||||
|
input{ |
||||
|
width: 100%; |
||||
|
background-color: #ffffff; |
||||
|
border-top-left-radius: 5px; |
||||
|
border-bottom-left-radius: 5px; |
||||
|
border: none; |
||||
|
padding: 15px 30px; |
||||
|
color:#2f2f2f; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
ul{ |
||||
|
padding-left: 0px; |
||||
|
list-style: none; |
||||
|
li{ |
||||
|
line-height: 30px; |
||||
|
a{ |
||||
|
color:#828282; |
||||
|
text-decoration: none; |
||||
|
&:hover{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
} |
||||
|
|
||||
|
.hh{ |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
border: 1px solid ; |
||||
|
border-color: transparent; |
||||
|
border-bottom-color: $color-grey !important ; |
||||
|
width: 85%; |
||||
|
padding-bottom: 13px; |
||||
|
margin-bottom: 10px; |
||||
|
font-size: 14px; |
||||
|
color: $color-grey; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.nu{ |
||||
|
color: #ffffff; |
||||
|
height: 29px; |
||||
|
width: 39px; |
||||
|
background-color: #000000; |
||||
|
border-radius: 11px; |
||||
|
display: inline-block; |
||||
|
padding: 0px 13px; |
||||
|
font-size: 12px; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
.check{ |
||||
|
.container { |
||||
|
display: block; |
||||
|
position: relative; |
||||
|
padding-left: 35px; |
||||
|
margin-bottom: 16px; |
||||
|
cursor: pointer; |
||||
|
font-size: 14px; |
||||
|
color: $color-grey; |
||||
|
-webkit-user-select: none; |
||||
|
-moz-user-select: none; |
||||
|
-ms-user-select: none; |
||||
|
user-select: none; |
||||
|
} |
||||
|
|
||||
|
.container input { |
||||
|
position: absolute; |
||||
|
opacity: 0; |
||||
|
cursor: pointer; |
||||
|
height: 0; |
||||
|
width: 0; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.checkmark { |
||||
|
position: absolute; |
||||
|
top: 0; |
||||
|
left: 0; |
||||
|
height: 20px; |
||||
|
width: 20px; |
||||
|
border: 2px solid; |
||||
|
border-color: $color-grey; |
||||
|
background-color: $color-white |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.container:hover input ~ .checkmark { |
||||
|
background-color:$color-black; |
||||
|
} |
||||
|
|
||||
|
.container input:checked ~ .checkmark { |
||||
|
background-color: $color-orange; |
||||
|
} |
||||
|
|
||||
|
.checkmark:after { |
||||
|
content: ""; |
||||
|
position: absolute; |
||||
|
display: none; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.container input:checked ~ .checkmark:after { |
||||
|
display: block; |
||||
|
} |
||||
|
|
||||
|
.container .checkmark:after { |
||||
|
left: 6px; |
||||
|
top: 3px; |
||||
|
width: 5px; |
||||
|
height: 10px; |
||||
|
border: solid white; |
||||
|
border-width: 0 3px 3px 0; |
||||
|
-webkit-transform: rotate(45deg); |
||||
|
-ms-transform: rotate(45deg); |
||||
|
transform: rotate(45deg); |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
} |
||||
|
|
||||
|
.top{ |
||||
|
font-weight: 800; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.populor{ |
||||
|
|
||||
|
li{ |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
.wrapper{ |
||||
|
width: 80px; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
img{ |
||||
|
width: 100%; |
||||
|
border-radius: 5px; |
||||
|
} |
||||
|
|
||||
|
.wrapper2{ |
||||
|
padding-left: 10px; |
||||
|
p{ |
||||
|
color: $color-grey; |
||||
|
margin-bottom: 0; |
||||
|
font-size: 14px; |
||||
|
} |
||||
|
span{ |
||||
|
|
||||
|
font-size: 16px; |
||||
|
font-weight: 600; |
||||
|
a{ |
||||
|
color: $color-black; |
||||
|
&:hover{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
.tags{ |
||||
|
padding-right: 20px; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.bottom_img{ |
||||
|
padding-right: 20px; |
||||
|
position: relative; |
||||
|
padding-bottom: 30px; |
||||
|
|
||||
|
img{ |
||||
|
width: 100%; |
||||
|
border-radius: 5px; |
||||
|
} |
||||
|
|
||||
|
.offer{ |
||||
|
position: absolute; |
||||
|
bottom: 100px; |
||||
|
|
||||
|
h3{ |
||||
|
color: $color-white; |
||||
|
font-weight: 600; |
||||
|
padding-left: 20px; |
||||
|
} |
||||
|
p{ |
||||
|
color: $color-white; |
||||
|
padding-left: 20px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
} |
||||
|
|
||||
|
.ddd{ |
||||
|
li{ |
||||
|
margin-bottom: 15px; |
||||
|
span{ |
||||
|
font-size: 12px; |
||||
|
margin-right: 5px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
.recent{ |
||||
|
margin-top: 10px; |
||||
|
.rec_img{ |
||||
|
width: 150px; |
||||
|
margin-left: 15px; |
||||
|
|
||||
|
margin-bottom: 20px; |
||||
|
img{ |
||||
|
border-radius: 4px; |
||||
|
width: 100%; |
||||
|
} |
||||
|
|
||||
|
.product_details{ |
||||
|
margin-left: 20px; |
||||
|
a{ |
||||
|
color: $color-black; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
.filter_sidebar_main{ |
||||
|
margin-bottom: 30px; |
||||
|
} |
||||
|
.range-field{ |
||||
|
width: 100%; |
||||
|
// @media screen and (max-width:768px){ |
||||
|
|
||||
|
// width: 30%; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
span.amount { |
||||
|
color: #ffffff; |
||||
|
font-size: 16px; |
||||
|
} |
||||
|
|
||||
|
input#amount, |
||||
|
input#amount1 { |
||||
|
font-size: 15px; |
||||
|
outline: none; |
||||
|
background: none; |
||||
|
word-spacing: 1em; |
||||
|
color: #5a5a5a !important; |
||||
|
position: absolute; |
||||
|
left: 0%; |
||||
|
top: -27px; |
||||
|
margin-top: -10px; |
||||
|
} |
||||
|
|
||||
|
.range, |
||||
|
.w3-brand-select, |
||||
|
.w3ls-featured-ads { |
||||
|
padding: 20px 20px; |
||||
|
border: 1px solid #e4e4e4; |
||||
|
} |
||||
@ -0,0 +1,368 @@ |
|||||
|
.banner_about { |
||||
|
background-image: linear-gradient(rgba(17, 17, 17, 0.44), rgba(17, 17, 17, 0.24)), |
||||
|
url(./../images/about-banner/bg1.jpg); |
||||
|
|
||||
|
height: 50vh; |
||||
|
|
||||
|
background-size: cover; |
||||
|
width: 100%; |
||||
|
background-repeat: no-repeat; |
||||
|
background-position: center; |
||||
|
padding-bottom: 200px; |
||||
|
|
||||
|
.top-right { |
||||
|
color: $color-white; |
||||
|
padding-top: 25px; |
||||
|
h6 { |
||||
|
font-weight: 700; |
||||
|
margin-right: 10px; |
||||
|
} |
||||
|
.top { |
||||
|
font-size: 16px; |
||||
|
} |
||||
|
|
||||
|
.more { |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.top-left { |
||||
|
padding-top: 20px; |
||||
|
align-items: baseline; |
||||
|
justify-content: end; |
||||
|
margin-right: 20px; |
||||
|
|
||||
|
span { |
||||
|
margin-right: 20px; |
||||
|
color: #fff; |
||||
|
width: 36px; |
||||
|
height: 36px; |
||||
|
background: rgba(255, 255, 255, 0.141); |
||||
|
border-radius: 50%; |
||||
|
display: inline-block; |
||||
|
text-align: center; |
||||
|
line-height: 36px; |
||||
|
|
||||
|
&:hover { |
||||
|
background-color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.cart { |
||||
|
color: $color-white; |
||||
|
background-color: #00000056; |
||||
|
} |
||||
|
|
||||
|
.cart-svg { |
||||
|
width: 20px; |
||||
|
list-style: none; |
||||
|
margin-right: 0 !important; |
||||
|
margin-left: 5px; |
||||
|
} |
||||
|
|
||||
|
.banner-heading { |
||||
|
color: $color-white; |
||||
|
margin-top: 50px; |
||||
|
padding-top: 3em; |
||||
|
h1 { |
||||
|
font-size: 42px; |
||||
|
padding-top: 50px; |
||||
|
font-weight: 700; |
||||
|
margin-bottom: 0; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.breadcrumb { |
||||
|
text-align: center; |
||||
|
background-color: transparent; |
||||
|
justify-content: center; |
||||
|
|
||||
|
a { |
||||
|
color: white; |
||||
|
text-decoration: none; |
||||
|
} |
||||
|
|
||||
|
span { |
||||
|
margin: 0 10px 0 10px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.about_detail { |
||||
|
.card { |
||||
|
background: transparent; |
||||
|
border: none; |
||||
|
|
||||
|
padding-top: 40px; |
||||
|
.card-body { |
||||
|
padding: 0; |
||||
|
margin-top: 60px; |
||||
|
} |
||||
|
|
||||
|
.card-title { |
||||
|
font-size: $font-size-h1; |
||||
|
text-transform: uppercase; |
||||
|
font-weight: 700; |
||||
|
span { |
||||
|
color: $color-orange; |
||||
|
margin-top: 0; |
||||
|
} |
||||
|
} |
||||
|
p { |
||||
|
color: $color-grey; |
||||
|
margin-top: 30px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.btn { |
||||
|
margin-top: 20px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.what-we-offer { |
||||
|
padding-top: 90px; |
||||
|
padding-bottom: 90px; |
||||
|
background-color: $color-bg; |
||||
|
|
||||
|
.what_wrapper { |
||||
|
margin-top: 20px; |
||||
|
margin-bottom: 20px; |
||||
|
} |
||||
|
|
||||
|
.offer_wrapper1 { |
||||
|
width: 100%; |
||||
|
img { |
||||
|
width: 100%; |
||||
|
border-radius: 5px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.offer_content { |
||||
|
margin-top: 40px; |
||||
|
|
||||
|
padding-top: 20px; |
||||
|
.offer_content_top { |
||||
|
.card-title { |
||||
|
font-size: 36px; |
||||
|
text-transform: uppercase; |
||||
|
font-weight: 700; |
||||
|
span { |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
p { |
||||
|
margin-top: 25px; |
||||
|
color: $color-grey; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.offer_content_bottom { |
||||
|
margin-top: 30px; |
||||
|
|
||||
|
.offer_links { |
||||
|
.card-title { |
||||
|
font-weight: 600; |
||||
|
font-size: 20px; |
||||
|
|
||||
|
a { |
||||
|
color: $color-black; |
||||
|
text-decoration: none; |
||||
|
&:hover { |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
p { |
||||
|
color: $color-grey; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.offering { |
||||
|
padding-top: 50px; |
||||
|
padding-bottom: 100px; |
||||
|
|
||||
|
h1 { |
||||
|
font-weight: 700; |
||||
|
padding-bottom: 20px; |
||||
|
span { |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
p { |
||||
|
color: $color-orange; |
||||
|
font-size: $font-sub-head; |
||||
|
} |
||||
|
|
||||
|
.review { |
||||
|
margin-top: 30px; |
||||
|
color: $color-grey; |
||||
|
background-color: $color-bg; |
||||
|
|
||||
|
border-radius: 5px; |
||||
|
position: relative; |
||||
|
text-align: center; |
||||
|
|
||||
|
&:hover { |
||||
|
background-color: #f8e2d3; |
||||
|
} |
||||
|
|
||||
|
.card-title { |
||||
|
font-weight: 600; |
||||
|
font-size: 18px; |
||||
|
|
||||
|
a { |
||||
|
color: $color-black; |
||||
|
text-decoration: none; |
||||
|
&:hover { |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.quote { |
||||
|
color: $color-orange; |
||||
|
padding-top: 30px; |
||||
|
font-size: 35px; |
||||
|
margin-bottom: 0; |
||||
|
} |
||||
|
|
||||
|
p { |
||||
|
color: $color-grey; |
||||
|
margin: 5px 15px; |
||||
|
padding-bottom: 30px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.customer { |
||||
|
padding-top: 40px; |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
img { |
||||
|
max-width: 70px; |
||||
|
border-radius: 50%; |
||||
|
border: 3px solid #b8b9bd; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.team { |
||||
|
padding-top: 90px; |
||||
|
padding-bottom: 90px; |
||||
|
background-color: $color-bg; |
||||
|
@media screen and(max-width:991px) { |
||||
|
padding-bottom: 70px; |
||||
|
} |
||||
|
|
||||
|
h1 { |
||||
|
font-weight: 700; |
||||
|
span { |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.team_content { |
||||
|
padding-top: 30px; |
||||
|
.team_img { |
||||
|
position: relative; |
||||
|
@media screen and(max-width:991px) { |
||||
|
padding-bottom: 25px; |
||||
|
} |
||||
|
|
||||
|
img { |
||||
|
width: 100%; |
||||
|
height: 400px; |
||||
|
border-radius: 5%; |
||||
|
@media screen and(max-width:767px) { |
||||
|
height: 320px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.team_details { |
||||
|
position: absolute; |
||||
|
background-color: #ffffff; |
||||
|
border-radius: 4px; |
||||
|
padding: 18px 52px 0px 52px; |
||||
|
bottom: 40px; |
||||
|
left:46px; |
||||
|
|
||||
|
|
||||
|
@media screen and(max-width:1200px) { |
||||
|
position: absolute; |
||||
|
background-color: #ffffff; |
||||
|
border-radius: 4px; |
||||
|
padding: 18px 30px 0px 30px; |
||||
|
bottom: 46px; |
||||
|
left: 36px; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
@media screen and(max-width:767px) { |
||||
|
|
||||
|
padding: 11px 15px 2px 15px; |
||||
|
bottom: 40px; |
||||
|
left: 26px; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
@media screen and(max-width:574px) { |
||||
|
|
||||
|
|
||||
|
padding: 16px 83px 0px 84px; |
||||
|
bottom: 40px; |
||||
|
left: 69px; |
||||
|
} |
||||
|
|
||||
|
.name { |
||||
|
text-align: center; |
||||
|
} |
||||
|
h4 { |
||||
|
font-weight: 600; |
||||
|
margin-bottom: 1px; |
||||
|
|
||||
|
a { |
||||
|
text-decoration: none; |
||||
|
color: $color-black; |
||||
|
|
||||
|
&:hover { |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
p { |
||||
|
color: $color-grey; |
||||
|
margin-bottom: 0; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.footer_icons { |
||||
|
ul { |
||||
|
display: flex; |
||||
|
list-style: none; |
||||
|
padding-left: 0; |
||||
|
margin-bottom: 0; |
||||
|
|
||||
|
li { |
||||
|
color: $color-black; |
||||
|
|
||||
|
font-size: 14px; |
||||
|
width: 40px; |
||||
|
height: 40px; |
||||
|
|
||||
|
padding-top: 0; |
||||
|
|
||||
|
text-align: center; |
||||
|
padding-top: 11px; |
||||
|
|
||||
|
&:hover { |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,107 @@ |
|||||
|
.blog_main{ |
||||
|
.pagination{ |
||||
|
|
||||
|
display: flex; |
||||
|
justify-content: end; |
||||
|
margin: 0 auto;} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
.blog{ |
||||
|
margin-top: 0px; |
||||
|
margin-bottom: 0; |
||||
|
|
||||
|
@media screen and(max-width:767px) { |
||||
|
margin-bottom: 50px; |
||||
|
} |
||||
|
.blog_wrapper{ |
||||
|
.blog_img{ |
||||
|
|
||||
|
img{ |
||||
|
width: 100%; |
||||
|
border-radius: 5px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.blog_info{ |
||||
|
padding-top: 10px; |
||||
|
p{ |
||||
|
font-size: 14px; |
||||
|
margin-bottom: 0; |
||||
|
|
||||
|
a{color: $color-grey; |
||||
|
text-decoration: none; |
||||
|
|
||||
|
&:hover{ |
||||
|
color: $color-orange; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.blog_heading{ |
||||
|
|
||||
|
font-size: 24px; |
||||
|
font-weight: 600; |
||||
|
padding-bottom: 0; |
||||
|
a{color: $color-black; |
||||
|
text-decoration: none; |
||||
|
|
||||
|
&:hover{ |
||||
|
color: $color-orange; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
p{ |
||||
|
color: $color-grey; |
||||
|
padding-bottom: 12px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.blog_main{ |
||||
|
padding-top: 90px; |
||||
|
padding-bottom: 90px; |
||||
|
|
||||
|
.pagination{ |
||||
|
|
||||
|
|
||||
|
margin-top: 50px; |
||||
|
|
||||
|
ul{ |
||||
|
padding-left: 0; |
||||
|
list-style: none; |
||||
|
display: flex; |
||||
|
li{ |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
margin-left: 10px; |
||||
|
margin-right: 10px; |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
a{color: $color-orange; |
||||
|
padding: 8px 17px; |
||||
|
border-radius: 4px; |
||||
|
border: 1px solid ; |
||||
|
background-color: transparent !important; |
||||
|
text-decoration: none; |
||||
|
&:hover{ |
||||
|
background-color: $color-orange; |
||||
|
color: #000000; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
@ -0,0 +1,209 @@ |
|||||
|
.blogg { |
||||
|
margin-top: 90px; |
||||
|
margin-bottom: 90px; |
||||
|
|
||||
|
.blog_details { |
||||
|
max-width: 720px; |
||||
|
margin: 0 auto; |
||||
|
|
||||
|
.blog_wrapper { |
||||
|
.blog_img { |
||||
|
img { |
||||
|
width: 100%; |
||||
|
border-radius: 5px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.blog_info { |
||||
|
padding-top: 10px; |
||||
|
p { |
||||
|
font-size: 14px; |
||||
|
margin-bottom: 0; |
||||
|
|
||||
|
a { |
||||
|
color: $color-grey; |
||||
|
text-decoration: none; |
||||
|
|
||||
|
&:hover { |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.blog_heading { |
||||
|
font-size: 24px; |
||||
|
font-weight: 600; |
||||
|
padding-bottom: 0; |
||||
|
a { |
||||
|
color: $color-black; |
||||
|
text-decoration: none; |
||||
|
|
||||
|
&:hover { |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
p { |
||||
|
color: $color-grey; |
||||
|
padding-bottom: 12px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.blog_details_part2 { |
||||
|
margin-top: 50px; |
||||
|
.blog_words { |
||||
|
p { |
||||
|
color: $color-grey; |
||||
|
} |
||||
|
|
||||
|
p::first-letter { |
||||
|
color: $color-black; |
||||
|
float: left; |
||||
|
font-size: 5em; |
||||
|
|
||||
|
p { |
||||
|
color: $color-black; |
||||
|
} |
||||
|
|
||||
|
p::first-letter { |
||||
|
color: $color-black; |
||||
|
float: left; |
||||
|
font-size: 4em; |
||||
|
margin-right: 2px; |
||||
|
font-weight: 900; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.img2 { |
||||
|
img { |
||||
|
width: 100%; |
||||
|
border-radius: 5px; |
||||
|
} |
||||
|
|
||||
|
img:hover { |
||||
|
opacity: 0.7; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.para_3 { |
||||
|
padding-top: 40px; |
||||
|
margin-top: 10px; |
||||
|
color: $color-grey; |
||||
|
span { |
||||
|
color: $color-black; |
||||
|
} |
||||
|
} |
||||
|
.blog_details_part3 { |
||||
|
padding-top: 40px; |
||||
|
margin-top: 10px; |
||||
|
.wrapper { |
||||
|
.comment { |
||||
|
display: flex; |
||||
|
border: 1px solid; |
||||
|
border-radius: 5px; |
||||
|
border-color: #d2cfcf; |
||||
|
padding: 25px 25px; |
||||
|
.c_img { |
||||
|
max-width: 100%; |
||||
|
img { |
||||
|
width: 100%; |
||||
|
border-radius: 5px; |
||||
|
} |
||||
|
} |
||||
|
.c_info { |
||||
|
padding-left: 20px; |
||||
|
|
||||
|
@media screen and(max-width:576px) { |
||||
|
margin-top: 30px; |
||||
|
} |
||||
|
|
||||
|
h5 { |
||||
|
color: $color-black; |
||||
|
font-weight: 600; |
||||
|
} |
||||
|
p { |
||||
|
color: $color-grey; |
||||
|
} |
||||
|
|
||||
|
.footer_icons { |
||||
|
ul { |
||||
|
display: flex; |
||||
|
list-style: none; |
||||
|
padding-left: 0; |
||||
|
margin-top: 10px; |
||||
|
|
||||
|
li { |
||||
|
color: $color-black; |
||||
|
|
||||
|
font-size: 18px; |
||||
|
width: 40px; |
||||
|
height: 40px; |
||||
|
border-radius: 50%; |
||||
|
margin-right: 10px; |
||||
|
|
||||
|
text-align: center; |
||||
|
padding-top: 11px; |
||||
|
|
||||
|
&:hover { |
||||
|
background-color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.leave-comment-form { |
||||
|
padding-top: 50px; |
||||
|
.form_title { |
||||
|
color: $color-black; |
||||
|
font-weight: 700; |
||||
|
font-size: 40px; |
||||
|
text-transform: uppercase; |
||||
|
|
||||
|
padding-bottom: 20px; |
||||
|
span { |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
p { |
||||
|
color: $color-grey; |
||||
|
} |
||||
|
|
||||
|
.input-grids { |
||||
|
.form-control { |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.form-group input[type="email"] { |
||||
|
color: #000000; |
||||
|
|
||||
|
border: 2px solid #000000; |
||||
|
padding: 20px 20px; |
||||
|
} |
||||
|
|
||||
|
input[type="text"]:focus { |
||||
|
border-color: $color-orange !important; |
||||
|
background-color: #ffdbcd; /* oranges! yey */ |
||||
|
} |
||||
|
|
||||
|
.form-group input[type="text"] { |
||||
|
color: #000000; |
||||
|
|
||||
|
border: 2px solid #000000; |
||||
|
padding: 20px 20px; |
||||
|
} |
||||
|
.form-group textarea[type="text"] { |
||||
|
color: #000000; |
||||
|
|
||||
|
border: 2px solid #000000; |
||||
|
padding: 26px 20px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,140 @@ |
|||||
|
.contact{ |
||||
|
padding-top: 90px; |
||||
|
padding-bottom: 90px; |
||||
|
background-color: $color-bg; |
||||
|
|
||||
|
.contact_left{ |
||||
|
|
||||
|
p{margin-bottom: 5px;} |
||||
|
|
||||
|
.get_touch{ |
||||
|
padding-bottom: 25px; |
||||
|
.wrapper{ |
||||
|
h3{ |
||||
|
color: $color-black; |
||||
|
font-weight: 700; |
||||
|
font-size: $font-size-demo; |
||||
|
span{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
p{color: $color-grey;} |
||||
|
} |
||||
|
|
||||
|
.num_email{ |
||||
|
padding-top: 25px; |
||||
|
font-family: fantasy; |
||||
|
font-size: 16px; |
||||
|
|
||||
|
span{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
a{color: $color-black; |
||||
|
|
||||
|
&:hover{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
.address{ |
||||
|
color: $color-grey; |
||||
|
margin-top: 25px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.hours{ |
||||
|
.wrapper{ |
||||
|
h3{ |
||||
|
color: $color-black; |
||||
|
font-weight: 700; |
||||
|
font-size: $font-size-demo; |
||||
|
span{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
p{color: $color-grey;} |
||||
|
} |
||||
|
} |
||||
|
.service{ |
||||
|
h6{ |
||||
|
font-weight: 600; |
||||
|
padding-top: 25px; |
||||
|
font-size: 26px; |
||||
|
} |
||||
|
p{ |
||||
|
color: $color-grey; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
.contact_right{ |
||||
|
border-color: #e7e7e7 !important; |
||||
|
border: 11px solid; |
||||
|
.map { |
||||
|
width: 100%; |
||||
|
height: 500px; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.contact_form{ |
||||
|
|
||||
|
padding-top: 100px; |
||||
|
padding-bottom: 100px; |
||||
|
background-image: linear-gradient(rgba(17, 17, 17, 0.44), rgba(17, 17, 17, 0.64)), url(./../images/banner/banner4.jpg); |
||||
|
background-size: cover; |
||||
|
width: 100%; |
||||
|
background-repeat: no-repeat; |
||||
|
background-position: center; |
||||
|
background-attachment: fixed; |
||||
|
color: white; |
||||
|
|
||||
|
.c_form{ |
||||
|
|
||||
|
h2{ |
||||
|
font-weight: 700; |
||||
|
font-size: 40px; |
||||
|
padding-bottom: 30px; |
||||
|
} |
||||
|
.form-control{display: block; |
||||
|
width: 100%; |
||||
|
height: calc(1.5em + .75rem + 2px); |
||||
|
padding: 1.75rem .75rem; |
||||
|
font-size: 1rem; |
||||
|
font-weight: 400; |
||||
|
line-height: 1.5; |
||||
|
color: #495057; |
||||
|
background-color: #fff; |
||||
|
background-clip: padding-box; |
||||
|
border: 1px solid #ced4da; |
||||
|
border-radius: .25rem; |
||||
|
transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;} |
||||
|
} |
||||
|
|
||||
|
.form-control2{display: block; |
||||
|
width: 100%; |
||||
|
height: calc(2em + .75rem + 2px); |
||||
|
padding: 2.75rem .75rem; |
||||
|
font-size: 1rem; |
||||
|
font-weight: 400; |
||||
|
line-height: 1.5; |
||||
|
color: #495057; |
||||
|
background-color: #fff; |
||||
|
background-clip: padding-box; |
||||
|
border: 1px solid #ced4da; |
||||
|
border-radius: .25rem; |
||||
|
transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out; |
||||
|
textarea{ |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
textarea{ |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,7 @@ |
|||||
|
@import './home/home'; |
||||
|
@import './about'; |
||||
|
@import './shop'; |
||||
|
@import './preview'; |
||||
|
@import './contact'; |
||||
|
@import './blog'; |
||||
|
@import './blog_details'; |
||||
@ -0,0 +1,412 @@ |
|||||
|
.preview{ |
||||
|
|
||||
|
margin-top: 90px; |
||||
|
margin-bottom: 90px; |
||||
|
|
||||
|
.product_preview{ |
||||
|
|
||||
|
.wrapper{ |
||||
|
width: 100%; |
||||
|
img{ |
||||
|
width: 100%; |
||||
|
max-height: 600px; |
||||
|
border-radius: 5px; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
} |
||||
|
|
||||
|
.pre_under{ |
||||
|
|
||||
|
@media screen and(max-width:991px) { |
||||
|
|
||||
|
ul{ |
||||
|
padding-left: 0; |
||||
|
margin-top: 10px; |
||||
|
display: flex; |
||||
|
list-style: none; |
||||
|
|
||||
|
li{ |
||||
|
margin-right: 15px; |
||||
|
width: 100%!important; |
||||
|
|
||||
|
|
||||
|
&:last-child{ |
||||
|
margin-right: 0; |
||||
|
} |
||||
|
img{ |
||||
|
width: 100%; |
||||
|
border-radius: 3px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
ul{ |
||||
|
padding-left: 0; |
||||
|
margin-top: 10px; |
||||
|
display: flex; |
||||
|
list-style: none; |
||||
|
|
||||
|
li{ |
||||
|
margin-right: 15px; |
||||
|
width: 100%; |
||||
|
|
||||
|
|
||||
|
&:last-child{ |
||||
|
margin-right: 0; |
||||
|
} |
||||
|
img{ |
||||
|
width: 100%; |
||||
|
border-radius: 3px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.button_wrapper{ |
||||
|
margin-top: 35px; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
} |
||||
|
|
||||
|
.pre_head{ |
||||
|
h3{ |
||||
|
color: $color-black; |
||||
|
text-transform: uppercase; |
||||
|
font-weight: 700; |
||||
|
|
||||
|
@media screen and(max-width:991px) { |
||||
|
margin-top: 45px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.star{ |
||||
|
display: flex; |
||||
|
align-items: baseline; |
||||
|
ul{ |
||||
|
padding-left: 16px; |
||||
|
margin-top: 20px; |
||||
|
list-style: none; |
||||
|
font-size: 14px; |
||||
|
margin-right: 20px; |
||||
|
li{ |
||||
|
|
||||
|
&:hover{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
a{ |
||||
|
margin-right: 5px; |
||||
|
color: $color-black; |
||||
|
|
||||
|
&:hover{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.price{ |
||||
|
|
||||
|
p{ |
||||
|
|
||||
|
font-size: 20px; |
||||
|
|
||||
|
span{ |
||||
|
color: $color-orange; |
||||
|
font-size: 22px; |
||||
|
font-weight: 700; |
||||
|
margin-right: 20px; |
||||
|
} |
||||
|
.old_rate{ |
||||
|
font-size: 18px; |
||||
|
font-weight: 600; |
||||
|
color: $color-grey; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.bank_offer{ |
||||
|
ul{ |
||||
|
margin-top: 14px; |
||||
|
padding-left: 4px; |
||||
|
list-style: none; |
||||
|
li{ |
||||
|
color: $color-grey; |
||||
|
font-size: 16px; |
||||
|
span{ |
||||
|
font-weight: 600; |
||||
|
font-size: 18px; |
||||
|
color:darken(($color-grey), 5%) !important; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.description{ |
||||
|
padding-top: 8px; |
||||
|
|
||||
|
h3{ |
||||
|
color: $color-black; |
||||
|
font-weight: 700; |
||||
|
text-transform: uppercase; |
||||
|
} |
||||
|
p{ |
||||
|
color: $color-grey; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.HS{ |
||||
|
display: flex; |
||||
|
padding-top: 8px; |
||||
|
justify-content: space-between; |
||||
|
margin-bottom: 20px; |
||||
|
h3{ |
||||
|
color: $color-black; |
||||
|
font-weight: 700; |
||||
|
padding-bottom: 10px; |
||||
|
text-transform: uppercase; |
||||
|
} |
||||
|
|
||||
|
.Highlights{ |
||||
|
ul{color: $color-grey; |
||||
|
padding-left: 14px; |
||||
|
li{ |
||||
|
margin-bottom: 10px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.service{ |
||||
|
ul{color: $color-grey; |
||||
|
|
||||
|
li{ |
||||
|
margin-bottom: 10px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.location{ |
||||
|
h6{ |
||||
|
color: $color-black; |
||||
|
font-weight: 600; |
||||
|
|
||||
|
text-transform: uppercase; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
.signin-form{ |
||||
|
margin-top: 0; |
||||
|
} |
||||
|
.forms-gds{ |
||||
|
display: grid; |
||||
|
grid-template-columns: 2fr 1fr; |
||||
|
|
||||
|
|
||||
|
.form-input{ |
||||
|
input{ |
||||
|
|
||||
|
width: 100%; |
||||
|
background-color: $color-bg; |
||||
|
border-top-left-radius: 25px; |
||||
|
border-bottom-left-radius: 25px; |
||||
|
border: none; |
||||
|
padding: 15px 30px; |
||||
|
color:#2f2f2f; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
.men_women{ |
||||
|
background-color: $color-bg; |
||||
|
padding-top: 90px; |
||||
|
padding-bottom: 90px; |
||||
|
margin-bottom: 70px; |
||||
|
|
||||
|
.men{ |
||||
|
|
||||
|
|
||||
|
@media screen and(max-width:767px) { |
||||
|
|
||||
|
padding-bottom: 20px; |
||||
|
|
||||
|
} |
||||
|
position: relative; |
||||
|
img{ |
||||
|
width: 100%; |
||||
|
border-radius: 5px; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.inside{ |
||||
|
|
||||
|
bottom: 35px; |
||||
|
left: 45px; |
||||
|
border-radius: 7px; |
||||
|
position: absolute; |
||||
|
background-color: #0000008a; |
||||
|
padding: 26px 52px; |
||||
|
|
||||
|
@media screen and(max-width:1199px) { |
||||
|
bottom: 22px; |
||||
|
left: 52px; |
||||
|
border-radius: 7px; |
||||
|
position: absolute; |
||||
|
background-color: |
||||
|
#0000008a; |
||||
|
padding: 29px 74px; |
||||
|
} |
||||
|
@media screen and(max-width:991px) { |
||||
|
bottom: 18px; |
||||
|
left: 45px; |
||||
|
border-radius: 7px; |
||||
|
position: absolute; |
||||
|
background-color: #0000008a; |
||||
|
padding: 10px 42px; |
||||
|
} |
||||
|
|
||||
|
@media screen and(max-width:767px) { |
||||
|
bottom: 64px; |
||||
|
left: 66px; |
||||
|
border-radius: 7px; |
||||
|
position: absolute; |
||||
|
background-color: #0000008a; |
||||
|
padding: 10px 42px; |
||||
|
} |
||||
|
@media screen and(max-width:500px) { |
||||
|
bottom: 52px; |
||||
|
left: 61px; |
||||
|
border-radius: 7px; |
||||
|
position: absolute; |
||||
|
background-color: #0000008a; |
||||
|
padding: 10px 42px; |
||||
|
} |
||||
|
|
||||
|
p{ |
||||
|
color: $color-white; |
||||
|
font-size: 35px; |
||||
|
font-weight: 700; |
||||
|
@media screen and(max-width:1199px) { |
||||
|
font-size: 25px; |
||||
|
} |
||||
|
@media screen and(max-width:991px) { |
||||
|
font-size: 16px; |
||||
|
font-weight: 600; |
||||
|
} |
||||
|
|
||||
|
@media screen and(max-width:767px) { |
||||
|
font-size: 35px; |
||||
|
font-weight: 700; |
||||
|
} |
||||
|
@media screen and(max-width:500px) { |
||||
|
font-size: 20px; |
||||
|
font-weight: 600; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.Featured{ |
||||
|
margin-top: 90px; |
||||
|
|
||||
|
h1{ |
||||
|
|
||||
|
font-weight: 700; |
||||
|
margin-bottom: 10px; |
||||
|
span{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
p{ |
||||
|
color: $color-grey; |
||||
|
font-size: $font-sub-head; |
||||
|
} |
||||
|
|
||||
|
.product_section{ |
||||
|
padding-top:40px ; |
||||
|
} |
||||
|
|
||||
|
.img_wrapper{ |
||||
|
|
||||
|
position: relative; |
||||
|
img{ |
||||
|
width: 100%; |
||||
|
|
||||
|
|
||||
|
&:hover { |
||||
|
opacity: 1; |
||||
|
-webkit-animation: flash 1.5s; |
||||
|
animation: flash 1.5s; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
.product_details{ |
||||
|
|
||||
|
|
||||
|
a{ |
||||
|
text-decoration: none !important; |
||||
|
} |
||||
|
h4{ |
||||
|
text-decoration: none !important; |
||||
|
font-weight: 600; |
||||
|
color: $color-black !important; |
||||
|
&:hover{ |
||||
|
color: $color-orange !important; |
||||
|
} |
||||
|
} |
||||
|
.old_rate{ |
||||
|
color: $color-grey !important; |
||||
|
margin-right: 10px; |
||||
|
font-weight: normal; |
||||
|
} |
||||
|
span{ |
||||
|
font-weight: 600; |
||||
|
color: $color-black; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
img{ |
||||
|
width: 100%; |
||||
|
border-radius: 7px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.img_wrapper:hover .button { |
||||
|
position: absolute; |
||||
|
display: block; |
||||
|
text-decoration: none !important; |
||||
|
top: 275px; |
||||
|
padding: 9px 75px; |
||||
|
font-size: 20px; |
||||
|
text-align: center; |
||||
|
color: #ffffff; |
||||
|
background-color: #ff7315; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
.button{ |
||||
|
display:none; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
@ -0,0 +1,223 @@ |
|||||
|
.shop{ |
||||
|
padding-bottom: 40px; |
||||
|
|
||||
|
|
||||
|
.pagination{ |
||||
|
|
||||
|
display: flex; |
||||
|
justify-content: end; |
||||
|
margin: 0 auto; |
||||
|
|
||||
|
ul{ |
||||
|
list-style: none; |
||||
|
display: flex; |
||||
|
padding-left: 0; |
||||
|
li{ |
||||
|
margin-left: 10px; |
||||
|
margin-right: 10px; |
||||
|
|
||||
|
a{color: $color-orange; |
||||
|
padding: 8px 17px; |
||||
|
border-radius: 4px; |
||||
|
border: 1px solid ; |
||||
|
background-color: transparent !important; |
||||
|
text-decoration: none; |
||||
|
&:hover{ |
||||
|
background-color: $color-orange; |
||||
|
color: #000000; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
.p_top{ |
||||
|
h4{ |
||||
|
font-size: 24px; |
||||
|
color: $color-grey; |
||||
|
font-weight: 600; |
||||
|
@media screen and(max-width:991px) { |
||||
|
font-size: 18px; |
||||
|
} |
||||
|
@media screen and(max-width:767px) { |
||||
|
font-size: 14px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
.product{ |
||||
|
margin-top: 90px; |
||||
|
|
||||
|
h1{ |
||||
|
|
||||
|
font-weight: 700; |
||||
|
margin-bottom: 10px; |
||||
|
span{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
p{ |
||||
|
color: $color-grey; |
||||
|
font-size: $font-sub-head; |
||||
|
} |
||||
|
|
||||
|
.product_sectoin{ |
||||
|
padding-top:70px ; |
||||
|
|
||||
|
@media screen and(max-width:991px) { |
||||
|
padding-top:40px ; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.img_wrapper{ |
||||
|
max-width: 200px; |
||||
|
position: relative; |
||||
|
img{ |
||||
|
width: 100%; |
||||
|
|
||||
|
|
||||
|
&:hover { |
||||
|
opacity: 1; |
||||
|
-webkit-animation: flash 1.5s; |
||||
|
animation: flash 1.5s; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
.product_details{ |
||||
|
|
||||
|
|
||||
|
a{ |
||||
|
text-decoration: none !important; |
||||
|
} |
||||
|
h4{ |
||||
|
font-size: 16px; |
||||
|
text-decoration: none !important; |
||||
|
font-weight: 600; |
||||
|
color: $color-black !important; |
||||
|
&:hover{ |
||||
|
color: $color-orange !important; |
||||
|
} |
||||
|
} |
||||
|
.old_rate{ |
||||
|
color: $color-grey !important; |
||||
|
margin-right: 10px; |
||||
|
font-weight: normal; |
||||
|
} |
||||
|
span{ |
||||
|
font-weight: 600; |
||||
|
color: $color-black; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
img{ |
||||
|
width: 100%; |
||||
|
border-radius: 7px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.img_wrapper:hover .button { |
||||
|
position: absolute; |
||||
|
display: block; |
||||
|
text-decoration: none !important; |
||||
|
top: 216px; |
||||
|
padding: 12px 30px; |
||||
|
width: 100%; |
||||
|
font-size: 13px; |
||||
|
text-align: center; |
||||
|
color: #ffffff; |
||||
|
background-color: #ff7315; |
||||
|
font-weight: 700; |
||||
|
|
||||
|
@media screen and(max-width:1199px) { |
||||
|
|
||||
|
top: 188px; |
||||
|
width: 100%; |
||||
|
padding: 9px 30px; |
||||
|
font-size: 13px; |
||||
|
text-align: center; |
||||
|
|
||||
|
} |
||||
|
@media screen and(max-width:991px) { |
||||
|
|
||||
|
top: 175px; |
||||
|
width: 100%; |
||||
|
padding: 9px 30px; |
||||
|
font-size: 13px; |
||||
|
text-align: center; |
||||
|
|
||||
|
} |
||||
|
@media screen and(max-width:767px) { |
||||
|
|
||||
|
top: 221px; |
||||
|
width: 100%; |
||||
|
padding: 9px 30px; |
||||
|
font-size: 13px; |
||||
|
text-align: center; |
||||
|
|
||||
|
} |
||||
|
@media screen and(max-width:462px) { |
||||
|
|
||||
|
top: 201px; |
||||
|
width: 100%; |
||||
|
padding: 9px 30px; |
||||
|
font-size: 13px; |
||||
|
text-align: center; |
||||
|
|
||||
|
} |
||||
|
@media screen and(max-width:370px) { |
||||
|
|
||||
|
top: 190px; |
||||
|
width: 100%; |
||||
|
padding: 9px 30px; |
||||
|
font-size: 13px; |
||||
|
text-align: center; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
.button{ |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
@-webkit-keyframes flash { |
||||
|
0% { opacity: .3; } |
||||
|
100% { opacity: 1; } |
||||
|
} |
||||
|
@keyframes flash { |
||||
|
0% { opacity: .3; } |
||||
|
100% { opacity: 1; } |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,80 @@ |
|||||
|
.blog{ |
||||
|
margin-top: 90px; |
||||
|
margin-bottom: 90px; |
||||
|
h1{ |
||||
|
|
||||
|
font-weight: 700; |
||||
|
margin-bottom: 10px; |
||||
|
span{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
p{ |
||||
|
color: $color-grey; |
||||
|
font-size: $font-sub-head; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.blog_contents{ |
||||
|
padding-top: 40px; |
||||
|
} |
||||
|
.card{ |
||||
|
background: transparent; |
||||
|
background-color:#f4f4f4; |
||||
|
border: none; |
||||
|
overflow: hidden; |
||||
|
|
||||
|
#zoomIn{ |
||||
|
|
||||
|
transform: scale(1); |
||||
|
transition: .3s ease-in-out; |
||||
|
border-radius: 6px 6px 0px 0px; |
||||
|
-webkit-border-radius: 6px 6px 0px 0px; |
||||
|
-o-border-radius: 6px 6px 0px 0px; |
||||
|
-moz-border-radius: 6px 6px 0px 0px; |
||||
|
|
||||
|
&:hover{ |
||||
|
|
||||
|
transform: scale(1.3); |
||||
|
border-radius: 6px 6px 0px 0px; |
||||
|
-webkit-border-radius: 6px 6px 0px 0px; |
||||
|
-o-border-radius: 6px 6px 0px 0px; |
||||
|
-moz-border-radius: 6px 6px 0px 0px; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
ul{ |
||||
|
margin-top: 30px; |
||||
|
list-style: none; |
||||
|
li{ |
||||
|
margin-right: 10px; |
||||
|
background: transparent; |
||||
|
border: none; |
||||
|
|
||||
|
&:last-child{ |
||||
|
color:$color-grey; |
||||
|
border-left: 1px solid; |
||||
|
border-color: $color-grey; |
||||
|
padding-left: 10px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.card-body{ |
||||
|
padding-top: 0; |
||||
|
a{ |
||||
|
|
||||
|
color: $color-black; |
||||
|
font-weight: 600; |
||||
|
font-size: $font-sub-blog; |
||||
|
&:hover{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
} |
||||
@ -0,0 +1,132 @@ |
|||||
|
.customer_review{ |
||||
|
margin-top: 30px; |
||||
|
|
||||
|
padding-top: 50px; |
||||
|
padding-bottom:100px; |
||||
|
background-color:$color-bg; |
||||
|
|
||||
|
|
||||
|
h1{ |
||||
|
|
||||
|
font-weight: 700; |
||||
|
margin-bottom: 10px; |
||||
|
span{ |
||||
|
color: $color-orange; |
||||
|
} |
||||
|
} |
||||
|
p{ |
||||
|
color: $color-grey; |
||||
|
font-size: $font-sub-head; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
.carousel-inner{ |
||||
|
|
||||
|
|
||||
|
padding-top: 50px; |
||||
|
padding-bottom:40px; |
||||
|
|
||||
|
.review{ |
||||
|
color: $color-white; |
||||
|
background-color: $color-carousel; |
||||
|
padding: 30px 50px; |
||||
|
border-radius: 5px; |
||||
|
position: relative; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.traingle{ |
||||
|
|
||||
|
|
||||
|
|
||||
|
&:after{ |
||||
|
content:""; |
||||
|
width: 0; |
||||
|
height: 0; |
||||
|
border-left: 10px solid transparent; |
||||
|
border-right: 10px solid transparent; |
||||
|
border-top: 15px solid $color-carousel; |
||||
|
position: absolute; |
||||
|
left: 132px; |
||||
|
top: 280px; |
||||
|
|
||||
|
@media screen and(max-width:1199px) { |
||||
|
|
||||
|
left: 110px; |
||||
|
top: 353px; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
@media screen and(max-width:991px) { |
||||
|
|
||||
|
left: 170px; |
||||
|
top: 232px; |
||||
|
|
||||
|
} |
||||
|
@media screen and(max-width:767px) { |
||||
|
|
||||
|
left: 260px; |
||||
|
top: 185px; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
.carousel-control-next-icon, .carousel-control-prev-icon{ |
||||
|
display: none; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.carousel-indicators { |
||||
|
bottom: -59px; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.carousel-indicators li { |
||||
|
box-sizing: content-box; |
||||
|
-ms-flex: 0 1 auto; |
||||
|
flex: 0 1 auto; |
||||
|
width: 13px; |
||||
|
height: 13px; |
||||
|
border-radius: 50%; |
||||
|
margin-right: 4px; |
||||
|
margin-left: 5px; |
||||
|
text-indent: -999px; |
||||
|
cursor: pointer; |
||||
|
background-color: #aeb3b1; |
||||
|
background-clip: padding-box; |
||||
|
border-top: 10px solid transparent; |
||||
|
border-bottom: 10px solid transparent; |
||||
|
opacity: .5; |
||||
|
transition: opacity .6s ease; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.customer{ |
||||
|
padding-top: 40px; |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
img{ |
||||
|
max-width: 70px; |
||||
|
border-radius: 50%; |
||||
|
border: 3px solid #b8b9bd; |
||||
|
} |
||||
|
|
||||
|
@media screen and(max-width:991px) { |
||||
|
|
||||
|
padding-bottom: 30px; |
||||
|
|
||||
|
}; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.quote{ |
||||
|
color: $color-orange; |
||||
|
|
||||
|
font-size: 25px; |
||||
|
} |
||||
|
|
||||
|
} |
||||
Some files were not shown because too many files changed in this diff
Loading…
Reference in new issue