[ADD] Initila Commit

theme_fuge/README.rst

@@ -0,0 +1,41 @@
+Theme Fuge
+==========
+* Design Web Pages with Theme Fuge
+
+Installation
+============
+	- www.odoo.com/documentation/14.0/setup/install.html
+	- Install our custom addon
+
+License
+-------
+General Public License, Version 3 (LGPL v3).
+(https://www.odoo.com/documentation/user/13.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>`__
+

theme_fuge/__init__.py

@@ -0,0 +1,5 @@
+# -*- coding: utf-8 -*-
+from . import controllers
+from . import models
+
+

theme_fuge/__manifest__.py

@@ -0,0 +1,65 @@
+# -*- 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': 'Theme Fuge is a new kind of Theme. '
+               'The theme is a very user-friendly and is suitable for your eCommerce website with blog.',
+    'category': 'Theme/eCommerce',
+    'version': '14.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', 'website_blog'],
+    'data': [
+        'views/assets.xml',
+        'views/header.xml',
+        'views/views.xml',
+        'views/blog.xml',
+        'views/blog_details.xml',
+        'views/popular_posts.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',
+        'views/about.xml',
+        'views/contact.xml',
+        'views/shop_view.xml',
+        'views/product_view.xml',
+        'views/shop_sidebar_view.xml',
+        'views/footer.xml',
+    ],
+    'images': [
+        'static/description/banner.png',
+        'static/description/theme_screenshot.png',
+    ],
+
+    'license': 'LGPL-3',
+    'installable': True,
+    'application': False,
+    'auto_install': False,
+}

theme_fuge/controllers/__init__.py

@@ -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 popular_post
+from . import main
+

theme_fuge/controllers/main.py

@@ -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()

theme_fuge/controllers/popular_post.py

@@ -0,0 +1,69 @@
+# -*- 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

theme_fuge/doc/RELEASE_NOTES.md

@@ -0,0 +1,6 @@
+## Module <theme_fuge>
+
+#### 20.08.2021
+#### Version 14.0.1.0.0
+#### ADD
+- Initial commit for Theme Fuge

theme_fuge/models/__init__.py

@@ -0,0 +1,23 @@
+# -*- 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
+from . import rating

theme_fuge/models/rating.py

@@ -0,0 +1,43 @@
+# -*- 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, fields
+
+
+class Rating(models.Model):
+    _inherit = 'product.template'
+
+    def _count_rating_count(self):
+        for rec in self:
+            reviews = rec.rating_get_stats()
+            count_avg = reviews.get('avg')
+            rec.rating_count = count_avg
+
+    def _count_rating_total(self):
+        for rec in self:
+            reviews = rec.rating_get_stats()
+            count_total = reviews.get('total')
+            rec.rating_total = count_total
+
+    rating_count = fields.Float(compute='_count_rating_count', string='Average Rating')
+    rating_total = fields.Integer(compute='_count_rating_total', string='Total Rating')
+

theme_fuge/models/theme_fuge.py

@@ -0,0 +1,34 @@
+# -*- 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 ThemeFuge(models.AbstractModel):
+    _inherit = 'theme.utils'
+
+    def _theme_fuge_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')

theme_fuge/static/description/index.html

@@ -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 -->
+
+    <!--&lt;!&ndash; Video Section &ndash;&gt;-->
+    <!--<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>-->
+    <!--&lt;!&ndash; End of Video Section&ndash;&gt;-->
+
+    <!-- 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>

theme_fuge/static/src/css/owl.carousel.min.css

@@ -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%}

theme_fuge/static/src/css/owl.theme.default.min.css

@@ -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}

theme_fuge/static/src/js/custom_background.js

@@ -0,0 +1,12 @@
+var div = $('div').hasClass('homepage');
+
+    if(div){
+    $('.navbar').css('background-color','rgb(114, 89, 89)');
+    $('.navbar').css('z-index','0');
+    $('.banner').css('margin-bottom','0');
+    }
+    else {
+     $('.navbar').css('background-color','rgb(114, 89, 89)');
+     $('.banner').css('margin-bottom','100px');
+     }
+

theme_fuge/static/src/js/product.js

@@ -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);
+                }
+            });
+        }
+    });
+});

theme_fuge/static/src/scss/_normalize.scss

@@ -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;
+  }
+  

theme_fuge/static/src/scss/_variables.scss

@@ -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;

theme_fuge/static/src/scss/components/_buttons.scss

@@ -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;
+        }
+    }
+
+
+}

theme_fuge/static/src/scss/components/_components.scss

@@ -0,0 +1,2 @@
+@import './buttons';
+@import './product';

theme_fuge/static/src/scss/components/_product.scss

@@ -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; }
+   }

theme_fuge/static/src/scss/layout/_footer.scss

@@ -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;
+
+            }
+        }
+    }
+

theme_fuge/static/src/scss/layout/_header.scss

@@ -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;
+    }
+
+    
+}

theme_fuge/static/src/scss/layout/_layouts.scss

@@ -0,0 +1,5 @@
+@import './header';
+@import './navigation';
+@import './footer';
+@import './sidebar';
+@import './sidebar2';

theme_fuge/static/src/scss/layout/_navigation.scss

@@ -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;
+}

theme_fuge/static/src/scss/layout/_sidebar.scss

@@ -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;
+}

theme_fuge/static/src/scss/layout/_sidebar2.scss

@@ -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;
+          }

theme_fuge/static/src/scss/pages/_about.scss

@@ -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;
+                        }
+                    }
+                }
+            }
+        }
+    }
+}