diff --git a/theme_shopping/README.rst b/theme_shopping/README.rst new file mode 100755 index 000000000..5cf728d96 --- /dev/null +++ b/theme_shopping/README.rst @@ -0,0 +1,76 @@ +.. image:: https://img.shields.io/badge/license-AGPL--3-blue.svg + :target: https://www.gnu.org/licenses/agpl-3.0-standalone.html + :alt: License: AGPL-3 + +Theme Shopping +============== +Theme Shopping module provide attractive and unique front end theme mainly +suitable for eCommerce website + +Configuration +============= +Top Deal product Flow: + - Enabling and Managing 'Top Deal' for a Product: + * Navigate to: Products -> Top Deal + * Enable the 'Top Deal' boolean field for the desired product + + - Setting Deal Details + * Once enabled, new fields appear under Products -> General Information: + - Offer Price + - Planned Date + * Set the offer price + * Select the time period for the event + * Click the 'Apply' button to confirm the date + + - Deal Visibility and Duration + * The product is added to the Top Deal carousel for the specified period + * When the time period ends, the product is automatically removed from the carousel + + - Product Detail Page Display + * The Top Deal offer price is shown + * The original price is displayed with a strikethrough + +Winter Collections : + Adding Products to the Winter Collection: + - Navigate to: Products -> General Information -> Category + - Under the "Category" section, select "Winter Collection" from the product category options. + - Add the desired products to this category. + - These products will be available in the Winter Collection snippets. +Testimonial Snippet: + -Only admin allowed users can submit their testimonials. + -All submited testimonials will be displayed for all users. + +License +------- +General Public License, Version 3 (AGPL v3). +(https://www.gnu.org/licenses/agpl-3.0-standalone.html) + +Company +------- +* `Cybrosys Techno Solutions `__ + +Credits +------- +Developer: (V17) Sabeel B, V(17) Shikhil Raj, (V18) Anaswara S Sunil +Contact: odoo@cybrosys.com + +Contacts +-------- +* Mail Contact : odoo@cybrosys.com +* Website : https://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 +========== +.. image:: https://cybrosys.com/images/logo.png + :target: https://cybrosys.com +This module is maintained by Cybrosys Technologies. + +For support and more information, please visit `Our Website `__ + +Further information +=================== +HTML Description: ``__ diff --git a/theme_shopping/__init__.py b/theme_shopping/__init__.py new file mode 100644 index 000000000..14b11c674 --- /dev/null +++ b/theme_shopping/__init__.py @@ -0,0 +1,23 @@ +# -*- coding: utf-8 -*- +############################################################################### +# +# Cybrosys Technologies Pvt. Ltd. +# +# Copyright (C) 2025-TODAY Cybrosys Technologies() +# Author: Cybrosys Techno Solutions (odoo@cybrosys.com) +# +# You can modify it under the terms of the GNU AFFERO +# GENERAL PUBLIC LICENSE (AGPL 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 AFFERO GENERAL PUBLIC LICENSE (AGPL v3) for more details. +# +# You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE +# (AGPL v3) along with this program. +# If not, see . +# +############################################################################### +from . import controllers +from . import models diff --git a/theme_shopping/__manifest__.py b/theme_shopping/__manifest__.py new file mode 100644 index 000000000..b8ab5d604 --- /dev/null +++ b/theme_shopping/__manifest__.py @@ -0,0 +1,93 @@ +# -*- coding: utf-8 -*- +############################################################################### +# +# Cybrosys Technologies Pvt. Ltd. +# +# Copyright (C) 2025-TODAY Cybrosys Technologies() +# Author: Cybrosys Techno Solutions (odoo@cybrosys.com) +# +# You can modify it under the terms of the GNU AFFERO +# GENERAL PUBLIC LICENSE (AGPL 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 AFFERO GENERAL PUBLIC LICENSE (AGPL v3) for more details. +# +# You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE +# (AGPL v3) along with this program. +# If not, see . +# +############################################################################### +{ + 'name': 'Theme Shopping', + 'version': '18.0.1.0.0', + 'category': 'Theme/eCommerce', + 'summary': "Theme Shopping is an attractive and modern eCommerce Website " + "theme", + 'description': "Theme Shopping is new kind of Theme.The theme is very " + "user-friendly" + "and suitable for your eCommerce website with blog", + 'author': 'Cybrosys Techno Solutions', + 'company': 'Cybrosys Techno Solutions', + 'maintainer': 'Cybrosys Techno Solutions', + 'website': "https://www.cybrosys.com", + 'depends': ['base','sale_management', 'website_blog', 'website_sale_wishlist', + 'website_sale','website', + 'website_sale_comparison', 'website_mass_mailing'], + 'data': [ + 'security/ir.model.access.csv', + 'security/security_groups.xml', + 'views/header_templates.xml', + 'views/footer_templates.xml', + 'views/add_testimonial.xml', + 'views/about_us_views.xml', + 'views/blog_templates.xml', + 'views/snippets/frequently_asked.xml', + 'views/snippets/our_team.xml', + 'views/snippets/new_testimonial_snippet.xml', + 'views/snippets/offers.xml', + 'views/snippets/winter_collections.xml', + 'views/snippets/price_collection.xml', + 'views/snippets/subscription.xml', + 'views/shop_templates.xml', + 'views/snippets.xml', + 'views/product_template_views.xml', + 'views/snippets/top_deal_carousal_templates.xml', + 'views/website_sale_wishlist_template.xml', + 'data/ir_cron.xml', + 'views/homepage_snippets.xml' + ], + 'demo': ['data/product_category_data.xml'], + 'assets': { + 'web.assets_frontend': [ + "theme_shopping/static/src/js/top_deal_carousel/top_deal_content.xml", + "theme_shopping/static/src/js/top_deal_carousel/top_deal_carousal.js", + "theme_shopping/static/src/js/winter_collection_carousel/winter_products_content.xml", + "theme_shopping/static/src/js/winter_collection_carousel/winter_products_carousel.js", + "theme_shopping/static/src/js/testimonial.js", + "theme_shopping/static/src/js/subscription/subscription.js", + "theme_shopping/static/src/js/snippet_carousel.js", + "theme_shopping/static/src/css/main.css", + "theme_shopping/static/src/css/owl.carousel.min.css", + "theme_shopping/static/src/css/owl.theme.default.min.css", + "theme_shopping/static/src/js/owl.carousel.js", + "theme_shopping/static/src/js/owl.carousel.min.js", + "theme_shopping/static/src/js/product_review.js", + ], + 'web.assets_backend': [ + "theme_shopping/static/src/js/welcome_message.js" + ], + }, + 'images': [ + 'static/description/banner.jpg', + 'static/description/theme_screenshot.jpg', + ], + 'images_preview_theme': { + 'website.s_cover_default_image': '/theme_shopping/static/description/images/banner.jpg', + }, + 'license': 'AGPL-3', + 'installable': True, + 'auto_install': False, + 'application': False, +} diff --git a/theme_shopping/controllers/__init__.py b/theme_shopping/controllers/__init__.py new file mode 100644 index 000000000..8319aacb3 --- /dev/null +++ b/theme_shopping/controllers/__init__.py @@ -0,0 +1,25 @@ +# -*- coding: utf-8 -*- +############################################################################### +# +# Cybrosys Technologies Pvt. Ltd. +# +# Copyright (C) 2025-TODAY Cybrosys Technologies() +# Author: Cybrosys Techno Solutions (odoo@cybrosys.com) +# +# You can modify it under the terms of the GNU AFFERO +# GENERAL PUBLIC LICENSE (AGPL 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 AFFERO GENERAL PUBLIC LICENSE (AGPL v3) for more details. +# +# You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE +# (AGPL v3) along with this program. +# If not, see . +# +############################################################################### +from . import dynamic_snippets +from . import theme_shopping +from . import testimonial + diff --git a/theme_shopping/controllers/dynamic_snippets.py b/theme_shopping/controllers/dynamic_snippets.py new file mode 100644 index 000000000..ea4e38e3f --- /dev/null +++ b/theme_shopping/controllers/dynamic_snippets.py @@ -0,0 +1,74 @@ +# -*- coding: utf-8 -*- +############################################################################### +# +# Cybrosys Technologies Pvt. Ltd. +# +# Copyright (C) 2025-TODAY Cybrosys Technologies() +# Author: Cybrosys Techno Solutions (odoo@cybrosys.com) +# +# You can modify it under the terms of the GNU AFFERO +# GENERAL PUBLIC LICENSE (AGPL 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 AFFERO GENERAL PUBLIC LICENSE (AGPL v3) for more details. +# +# You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE +# (AGPL v3) along with this program. +# If not, see . +# +############################################################################### +from odoo import http +from odoo.http import request + + +class DynamicSnippets(http.Controller): + """This class is for the getting values for dynamic product snippets + """ + @http.route('/top_deal_product_snippet', auth='public', type='json', + website=True) + def get_best_products(self): + """Controller to reflect chosen products in 'Top Deal' + snippet""" + products = [] + products_search_read = request.env['product.product'].with_user( + 1).search_read( + [('is_published', '=', True), + ('is_top_deal_product', '=', True), + ('ready_to_top_deal', '=', True)], + ['name', 'image_1920', 'website_id', + 'sales_count', 'list_price','actual_price', 'offer_price', 'product_tmpl_id', 'website_url']) + unique_products = [] + seen_tmpl_ids = set() + for product in products_search_read: + if product['product_tmpl_id'][0] not in seen_tmpl_ids: + unique_products.append(product) + seen_tmpl_ids.add(product['product_tmpl_id'][0]) + for product in unique_products: + products.append(product) + response = http.Response( + template='theme_shopping.best_deal_product_carousel_snippet', + qcontext={'products': products}) + return products + + @http.route('/get_winter_product_snippet', auth='public', type='json', + website=True) + def get_winter_products(self): + """Controller to reflect chosen products in 'Winter Collection' + snippet""" + products = [] + products_search_read = request.env['product.product'].with_user( + 1).search_read( + [('is_published', '=', True), + ('categ_id', '=', request.env.ref( + 'theme_shopping.product_category_winter').id)], + ['name', 'image_1920', 'website_id', + 'sales_count', 'list_price', 'website_url']) + for product in products_search_read: + products.append(product) + + response = http.Response( + template='theme_shopping.winter_product_carousel_snippet', + qcontext={'products': products}) + return products diff --git a/theme_shopping/controllers/testimonial.py b/theme_shopping/controllers/testimonial.py new file mode 100644 index 000000000..6fa798b7c --- /dev/null +++ b/theme_shopping/controllers/testimonial.py @@ -0,0 +1,64 @@ +# -*- coding: utf-8 -*- +############################################################################### +# +# Cybrosys Technologies Pvt. Ltd. +# +# Copyright (C) 2025-TODAY Cybrosys Technologies() +# Author: Cybrosys Techno Solutions (odoo@cybrosys.com) +# +# You can modify it under the terms of the GNU AFFERO +# GENERAL PUBLIC LICENSE (AGPL 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 AFFERO GENERAL PUBLIC LICENSE (AGPL v3) for more details. +# +# You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE +# (AGPL v3) along with this program. +# If not, see . +# +############################################################################### +from odoo import http +from odoo.http import request + + +class WebsiteTestimonialController(http.Controller): + @http.route('/website/testimonials/fetch', type='json', auth='public') + def fetch_testimonials(self): + """Fetch all testimonials""" + try: + testimonials = request.env['website.testimonial'].sudo().search([]) + return [{ + 'user_name': testimonial.user_id.name, + 'testimonial': testimonial.testimonial, + 'image': testimonial.image, + } for testimonial in testimonials] + except Exception as e: + return {'status': 'error', 'message': str(e)} + + @http.route('/fetch_user_group', type='json', auth='public', methods=['POST']) + def check_user_group(self, userId, **kwargs): + """Check the user group of current logged-in user""" + user_group = request.env['res.users'].search([('id', '=', userId)]) + user_has_group = ( + user_group.has_group('theme_shopping.testimonial_user') or + user_group.has_group('website.group_website_designer') + ) + return user_has_group + + @http.route('/website/testimonial/create', type='json', auth='public', methods=['POST']) + def create_testimonial(self, testimonial, **kwargs): + """Create a new testimonial record""" + try: + current_user = request.env.user + user_name = current_user.id + user_image = current_user.image_1920 + request.env['website.testimonial'].sudo().create({ + 'user_id': user_name, + 'testimonial': testimonial, + 'image': user_image, + }) + return {'status': 'success'} + except Exception as e: + return {'status': 'error', 'message': str(e)} \ No newline at end of file diff --git a/theme_shopping/controllers/theme_shopping.py b/theme_shopping/controllers/theme_shopping.py new file mode 100644 index 000000000..bcb3f2214 --- /dev/null +++ b/theme_shopping/controllers/theme_shopping.py @@ -0,0 +1,100 @@ +# -*- coding: utf-8 -*- +############################################################################### +# +# Cybrosys Technologies Pvt. Ltd. +# +# Copyright (C) 2025-TODAY Cybrosys Technologies() +# Author: Cybrosys Techno Solutions (odoo@cybrosys.com) +# +# You can modify it under the terms of the GNU AFFERO +# GENERAL PUBLIC LICENSE (AGPL 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 AFFERO GENERAL PUBLIC LICENSE (AGPL v3) for more details. +# +# You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE +# (AGPL v3) along with this program. +# If not, see . +# +############################################################################### +from odoo import http, fields +from odoo.http import request +from odoo.addons.payment import utils as payment_utils +from odoo.tools.json import scriptsafe as json_scriptsafe +from odoo.addons.website_sale.controllers import main + + +class WebsiteSale(main.WebsiteSale): + """Imported and recalled WebsiteSale class to Patch cart_update_json()""" + @http.route() + def cart_update_json( + self, product_id, line_id=None, add_qty=None, set_qty=None, + display=True, + product_custom_attribute_values=None, + no_variant_attribute_values=None, **kw + ): + """ + This route is called : + - When changing quantity from the cart. + - When adding a product from the wishlist. + - When adding a product to cart on the same page (without redirection). + """ + order = request.website.sale_get_order(force_create=True) + if order.state != 'draft': + request.website.sale_reset() + if kw.get('force_create'): + order = request.website.sale_get_order(force_create=True) + else: + return {} + + if product_custom_attribute_values: + product_custom_attribute_values = json_scriptsafe.loads( + product_custom_attribute_values) + + if no_variant_attribute_values: + no_variant_attribute_values = json_scriptsafe.loads( + no_variant_attribute_values) + values = order._cart_update( + product_id=product_id, + line_id=line_id, + add_qty=add_qty, + set_qty=set_qty, + product_custom_attribute_values=product_custom_attribute_values, + no_variant_attribute_values=no_variant_attribute_values, + **kw + ) + for line in order.order_line.filtered( + lambda rec: rec.product_id.is_top_deal_product): + line.update({"price_unit": line.product_id.offer_price}) + values['notification_info'] = self._get_cart_notification_information( + order, [values['line_id']]) + values['notification_info']['warning'] = values.pop('warning', '') + request.session['website_sale_cart_quantity'] = order.cart_quantity + if not order.cart_quantity: + request.website.sale_reset() + return values + values['cart_quantity'] = order.cart_quantity + values['minor_amount'] = payment_utils.to_minor_currency_units( + order.amount_total, order.currency_id + ), + if not display: + return values + + values['cart_ready'] = order._is_cart_ready() + values['website_sale.cart_lines'] = request.env[ + 'ir.ui.view']._render_template( + "website_sale.cart_lines", { + 'website_sale_order': order, + 'date': fields.Date.today(), + 'suggested_products': order._cart_accessories() + } + ) + values['website_sale.total'] = request.env[ + 'ir.ui.view']._render_template( + "website_sale.total", { + 'website_sale_order': order, + } + ) + return values diff --git a/theme_shopping/data/ir_cron.xml b/theme_shopping/data/ir_cron.xml new file mode 100644 index 000000000..c6cc789ab --- /dev/null +++ b/theme_shopping/data/ir_cron.xml @@ -0,0 +1,16 @@ + + + + + + + Top deal Offer Checking + + code + model.check_top_deal() + + 1 + days + + + diff --git a/theme_shopping/data/product_category_data.xml b/theme_shopping/data/product_category_data.xml new file mode 100644 index 000000000..ae36d01db --- /dev/null +++ b/theme_shopping/data/product_category_data.xml @@ -0,0 +1,8 @@ + + + + + + Winter Collection + + diff --git a/theme_shopping/doc/RELEASE_NOTES.md b/theme_shopping/doc/RELEASE_NOTES.md new file mode 100755 index 000000000..5f8252815 --- /dev/null +++ b/theme_shopping/doc/RELEASE_NOTES.md @@ -0,0 +1,6 @@ +## Module + +#### 16.01.2025 +#### Version 18.0.1.0.0 +#### ADD +- Initial commit for Theme Shopping diff --git a/theme_shopping/models/__init__.py b/theme_shopping/models/__init__.py new file mode 100644 index 000000000..81c517c3d --- /dev/null +++ b/theme_shopping/models/__init__.py @@ -0,0 +1,25 @@ +# -*- coding: utf-8 -*- +############################################################################### +# +# Cybrosys Technologies Pvt. Ltd. +# +# Copyright (C) 2025-TODAY Cybrosys Technologies() +# Author: Cybrosys Techno Solutions (odoo@cybrosys.com) +# +# You can modify it under the terms of the GNU AFFERO +# GENERAL PUBLIC LICENSE (AGPL 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 AFFERO GENERAL PUBLIC LICENSE (AGPL v3) for more details. +# +# You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE +# (AGPL v3) along with this program. +# If not, see . +# +############################################################################### +from . import product_template +from . import product_wishlist +from . import theme_utils +from . import website_testimonial diff --git a/theme_shopping/models/product_template.py b/theme_shopping/models/product_template.py new file mode 100644 index 000000000..6a285a4ba --- /dev/null +++ b/theme_shopping/models/product_template.py @@ -0,0 +1,103 @@ +# -*- coding: utf-8 -*- +############################################################################### +# +# Cybrosys Technologies Pvt. Ltd. +# +# Copyright (C) 2025-TODAY Cybrosys Technologies() +# Author: Cybrosys Techno Solutions (odoo@cybrosys.com) +# +# You can modify it under the terms of the GNU AFFERO +# GENERAL PUBLIC LICENSE (AGPL 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 AFFERO GENERAL PUBLIC LICENSE (AGPL v3) for more details. +# +# You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE +# (AGPL v3) along with this program. +# If not, see . +# +############################################################################### +from odoo import api, fields, models +from odoo.exceptions import ValidationError + +class ProductTemplate(models.Model): + _inherit = 'product.template' + + is_top_deal_product = fields.Boolean(string="Top Deal Product", + help="Whether the product is listed " + "in the top deal product", + store=True) + offer_price = fields.Float(string="Offer Price", + help="Set an offer price to price to " + "display on website") + time_period_from = fields.Date(string="From Date", + help="From date for offer price visibility", + default=lambda self: fields.Date.today()) + time_period_end = fields.Date(string="End Date", + help="End date for offer price visibility", + default=lambda self: fields.Date.today()) + ready_to_top_deal = fields.Boolean(string="Ready to Top Deal", + help="Determine whether the product is ready to be featured as a top deal.") + actual_price = fields.Monetary(string="Actual Price") + + def _get_combination_info(self, combination=False, product_id=False, + add_qty=1, parent_combination=False, + only_template=False): + """Return the variant info based on its combination. + See `_get_combination_info` for more information. + """ + combination_info = super()._get_combination_info( + combination=combination, product_id=product_id, add_qty=add_qty, + parent_combination=parent_combination, only_template=only_template) + combination_info['offer_price'] = self.offer_price + return combination_info + + @api.onchange('is_top_deal_product') + def onchange_is_top_deal_product(self): + """Set the offer price as new sale price and old sales price saves + into new field """ + if self.is_top_deal_product: + self.actual_price = self.list_price + self.time_period_from = fields.Date.today() + self.time_period_end = fields.Date.today() + config = self.env['res.config.settings'].create( + {'group_product_price_comparison': True}) + config.execute() + else: + self.list_price = self.actual_price + self.compare_list_price = 0.0 + self.ready_to_top_deal = False + + def check_top_deal(self): + """Check the timeframe of the top deal offer.""" + data = self.env['product.template'].search( + [('is_top_deal_product', '=', 'True')]) + today = fields.Date.today() + for rec in data: + if today > rec.time_period_end: + rec.write({'ready_to_top_deal': False, + 'list_price': rec.actual_price, + 'compare_list_price': 0.0 + }) + + elif rec.time_period_from <= today <= rec.time_period_end: + if rec.offer_price < rec.actual_price: + rec.write({'ready_to_top_deal': True, + 'list_price': rec.offer_price, + 'compare_list_price': rec.actual_price}) + else: + rec.write({'ready_to_top_deal': True, + 'list_price': rec.actual_price, + 'compare_list_price': 0.0 + }) + elif rec.time_period_from > rec.time_period_end: + rec.write({'ready_to_top_deal': False}) + raise ValidationError("From date should be less than end date") + else: + rec.write({'ready_to_top_deal': False}) + + def apply_top_deal_time(self): + """Method for set time period for top deal products.""" + self.check_top_deal() diff --git a/theme_shopping/models/product_wishlist.py b/theme_shopping/models/product_wishlist.py new file mode 100644 index 000000000..1f78ce764 --- /dev/null +++ b/theme_shopping/models/product_wishlist.py @@ -0,0 +1,47 @@ +# -*- coding: utf-8 -*- +############################################################################### +# +# Cybrosys Technologies Pvt. Ltd. +# +# Copyright (C) 2025-TODAY Cybrosys Technologies() +# Author: Cybrosys Techno Solutions (odoo@cybrosys.com) +# +# You can modify it under the terms of the GNU AFFERO +# GENERAL PUBLIC LICENSE (AGPL 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 AFFERO GENERAL PUBLIC LICENSE (AGPL v3) for more details. +# +# You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE +# (AGPL v3) along with this program. +# If not, see . +# +############################################################################### +from odoo import api, models + + +class ProductWishlist(models.Model): + """Inherited product_wishlist to overwrite a function""" + _inherit = 'product.wishlist' + + @api.model + def _add_to_wishlist(self, pricelist_id, currency_id, website_id, price, + product_id, partner_id=False): + """Over-writing the function to check conditions""" + existing_product = self.env['product.wishlist'].search_count([ + ('product_id', '=', product_id)]) + if existing_product == 1: + return False + else: + wish = self.env['product.wishlist'].create({ + 'partner_id': partner_id, + 'product_id': product_id, + 'currency_id': currency_id, + 'pricelist_id': pricelist_id, + 'price': price, + 'website_id': website_id, + }) + total_wish = self.env['product.wishlist'].search_count([]) + return wish, total_wish diff --git a/theme_shopping/models/theme_utils.py b/theme_shopping/models/theme_utils.py new file mode 100644 index 000000000..bd7f766a9 --- /dev/null +++ b/theme_shopping/models/theme_utils.py @@ -0,0 +1,41 @@ +# -*- coding: utf-8 -*- +############################################################################### +# +# Cybrosys Technologies Pvt. Ltd. +# +# Copyright (C) 2025-TODAY Cybrosys Technologies() +# Author: Cybrosys Techno Solutions (odoo@cybrosys.com) +# +# You can modify it under the terms of the GNU AFFERO +# GENERAL PUBLIC LICENSE (AGPL 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 AFFERO GENERAL PUBLIC LICENSE (AGPL v3) for more details. +# +# You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE +# (AGPL v3) along with this program. +# If not, see . +# +############################################################################### +from odoo import api, models + + +class ThemeUtils(models.AbstractModel): + """ Class for enable and disable templates when using theme shopping""" + _inherit = 'theme.utils' + + @api.model + def _theme_shopping_post_copy(self, mod): + """ Enable and disable templates when using coffee shop theme """ + self.enable_view("website_sale.products_categories") + self.enable_view("website_sale.products_description") + self.enable_view("website_sale.products_design_card") + self.enable_view("website_sale.products_add_to_cart") + self.enable_view("website_sale.product_comment") + self.enable_view("website_sale.option_collapse_products_categories") + self.enable_view("website_sale.product_buy_now") + self.disable_view("website_sale.products_categories_top") + self.disable_view("website_sale.products_design_grid") + self.disable_view("website_sale_comparison.add_to_compare") diff --git a/theme_shopping/models/website_testimonial.py b/theme_shopping/models/website_testimonial.py new file mode 100644 index 000000000..f138d98b1 --- /dev/null +++ b/theme_shopping/models/website_testimonial.py @@ -0,0 +1,42 @@ +# -*- coding: utf-8 -*- +############################################################################### +# +# Cybrosys Technologies Pvt. Ltd. +# +# Copyright (C) 2025-TODAY Cybrosys Technologies() +# Author: Cybrosys Techno Solutions (odoo@cybrosys.com) +# +# You can modify it under the terms of the GNU AFFERO +# GENERAL PUBLIC LICENSE (AGPL 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 AFFERO GENERAL PUBLIC LICENSE (AGPL v3) for more details. +# +# You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE +# (AGPL v3) along with this program. +# If not, see . +# +############################################################################### +from odoo import api, models,fields + + +class WebsiteTestimonial(models.Model): + """ Class for adding testimonials theme shopping""" + _name = 'website.testimonial' + _description = 'Testimonial Review' + _inherit = 'mail.thread' + _rec_name ='user_id' + + user_id = fields.Many2one('res.users', required=True,string='User Name') + testimonial = fields.Text('Testimonial', required=True) + image = fields.Binary() # To store the user's image, if you want to allow image uploads + + @api.onchange('user_id') + def _onchange_name(self): + """ For setting profile picture while changing the user """ + if self.user_id and self.user_id.image_1920: + self.image = self.user_id.image_1920 + else: + self.image = False diff --git a/theme_shopping/security/ir.model.access.csv b/theme_shopping/security/ir.model.access.csv new file mode 100644 index 000000000..19d673fa0 --- /dev/null +++ b/theme_shopping/security/ir.model.access.csv @@ -0,0 +1,3 @@ +id,name,model_id/id,group_id/id,perm_read,perm_write,perm_create,perm_unlink + +access_website_testimonial,access.website.testimonial,model_website_testimonial,base.group_user,1,1,1,1 diff --git a/theme_shopping/security/security_groups.xml b/theme_shopping/security/security_groups.xml new file mode 100644 index 000000000..a26c893f6 --- /dev/null +++ b/theme_shopping/security/security_groups.xml @@ -0,0 +1,9 @@ + + + + + Testimonial + + + + diff --git a/theme_shopping/static/description/banner.jpg b/theme_shopping/static/description/banner.jpg new file mode 100644 index 000000000..861607597 Binary files /dev/null and b/theme_shopping/static/description/banner.jpg differ diff --git a/theme_shopping/static/description/icon.png b/theme_shopping/static/description/icon.png new file mode 100644 index 000000000..7dd50005a Binary files /dev/null and b/theme_shopping/static/description/icon.png differ diff --git a/theme_shopping/static/description/images/1.png b/theme_shopping/static/description/images/1.png new file mode 100644 index 000000000..0d8592be2 Binary files /dev/null and b/theme_shopping/static/description/images/1.png differ diff --git a/theme_shopping/static/description/images/1_mob.png b/theme_shopping/static/description/images/1_mob.png new file mode 100644 index 000000000..80933b396 Binary files /dev/null and b/theme_shopping/static/description/images/1_mob.png differ diff --git a/theme_shopping/static/description/images/2.1_mob.png b/theme_shopping/static/description/images/2.1_mob.png new file mode 100644 index 000000000..24fe3fd25 Binary files /dev/null and b/theme_shopping/static/description/images/2.1_mob.png differ diff --git a/theme_shopping/static/description/images/2.png b/theme_shopping/static/description/images/2.png new file mode 100644 index 000000000..4f1a1b8ea Binary files /dev/null and b/theme_shopping/static/description/images/2.png differ diff --git a/theme_shopping/static/description/images/2_mob.png b/theme_shopping/static/description/images/2_mob.png new file mode 100644 index 000000000..63a268998 Binary files /dev/null and b/theme_shopping/static/description/images/2_mob.png differ diff --git a/theme_shopping/static/description/images/FAQ.png b/theme_shopping/static/description/images/FAQ.png new file mode 100644 index 000000000..547db3e04 Binary files /dev/null and b/theme_shopping/static/description/images/FAQ.png differ diff --git a/theme_shopping/static/description/images/about.png b/theme_shopping/static/description/images/about.png new file mode 100644 index 000000000..f74a1715c Binary files /dev/null and b/theme_shopping/static/description/images/about.png differ diff --git a/theme_shopping/static/description/images/about_mob.png b/theme_shopping/static/description/images/about_mob.png new file mode 100644 index 000000000..9f019c7e1 Binary files /dev/null and b/theme_shopping/static/description/images/about_mob.png differ diff --git a/theme_shopping/static/description/images/arrow-black.png b/theme_shopping/static/description/images/arrow-black.png new file mode 100644 index 000000000..3fd6da801 Binary files /dev/null and b/theme_shopping/static/description/images/arrow-black.png differ diff --git a/theme_shopping/static/description/images/arrows-repeat.svg b/theme_shopping/static/description/images/arrows-repeat.svg new file mode 100644 index 000000000..94fb8f7f9 --- /dev/null +++ b/theme_shopping/static/description/images/arrows-repeat.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/theme_shopping/static/description/images/banner.jpg b/theme_shopping/static/description/images/banner.jpg new file mode 100644 index 000000000..861607597 Binary files /dev/null and b/theme_shopping/static/description/images/banner.jpg differ diff --git a/theme_shopping/static/description/images/blog.png b/theme_shopping/static/description/images/blog.png new file mode 100644 index 000000000..e4e0fe34c Binary files /dev/null and b/theme_shopping/static/description/images/blog.png differ diff --git a/theme_shopping/static/description/images/blog_2_mob.png b/theme_shopping/static/description/images/blog_2_mob.png new file mode 100644 index 000000000..1c259c1b2 Binary files /dev/null and b/theme_shopping/static/description/images/blog_2_mob.png differ diff --git a/theme_shopping/static/description/images/blog_mob1.png b/theme_shopping/static/description/images/blog_mob1.png new file mode 100644 index 000000000..5ef790727 Binary files /dev/null and b/theme_shopping/static/description/images/blog_mob1.png differ diff --git a/theme_shopping/static/description/images/frequently-asked-snippet.png b/theme_shopping/static/description/images/frequently-asked-snippet.png new file mode 100644 index 000000000..454866e92 Binary files /dev/null and b/theme_shopping/static/description/images/frequently-asked-snippet.png differ diff --git a/theme_shopping/static/description/images/gear.svg b/theme_shopping/static/description/images/gear.svg new file mode 100644 index 000000000..ce383059d --- /dev/null +++ b/theme_shopping/static/description/images/gear.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/theme_shopping/static/description/images/hire-odoo.svg b/theme_shopping/static/description/images/hire-odoo.svg new file mode 100644 index 000000000..9cfec4e44 --- /dev/null +++ b/theme_shopping/static/description/images/hire-odoo.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/theme_shopping/static/description/images/home-mob.png b/theme_shopping/static/description/images/home-mob.png new file mode 100644 index 000000000..2f0b08ba3 Binary files /dev/null and b/theme_shopping/static/description/images/home-mob.png differ diff --git a/theme_shopping/static/description/images/home-mobile-2.png b/theme_shopping/static/description/images/home-mobile-2.png new file mode 100644 index 000000000..1aa94bb33 Binary files /dev/null and b/theme_shopping/static/description/images/home-mobile-2.png differ diff --git a/theme_shopping/static/description/images/home-mobile-3.png b/theme_shopping/static/description/images/home-mobile-3.png new file mode 100644 index 000000000..0009216ca Binary files /dev/null and b/theme_shopping/static/description/images/home-mobile-3.png differ diff --git a/theme_shopping/static/description/images/home_desk.png b/theme_shopping/static/description/images/home_desk.png new file mode 100644 index 000000000..5962ada12 Binary files /dev/null and b/theme_shopping/static/description/images/home_desk.png differ diff --git a/theme_shopping/static/description/images/icon-Compatibility-with-plugins.png b/theme_shopping/static/description/images/icon-Compatibility-with-plugins.png new file mode 100644 index 000000000..2c0c4015e Binary files /dev/null and b/theme_shopping/static/description/images/icon-Compatibility-with-plugins.png differ diff --git a/theme_shopping/static/description/images/icon-Up-to-date-development.png b/theme_shopping/static/description/images/icon-Up-to-date-development.png new file mode 100644 index 000000000..892a490e8 Binary files /dev/null and b/theme_shopping/static/description/images/icon-Up-to-date-development.png differ diff --git a/theme_shopping/static/description/images/life-ring-icon.svg b/theme_shopping/static/description/images/life-ring-icon.svg new file mode 100644 index 000000000..b6c797ba1 --- /dev/null +++ b/theme_shopping/static/description/images/life-ring-icon.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + diff --git a/theme_shopping/static/description/images/logo-cybro.png b/theme_shopping/static/description/images/logo-cybro.png new file mode 100644 index 000000000..ecf9b0134 Binary files /dev/null and b/theme_shopping/static/description/images/logo-cybro.png differ diff --git a/theme_shopping/static/description/images/main.png b/theme_shopping/static/description/images/main.png new file mode 100644 index 000000000..de6471986 Binary files /dev/null and b/theme_shopping/static/description/images/main.png differ diff --git a/theme_shopping/static/description/images/mobile-view.jpg b/theme_shopping/static/description/images/mobile-view.jpg new file mode 100644 index 000000000..f6ef3887b Binary files /dev/null and b/theme_shopping/static/description/images/mobile-view.jpg differ diff --git a/theme_shopping/static/description/images/odoo-consultancy.svg b/theme_shopping/static/description/images/odoo-consultancy.svg new file mode 100644 index 000000000..c2c27e608 --- /dev/null +++ b/theme_shopping/static/description/images/odoo-consultancy.svg @@ -0,0 +1,4 @@ + + + + diff --git a/theme_shopping/static/description/images/odoo-licencing.svg b/theme_shopping/static/description/images/odoo-licencing.svg new file mode 100644 index 000000000..8a520b40f --- /dev/null +++ b/theme_shopping/static/description/images/odoo-licencing.svg @@ -0,0 +1,3 @@ + + + diff --git a/theme_shopping/static/description/images/odoo-logo.png b/theme_shopping/static/description/images/odoo-logo.png new file mode 100644 index 000000000..36960c38b Binary files /dev/null and b/theme_shopping/static/description/images/odoo-logo.png differ diff --git a/theme_shopping/static/description/images/offfers.png b/theme_shopping/static/description/images/offfers.png new file mode 100644 index 000000000..952330d56 Binary files /dev/null and b/theme_shopping/static/description/images/offfers.png differ diff --git a/theme_shopping/static/description/images/price-collection.png b/theme_shopping/static/description/images/price-collection.png new file mode 100644 index 000000000..9f05fb4ed Binary files /dev/null and b/theme_shopping/static/description/images/price-collection.png differ diff --git a/theme_shopping/static/description/images/puzzle-piece-icon.svg b/theme_shopping/static/description/images/puzzle-piece-icon.svg new file mode 100644 index 000000000..ab5e56fa7 --- /dev/null +++ b/theme_shopping/static/description/images/puzzle-piece-icon.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/theme_shopping/static/description/images/shop-mob.png b/theme_shopping/static/description/images/shop-mob.png new file mode 100644 index 000000000..ee6fb9e18 Binary files /dev/null and b/theme_shopping/static/description/images/shop-mob.png differ diff --git a/theme_shopping/static/description/images/shop.png b/theme_shopping/static/description/images/shop.png new file mode 100644 index 000000000..c40f14a06 Binary files /dev/null and b/theme_shopping/static/description/images/shop.png differ diff --git a/theme_shopping/static/description/images/shop_mob_1.png b/theme_shopping/static/description/images/shop_mob_1.png new file mode 100644 index 000000000..5d1b09827 Binary files /dev/null and b/theme_shopping/static/description/images/shop_mob_1.png differ diff --git a/theme_shopping/static/description/images/shop_mob_2.png b/theme_shopping/static/description/images/shop_mob_2.png new file mode 100644 index 000000000..8a8d9420e Binary files /dev/null and b/theme_shopping/static/description/images/shop_mob_2.png differ diff --git a/theme_shopping/static/description/images/subscription.png b/theme_shopping/static/description/images/subscription.png new file mode 100644 index 000000000..1af984f8d Binary files /dev/null and b/theme_shopping/static/description/images/subscription.png differ diff --git a/theme_shopping/static/description/images/team.png b/theme_shopping/static/description/images/team.png new file mode 100644 index 000000000..bdbc18774 Binary files /dev/null and b/theme_shopping/static/description/images/team.png differ diff --git a/theme_shopping/static/description/images/testimonial.png b/theme_shopping/static/description/images/testimonial.png new file mode 100644 index 000000000..5b01ec8eb Binary files /dev/null and b/theme_shopping/static/description/images/testimonial.png differ diff --git a/theme_shopping/static/description/images/top-deals.png b/theme_shopping/static/description/images/top-deals.png new file mode 100644 index 000000000..dbb4194e4 Binary files /dev/null and b/theme_shopping/static/description/images/top-deals.png differ diff --git a/theme_shopping/static/description/images/winter-collection.png b/theme_shopping/static/description/images/winter-collection.png new file mode 100644 index 000000000..ebe2409a4 Binary files /dev/null and b/theme_shopping/static/description/images/winter-collection.png differ diff --git a/theme_shopping/static/description/images/wishlist.png b/theme_shopping/static/description/images/wishlist.png new file mode 100644 index 000000000..6e118b3e6 Binary files /dev/null and b/theme_shopping/static/description/images/wishlist.png differ diff --git a/theme_shopping/static/description/images/wrench-icon.svg b/theme_shopping/static/description/images/wrench-icon.svg new file mode 100644 index 000000000..4e0ce1d01 --- /dev/null +++ b/theme_shopping/static/description/images/wrench-icon.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/theme_shopping/static/description/index.html b/theme_shopping/static/description/index.html new file mode 100644 index 000000000..72d22763a --- /dev/null +++ b/theme_shopping/static/description/index.html @@ -0,0 +1,911 @@ + + + + + + + app index + + + + + + + + + + +
+ + +
+
+
+
+ +
+
+
+
+ +
+ Supports: +
+ Community +
+
+ Enterprise +
+
+
+
+
+ Availability: +
+ Odoo Online +
+
+ Odoo.sh +
+
+ On Premise +
+
+
+
+
+
+ + +
+
+ +
+
+ + +
+
+
+
+
+

Our Features

+
+
+
+
+
+
+
+ +

Design +

+

Unique and Attractive custom-designed snippets +

+
+ +
+
+ +
+
+
+ +

+ Fast loading times +

+

This theme loads all of its features + more quickly than other designs.

+
+ +
+
+ +
+
+ +

Different resolution devices can be + used by users to watch websites.

+ + +
+
+ +
+ +
+
+
+
+ +

Frequently Asked Question Snippet +

+

A Frequently Asked Questions (FAQ) snippet is a section on a website that provides users with answers to common questions regarding a product, service, or topic. +

+
+ +
+
+ +
+
+
+ +

+ Testimonial Snippet +

+

A Testimonial Snippet is a feature where allowed users can submit their testimonials, which are then displayed for others to see.

+
+ +
+
+ +
+
+ +

Snippet for highlighting products that are on sale or come with special promotions, attracting customer attention and driving conversions.

+ + +
+
+ +
+ +
+
+
+
+ +

Price Collection Snippets +

+

A powerful way to promote discounts, limited-time offers, or newly launched products.

+
+ +
+
+ +
+
+
+ +

+ Top Deal Snippets +

+

A highly effective way to showcase products that are currently available at special limited-time offers.

+
+ +
+
+ +
+
+ +

Highlighting curated selection of products that fall under the "Winter" category.

+ + +
+
+ +
+ +
+
+ + +
+
+
+
+

Mobile Responsive Design

+
+
+
+
+
+
+
+
+ + +
+
+
+ +
+
+ +
+
+
+

Theme Features

+ +
+
+
+
+ HIGHLIGHT +

Desktop View

+

User-friendly and modern looking theme makes your page more Stylish And Beautiful. +

+ +
+
+ Grid item +
+ +
+
+ +
+
+
+ HIGHLIGHT +

Mobile View

+

It is easy to customize and use.Just drag and drop the building blocks to make attractive webpages. + +.

+ +
+
+ Grid item +
+ +
+
+
+ +
+ +
+
+
+ HIGHLIGHT +

About Us Page

+
+
+ Grid item +
+ +
+
+ +
+
+
+ HIGHLIGHT +

Shop View

+ +
+
+ Grid item +
+ +
+
+
+ +
+ +
+
+
+ HIGHLIGHT +

Blog Preview

+
+
+ Grid item +
+ +
+
+ +
+
+
+ HIGHLIGHT +

Wishlist Preview

+
+
+ Grid item +
+ +
+
+
+ +
+ +
+

Snippets

+ +
+
+
+
+ HIGHLIGHT +

Frequently Asked Questions Snippets

+
+
+ Grid item +
+ +
+
+
+ +
+
+
+
+ HIGHLIGHT +

Testimonial Snippets

+
+
+ Grid item +
+ +
+
+
+ +
+
+
+
+ HIGHLIGHT +

Product Offers Snippets

+
+
+ Grid item +
+ +
+
+
+ +
+
+
+
+ HIGHLIGHT +

Our Team Snippets

+
+
+ Grid item +
+ +
+
+
+ +
+
+
+
+ HIGHLIGHT +

Price Collection Snippets

+
+
+ Grid item +
+ +
+
+
+ +
+
+
+
+ HIGHLIGHT +

Subscription Snippets

+
+
+ Grid item +
+ +
+
+
+ +
+
+
+
+ HIGHLIGHT +

Top Deal Snippets

+
+
+ Grid item +
+ +
+
+
+ +
+
+
+
+ HIGHLIGHT +

Winter Collection Snippets

+
+
+ Grid item +
+ +
+
+
+
+
+
+
+
+
+ + + + +
+ + + + \ No newline at end of file diff --git a/theme_shopping/static/description/theme_screenshot.jpg b/theme_shopping/static/description/theme_screenshot.jpg new file mode 100644 index 000000000..0f7fdef79 Binary files /dev/null and b/theme_shopping/static/description/theme_screenshot.jpg differ diff --git a/theme_shopping/static/src/css/main.css b/theme_shopping/static/src/css/main.css new file mode 100644 index 000000000..7caea4ebe --- /dev/null +++ b/theme_shopping/static/src/css/main.css @@ -0,0 +1,163 @@ +/*@import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,400&display=swap");*/ +body{font-family:"Lato",sans-serif;-webkit-box-sizing:border-box;box-sizing:border-box;overflow-x:hidden} +.st-body{background-color:#FFFAF4}a{text-decoration:none}ul{list-style:none;padding-left:0px}li{list-style:none} +.st-auto-image{width:100%;height:100%;-o-object-fit:cover;object-fit:cover} +.st-wrapper{margin:5rem 0}@media (max-width:768px){.st-wrapper{margin:3rem 0}} +.st-secondary_wrapper{background-color:rgba(128,0,0,0.08)} +.st-section__head{font-size:clamp(1.25rem,0.61vw + 1.1rem,1.58rem);margin-bottom:0} +.st-link{color:#800000;font-weight:400;font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem);-webkit-transition:all 0.3s;transition:all 0.3s} +.st-link:hover{color:#800000}.st-page-link{border-radius:6px;background-color:rgba(128,0,0,0.08);color:#000;padding:0.5rem 0.8rem;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);font-weight:600} +.st-page-link.active{background-color:#800000;color:#fff} +.st-page-link:hover{background-color:rgba(128,0,0,0.3);color:#000} +.st-page_navigate--btn{background-color:transparent;color:#800000} +.st-page_navigate--btn:hover{background-color:transparent;color:#800000} +.page-item.disable .st-page-link{color:#000;pointer-events:none} +.st-hero_section-banner{width:100%;height:220px;background:rgba(128,0,0,0.08)} +@media (max-width:768px){.st-hero_section-banner{height:110px}} +.st-hero_section-content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100%} +.st-btn__sm{color:#800000;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;border:1px solid #800000;border-radius:2px;font-weight:400;white-space:nowrap} +.st-btn__solid{color:#800000;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;background-color:#fff;border-radius:2px;font-weight:700;padding:0.6rem 1.4rem;white-space:nowrap} +.st-cart_btn--sm{background-color:#800000;color:#fff;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);font-weight:700;width:100%;border:none;border-radius:4px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;gap:0.4rem} +.st-cart_btn--sm:hover{color:#fff} +.st-product-like_btn{border-radius:50%;background-color:#fff;color:#7D7D7D;font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem);width:36px;height:36px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:centerheader} +@media (max-width:575px){.st-product-like_btn{width:30px;height:30px;-webkit-box-align:center;-ms-flex-align:center;align-items:center} + +header .nav-link{ padding:10px !important; } +.st-cart_btn--sm{ padding: 4px 4px !important; font-size: 10px !important; width: 92px; + margin-right: 10px; } +.st-btn__sm{ +margin-top: -35px; +} + +#products_grid:not(.o_wsale_layout_list) td.oe_product .o_wsale_product_btn{ position: absolute;top: -50px; display:flex;} +.st-product_overlay-content{ width: 100% !important; } + +.o_wsale_product_btn { + width: 57% !important; display:flex; +} +.o_wsale_layout_list .oe_product { height:190px; } + +.st-auto-image{ height:auto !important; } +.st-product_overlay-content{ height:auto !important; } + +.oe_product_image_img_wrapper{ height:auto !important; } + +.o_wsale_layout_list .product_price{ position: absolute; + left: 17px; + top: 88px; } + + + + + .oe_product_cart .o_wsale_product_information{ position:relative; height:inherit; } + + + + +.st-blog__category-item{ padding:0px !important; margin: 4px 5px; } + + +} +.st-topnavbar{background-color:#800000}.st-search_icon{position:absolute;background-color:transparent;padding-right:0px;border:none;color:#800000;z-index:1}.st-search_input{background-color:#FFFAF4;border-radius:30px;padding-left:2rem;border:none;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem)}.st-search_container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;position:relative}.st-top_menubar{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-left:0px;list-style:none;margin-bottom:0px;padding:1.3rem 0}.st-menu__item{color:#000;font-weight:400;-webkit-transition:all 0.3s;transition:all 0.3s;padding:1.4rem 0;cursor:pointer;white-space:nowrap;overflow:hidden;position:relative}.st-menu__item:before{content:"";position:absolute;bottom:-1px;left:0;width:0px;height:2px;background-color:#800000;-webkit-transition:width 0.3s ease-in-out;transition:width 0.3s ease-in-out}.st-menu__item.active:before,.st-menu__item:hover:before{width:100%}.st-menu__item:hover{color:#800000}.st-topmenu_list{-webkit-box-shadow:0px -4px 12px 4px rgba(0,0,0,0.25);box-shadow:0px -4px 12px 4px rgba(0,0,0,0.25)}.st-header_link{color:#fff;font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem);font-weight:300;-webkit-transition:all 0.3s;transition:all 0.3s;padding:0.2rem 0.5rem;border-radius:30px}.st-header_link:hover{background-color:rgba(255,250,244,0.2);color:#fff}.st-header_link-list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-wrap:nowrap;flex-wrap:nowrap;margin-left:1rem}.st-header_signin{font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem)}.st-menu_btn{background-color:transparent;border:none}.st-header_menu-link{padding:0.3rem 0.5rem}.st-sub_menu{position:absolute;width:100vw;padding:40px 1%;background-color:#FFFAF4;-webkit-box-shadow:0px 4px 4px 0px rgba(0,0,0,0.25);box-shadow:0px 4px 4px 0px rgba(0,0,0,0.25);margin-top:1.3rem;border-top:1px solid #D9D9D9;-webkit-transition:opacity 0.65s cubic-bezier(0.165,0.84,0.44,1) 0.15s,-webkit-transform 0.65s cubic-bezier(0.165,0.84,0.44,1) 0.075s;transition:opacity 0.65s cubic-bezier(0.165,0.84,0.44,1) 0.15s,-webkit-transform 0.65s cubic-bezier(0.165,0.84,0.44,1) 0.075s;transition:transform 0.65s cubic-bezier(0.165,0.84,0.44,1) 0.075s,opacity 0.65s cubic-bezier(0.165,0.84,0.44,1) 0.15s;transition:transform 0.65s cubic-bezier(0.165,0.84,0.44,1) 0.075s,opacity 0.65s cubic-bezier(0.165,0.84,0.44,1) 0.15s,-webkit-transform 0.65s cubic-bezier(0.165,0.84,0.44,1) 0.075s;width:100vw;margin-left:-50vw;left:50%;right:-15%;visibility:hidden;opacity:0;z-index:11}.st-menu_list{padding:0 0.75rem}.st-menu_list:hover .st-sub_menu{visibility:visible;opacity:1}.st-mega_menu--container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;gap:1rem;-ms-flex-wrap:wrap;flex-wrap:wrap}.st-mega-menu_header{color:#800000;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);font-weight:400;padding-bottom:0.5rem;border-bottom:1px solid #D9D9D9;margin-bottom:0.5rem;display:block;width:100%}.st-mega-menu-heading{margin-bottom:1rem}.st-mega-menu_item--list{color:#555555;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);font-weight:400}.st-mega-menu_item--list:hover{color:#000}.st-mob_navbar{padding:0px;display:-webkit-box;display:-ms-flexbox;display:flex;background-color:#FFFAF4}.st-mob_sidebar{width:56px;padding:15px;background-color:#800000;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.st-mob_close-btn{width:28px;height:28px;border-radius:50px;border:none;background-color:#FFFAF4;color:#000;-webkit-transition:all 0.3s;transition:all 0.3s;border:0.5px solid #FFFAF4;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.st-mob_close-btn:hover{background-color:rgba(255,250,244,0.2);color:#fff}.st-mob_sidebar--links{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:1rem 0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.st-mob_sidebar--link{font-size:1.3rem}.st-soical__links{height:100%;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:end}.st-mob_sidebar--search{border:1px solid #D9D9D9}.st-mob_sidebar--search:focus{-webkit-box-shadow:none;box-shadow:none;border:1px solid #800000;background-color:#FFFAF4}.st-mob_sidebar--content{width:100%;padding:1.3rem 1rem}.st-mob-sidebar_menu-container{margin:2rem 0;position:relative;overflow:hidden}.st-mob-sidebar--nav-btn{display:block;position:relative;padding:7px 0;text-align:left;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);line-height:1;font-weight:400;color:#555555;width:100%;cursor:pointer;background-color:transparent;border-width:0px;-webkit-transition:color 250ms ease,background-color 250ms ease;transition:color 250ms ease,background-color 250ms ease}.st-mob-sidebar--nav-btn:hover{color:#000}.st-mob-sidebar-sub__list{display:block;position:relative;padding:7px 0;text-align:left;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);line-height:1;font-weight:400;color:#555555;width:100%;cursor:pointer;background-color:transparent;border-width:0px;-webkit-transition:color 250ms ease,background-color 250ms ease;transition:color 250ms ease,background-color 250ms ease}.st-mob-sidebar-sub__list:hover{color:#000}.st-mob-sidebar--back-btn{color:#800000;padding-bottom:0.7rem;margin-bottom:0.7rem}.st-mob-sidebar--back-btn:hover{color:#800000}.st-mob-sidebar--back-btn:before{content:"\ea64"}.st-mob-sidebar--back-btn:after{content:"";border-bottom:1px solid #D9D9D9;height:1px;width:100%;position:absolute;bottom:0;left:0}.sub-menu{position:absolute;top:0;right:0;width:100%;display:none;background-color:#FFFAF4;-webkit-transition:opacity 0.3s ease-in-out,-webkit-transform 0.3s ease-in-out;transition:opacity 0.3s ease-in-out,-webkit-transform 0.3s ease-in-out;transition:transform 0.3s ease-in-out,opacity 0.3s ease-in-out;transition:transform 0.3s ease-in-out,opacity 0.3s ease-in-out,-webkit-transform 0.3s ease-in-out;height:100%}.sub-menu.active{display:block}.st-footer{background-color:#000;width:100%}.st-footer_container{padding:5rem 0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;color:#fff;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-bottom:0rem;gap:2rem}.st-footer_logo{width:170px;height:auto;margin-bottom:1.3rem}.st-footer_text{max-width:380px;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);font-weight:400;color:#E2E2E2}.st-footer_head{font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem);color:#fff;font-weight:600;margin-bottom:1.3rem;min-width:156px}.st-ft_soical-link{display:-webkit-box;display:-ms-flexbox;display:flex;gap:0.7rem;margin:1rem 0 2rem 0}.st-ft_media--link{color:#000;width:28px;height:28px;border-radius:6px;background-color:#fff;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.st-ft_copyright{color:#E2E2E2;font-size:12px;padding:0.87rem 0;display:block;border-top:1px solid #D9D9D9}.st-payment_option{padding-bottom:2rem;width:400px}@media (max-width:575px){.st-payment_option{width:100%}}.st-hero_section{position:relative;height:400px;border-radius:4px;overflow:hidden;margin:2rem 0 1rem 0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;padding:2rem}@media (max-width:992px){.st-hero_section{height:340px}}@media (max-width:768px){.st-hero_section{height:unset}}.st-hero__img{width:100%;position:absolute;top:0px;left:0px;z-index:-1;height:100%}.st-hero__img img{-o-object-fit:cover;object-fit:cover}.st-hero__headline{color:#000;font-size:clamp(1.56rem,1vw + 1.31rem,2.11rem);font-weight:700;margin-bottom:1.4rem}.st-hero_imgcontainer{width:100%;height:100%;position:relative;padding:2rem;min-height:210px}@media (max-width:768px){.st-hero_imgcontainer{min-height:unset;padding:2rem 1rem}}.st-product_card--img{width:100%;height:265px;position:relative;-webkit-transition:all 0.3s;transition:all 0.3s;cursor:pointer}.st-product_card--img:hover .st-product_overlay{display:-webkit-box;display:-ms-flexbox;display:flex}@media (max-width:472px)}.st-product__container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.st-product-list__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:4rem 0}@media (max-width:768px){.st-product-list__header{padding:2.6rem 0}}.st-product_card{padding:0.4rem}.st-product_card--detail{padding:0.8rem 0}.st-product_offer-price{font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem);color:#800000;font-weight:700}.st-product_orginal_price{font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem);color:#800000;font-weight:700}.st-product_price{color:#7D7D7D;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);font-weight:400;text-decoration:line-through;padding:0 0.4rem}.st-product_name{font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem);color:#000;font-weight:600}.st-product_desc{font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);color:#7D7D7D;display:block;padding-top:0.2rem}.st-product_overlay{position:absolute;left:0px;bottom:0px;background:-webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,0.8)),color-stop(109.73%,rgba(65,65,65,0)));background:linear-gradient(0deg,rgba(0,0,0,0.8) 0%,rgba(65,65,65,0) 109.73%);width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:end;-ms-flex-align:end;align-items:end;display:none}.st-product_overlay-content{display:-webkit-box;display:-ms-flexbox;display:flex;gap:0.8rem;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin:1rem;width:100%}@media (max-width:575px){.st-product_overlay-content{margin:0.6rem;gap:0.6rem}}.st-home_offer-container{background-color:#000;padding:1rem}.st-home_offer-container-head{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:1rem}.st-home_offer-headline{color:#fff;font-size:clamp(1.25rem,0.61vw + 1.1rem,1.58rem);font-weight:700}.st-home_more-offer--link{color:#fff;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem)}.st-home_offer--box{width:100%;height:220px;padding:0.8rem;position:relative}.st-home_category--name{color:#000;background-color:rgba(255,255,255,0.53);position:absolute;bottom:0px;left:0px;margin:0.8rem;width:-webkit-fill-available;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:0.2rem;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);font-weight:600;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.st-home_category-items{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-wrap:wrap;flex-wrap:wrap;margin:4rem 0;gap:2rem}@media (max-width:768px){.st-home_category-items{-ms-flex-pack:distribute;justify-content:space-around;gap:1rem}}.st-home_category-itemcard{text-align:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.st-home_category--img{width:180px;height:180px;border-radius:50%;overflow:hidden}.st-home_category--img:hover{-webkit-box-shadow:rgba(60,64,67,0.3) 0px 1px 2px 0px,rgba(60,64,67,0.15) 0px 2px 6px 2px;box-shadow:rgba(60,64,67,0.3) 0px 1px 2px 0px,rgba(60,64,67,0.15) 0px 2px 6px 2px}.st-home_category--img:hover .st-auto-image{-webkit-transform:scale(1.1);transform:scale(1.1);-webkit-transition:-webkit-transform 0.5s ease-in-out;transition:-webkit-transform 0.5s ease-in-out;transition:transform 0.5s ease-in-out;transition:transform 0.5s ease-in-out,-webkit-transform 0.5s ease-in-out}@media (max-width:992px){.st-home_category--img{width:100px;height:100px}}.st-home_category--itemname{margin:0.4rem 0;font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem)}.st-newsletter__container{text-align:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;margin:2rem 0 5rem 0}.st-newsletter__header{font-weight:800;font-size:clamp(1.56rem,1vw + 1.31rem,2.11rem)}.st-newsletter_subline{color:#7D7D7D;font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem);max-width:50%;text-align:center;margin:0 auto}@media (max-width:768px){.st-newsletter_subline{max-width:100%}}.st-newsletter_subscribe--btn{font-weight:700;color:#800000;font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem);-webkit-transition:all 0.3s linear;transition:all 0.3s linear}.st-newsletter_subscribe--btn:hover{color:#800000}.st-newsletter_subscribe--btn:focus{-webkit-box-shadow:none;box-shadow:none}.st-newsletter_input-box{border-bottom:1px solid #800000;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;margin:4rem auto}.st-newsletter_input{background-color:transparent;border:none;font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem);font-weight:400}.st-newsletter_input:focus{outline:none}.owl-carosel-hero{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.owl-carosel-hero .owl-nav{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;position:absolute;top:50%}.owl-carosel-hero span{padding:1rem;color:#800000;font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem)}.st-breadcrumbs{margin:2rem 0}.st-breadcrumb__item{color:#7D7D7D;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem)}.st-breadcrumb__item:hover{color:#800000}.st-breadcrumb__list{color:#7D7D7D;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem)}.st-breadcrumb__list+.st-breadcrumb__list:before{float:left;color:#7D7D7D;content:"|"}.st-product_filter-head{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;border-bottom:1px solid #E2E2E2;padding-bottom:0.5rem;margin-bottom:1rem}.st-product_filter--heading{color:#000;font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem);font-weight:700}.st-product_clear-btn{color:#800000;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);background-color:transparent;border:none}.st-product_filter--btn{font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);color:#000;font-weight:600;padding:0px;width:100%;text-align:left;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;position:relative}.st-product_filter--btn:after{content:"";float:right;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath fill='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpath d='M12 11.8284L9.17154 14.6569L7.75732 13.2426L12 9L16.2426 13.2426L14.8284 14.6569L12 11.8284Z'%3E%3C/path%3E%3C/svg%3E");width:1.5rem;height:1.5rem}.st-product_filter--btn.active:after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath fill='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpath d='M12 15.0006L7.75732 10.758L9.17154 9.34375L12 12.1722L14.8284 9.34375L16.2426 10.758L12 15.0006Z'%3E%3C/path%3E%3C/svg%3E")}.st-product_filter--btn:focus{-webkit-box-shadow:none;box-shadow:none}.st-product_filter--sidebarlist{padding-bottom:1rem;border-bottom:1px solid #E2E2E2;margin-bottom:1rem}.st-productlist_submenu{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:0.5rem;padding:0.1rem 0}.st-product-toggle-nav{padding-top:0.4rem}.st-productlist_searchbar{border-radius:2px;border:1px solid #D9D9D9;background-color:transparent;color:#7D7D7D}.st-productlist_searchbar:focus{-webkit-box-shadow:none;box-shadow:none;border-color:#800000;background-color:#FFFAF4}.st-productlist-result_top{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:0.6rem}.st-product_listtab-btn{background-color:rgba(128,0,0,0.08);border:1px solid #FFFAF4}.st-product_listtab-btn:active,.st-product_listtab-btn:focus{-webkit-box-shadow:none;box-shadow:none;border:1px solid #800000;outline:none}.st-product_listtab-btn.active{border:1px solid #800000}.st-productlist-result_top .btn-check:focus,.st-productlist-result_top .btn-check:focus+.btn{-webkit-box-shadow:none;box-shadow:none}.st-selected_prdt-detail-heading{font-size:clamp(1.25rem,0.61vw + 1.1rem,1.58rem);color:#000;font-weight:600}.st-selected_prdt-detail{margin:1rem 0}.st-selected_prdt_sub-text{color:#7D7D7D;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem)}.st-selected_prdt--price{font-size:clamp(1.56rem,1vw + 1.31rem,2.11rem);color:#800000;font-weight:700}.st-selected_prdt-offerprice{text-decoration:line-through;color:#7D7D7D;font-size:clamp(1.25rem,0.61vw + 1.1rem,1.58rem);padding:0 0.4rem}.st-rating_star{color:#F99417;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem)}.st-selected_prdt-rating{font-weight:bold;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem)}.st-selected__rating-count{padding-left:0.5rem;border-left:1px solid #D9D9D9}.st-rating_text{color:#555555;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem)}.st-selected_prdt-rating--container{padding-bottom:0.8rem;border-bottom:1px solid #D9D9D9;margin-bottom:0.8rem}.st-selected_color--input{margin:8px;height:13px;width:13px;opacity:0}.st-select_prdt-heading{color:#000;font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem);font-weight:600;margin-top:1rem}.st-selected_prdt-group{display:-webkit-box;display:-ms-flexbox;display:flex;gap:0.8rem}.st-selected_prdt--btn{width:100%;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);border-radius:4px;border:1px solid #000;padding:0.6rem;font-weight:600}.st-selected_prdt-activebtn{background-color:#800000;color:#fff;border-color:#800000}.st-selected_prdt-activebtn:hover{color:#fff}.st-selected_prdct-img{height:540px}@media (max-width:768px){.st-selected_prdct-img{height:auto}}.st-selected_prdct--container{margin:1rem 0;display:-webkit-box;display:-ms-flexbox;display:flex;gap:0.4rem}.st-selected_prdct__choice-container{width:135px;height:130px}@media (max-width:992px){.st-selected_prdct__choice-container{width:90px;height:86px}}@media (max-width:768px){.st-selected_prdct__choice-container{width:70px;height:64px}}.st-selected_prdct--choice{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:0.4rem}.st-selected_color--label{position:relative;display:inline-block;border:5px solid #000;border-radius:50%;text-align:center;-webkit-transition:background-color 0.05s ease-in-out,border-color 0.05s ease-in-out,-webkit-box-shadow 0.05s ease-in-out;transition:background-color 0.05s ease-in-out,border-color 0.05s ease-in-out,-webkit-box-shadow 0.05s ease-in-out;transition:background-color 0.05s ease-in-out,border-color 0.05s ease-in-out,box-shadow 0.05s ease-in-out;transition:background-color 0.05s ease-in-out,border-color 0.05s ease-in-out,box-shadow 0.05s ease-in-out,-webkit-box-shadow 0.05s ease-in-out}.st-selected_color--label:before{content:"";display:block;position:absolute;top:-4px;left:-4px;bottom:-4px;right:-4px;border:4px solid #FFFAF4;border-radius:50%;-webkit-box-shadow:inset 0 0 3px rgba(0,0,0,0.3);box-shadow:inset 0 0 3px rgba(0,0,0,0.3)}.st-select_prdt-quantity{display:-webkit-box;display:-ms-flexbox;display:flex;margin-bottom:2rem;border:2px solid #D9D9D9;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.st-select_quantity-input{height:auto;max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;background-color:transparent;border:none;max-width:5ch;border-left:1px solid #D9D9D9;border-right:1px solid #D9D9D9;border-radius:0px}.st-select_quantity-input:focus{background-color:transparent;-webkit-box-shadow:none;box-shadow:none;border-left:1px solid #D9D9D9;border-right:1px solid #D9D9D9}.st-select_prdct-info--container{margin:2rem 0}.st-select_prdt-quanity-btn{font-weight:700;border-radius:0px}.st-select_prdt-quanity-btn:hover{background-color:rgba(128,0,0,0.08)}.st-select_prdt-quanity-btn:focus{-webkit-box-shadow:none;box-shadow:none}.st-tabs{border-bottom:1px solid #D9D9D9}.st-tabs .st-select-prdt_tab--link{color:#7D7D7D;font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem);background-color:transparent;font-weight:500;padding-left:0px;padding-right:1.6rem}.st-tabs .st-select-prdt_tab--link:hover{border:none}.st-tabs .st-select-prdt_tab--link.active,.st-tabs .st-select-prdt_tab--link:focus{background-color:transparent;color:#000;border:none;border-bottom:2px solid #000}@media (max-width:575px){.st-tabs .st-select-prdt_tab--link{padding-right:1rem}}.st-select_prdt-tab--content{padding:1rem 0;color:#7D7D7D;max-width:90%;line-height:1.8rem}.st-share_in-media{color:#000;padding:0.2rem;font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem)}.st-share_in-media:hover{color:#800000}.st-share-media_container{margin-top:2rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:end;width:100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.st-hero_section-banner--head{font-weight:bold}.st-sm_highlight{color:#800000;text-transform:uppercase;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem)}.st-abt__main--heading{font-size:clamp(1.56rem,1vw + 1.31rem,2.11rem);font-weight:700;margin:1rem 0}.st-abt__text{font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);line-height:170%}.st-abt__link{color:#800000;font-weight:700;position:relative}.st-abt__link:after{content:"";float:right;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(128,0,0,1)'%3E%3Cpath fill='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpath d='M13.1717 12.0007L8.22192 7.05093L9.63614 5.63672L16.0001 12.0007L9.63614 18.3646L8.22192 16.9504L13.1717 12.0007Z'%3E%3C/path%3E%3C/svg%3E");width:1.5rem;height:1.5rem;position:absolute;background-position:center;background-repeat:no-repeat}.st-abt__link:hover{color:#800000}.st-abouts_img--container{height:100%}.st-aboutus__heading{font-size:clamp(1.25rem,0.61vw + 1.1rem,1.58rem);font-weight:bold}.st-aboutus__service{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin:7rem 0}@media (max-width:768px){.st-aboutus__service{margin:3rem 0}}.st-abouts_service-items{display:-webkit-box;display:-ms-flexbox;display:flex;gap:1rem}.st-aboutus__service--container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;width:100%;margin:3rem 0;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:2rem}@media (max-width:768px){.st-aboutus__service--container{margin:1rem 0}}.st-aboutus_imgContainer{width:4rem}.st-aboutus_service-head{font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem);color:#000;font-weight:500}.st-aboutus_service-subtext{color:#7D7D7D;margin-bottom:0px}.st-aboutus_light--text{color:#000;font-weight:300;padding:0.5rem 0}.st-aboutus_team-imgcontainer{height:320px}.st-aboutus_team-imgcontainer img{-o-object-fit:cover;object-fit:cover}@media (max-width:992px){.st-aboutus_team-imgcontainer{height:210px}}@media (max-width:400px){.st-aboutus_team-imgcontainer{height:150px}}.st-sm__testimonial--head{text-transform:capitalize}.st-testimonial__card{background-color:#fff;border-radius:2px;-webkit-box-shadow:0px 0px 14px 0px rgba(128,0,0,0.08);box-shadow:0px 0px 14px 0px rgba(128,0,0,0.08);padding:2rem;margin:0.8rem}.st-testimonial__content{color:#7D7D7D;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem)}.st-testimonial__person--detail{display:-webkit-box;display:-ms-flexbox;display:flex;gap:0.5rem}.st-testimonial__person-img{width:50px;height:50px;border-radius:50px;overflow:hidden}.st-testimonial_name{font-weight:600;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);margin-bottom:0}.st-star__icon{color:#FFD400;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem)}.st_accordion-btn{margin:1rem 0;-webkit-transition:all 0.3s;transition:all 0.3s}.st_accordion-btn:after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(128,0,0,1)'%3E%3Cpath fill='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpath d='M11 11V5H13V11H19V13H13V19H11V13H5V11H11Z'%3E%3C/path%3E%3C/svg%3E")}.st-accordion__item{background-color:transparent;border:none}.st-accordion__item .st_accordion-btn{border-radius:4px;background-color:#fff;-webkit-box-shadow:0px 0px 14px 0px rgba(255,250,244,0.42);box-shadow:0px 0px 14px 0px rgba(255,250,244,0.42)}.st_accordion-btn:not(.collapsed){background-color:#800000;color:#fff;-webkit-box-shadow:0px 0px 14px 0px rgba(255,250,244,0.42);box-shadow:0px 0px 14px 0px rgba(255,250,244,0.42)}.st_accordion-btn:not(.collapsed):after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(255,255,255,1)'%3E%3Cpath fill='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpath d='M5 11V13H19V11H5Z'%3E%3C/path%3E%3C/svg%3E")}.st-accordion__body{font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);color:#555555;line-height:1.7rem}.st-blog__header{margin:3rem 0;position:relative}.st-blog__item-list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.st-blog__item-list :before{content:"";position:absolute;width:100%;left:0;right:0;height:1px;background-color:#E2E2E2;top:14px;z-index:-1}.st-blog__category-item{color:#000;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);padding:0 0.7rem;background-color:#FFFAF4}.st-blog__category-item:hover{color:#800000}.st-blog__category-item.active{color:#800000}.st-blog__img{width:100%;height:280px;border-radius:4px;overflow:hidden}.st-blog__title{color:#000;font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem);font-weight:600;margin-bottom:2rem}.st-blog__sub-title{color:#555555;font-size:clamp(1rem,0.34vw + 0.91rem,1.19rem)}.st-blog-label{color:#7D7D7D;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);padding-right:2rem}.st-singleblog_container{height:470px}@media (max-width:768px){.st-singleblog_container{height:280px}}.st-singleblog__title{font-size:clamp(1.56rem,1vw + 1.31rem,2.11rem);color:#000;font-weight:600;margin:1rem 0}.st-blog-highlight{color:#000;font-size:clamp(0.8rem,0.17vw + 0.76rem,0.89rem);font-weight:600;width:100px} +@media (max-width: 767px) { + .st-testimonial__card { + padding: 5rem !important; + } +} +.st-menu__item:before { + content: ""; + position: absolute; + bottom: -1px; + left: 0; + width: 0px; + height: 2px; + background-color: #800000; + -webkit-transition: width 0.3s ease-in-out; + transition: width 0.3s ease-in-out; +} + +.st-header_link-list .nav-link { +color: #fff; +padding: 0px 9px; + padding-top: 0px; + padding-right: 4px; + padding-left:4x; +} +.o_wsale_my_cart { margin-left:0px !important; } +.nav-link:hover, .nav-link:focus{ color:#fff !important; } + +.main-menu .nav-link:hover, .nav-link:focus{ color:#000 !important; } + +.menu-list{float: left;padding:10px} +/* Mobile View - Adjusted Styling for Always Visible Menu */ +@media (max-width: 768px) { +.menu-list{float: left;padding:5px} +} + +.st-product-like_btn{ display:flex; align-items:center; justify-content:center; } + +.st-product_overlay-content{ margin:0px !important; width:200px; float: left;} + +#products_grid:not(.o_wsale_layout_list) td.oe_product .o_wsale_product_btn{ width:96% !important; margin: 10px 4px !important; } + +.st-cart_btn--sm{ + height:35px; + width :140px; + padding:4px 0px !important; font-size: 13px; font-weight: normal; + } + +.st-productlist-result_top{ margin-bottom:24px; } + +.st-productlist_searchbar{ height:40px; } +.st-search_container{ width:100%; } +.o_pricelist_dropdown { width:29% !important ; } +.o_sortby_dropdown { width:28% !important ; } +.st-product_listtab-btn{ margin-right:3px; } +.o_wsale_product_btn{ width:25%; } + +.st-mob-sidebar_menu-container{ margin:0px !important; } + +.st-mob-sidebar_menu-container{ -webkit-box-shadow: 0px -4px 12px 4px rgba(0,0,0,0.25); + box-shadow: 0px -4px 12px 4px rgba(0,0,0,0.25); } + .main-menu{ margin-bottom:0px !important; } + .st-mob-sidebar--nav-btn{ padding:0px !important; } + .st-hero_section-banner{ background:#f6e7e1; } + main{ background:#FFFAF4; } + .st-mob-sidebar_menu-container { background:#FFFAF4; } + + .st-auto-image a{ height:100%; } + .website_blog #o_wblog_posts_loop .o_record_cover_container{ height:100% !important; } + .top_deal_product{margin-top: -128px;} +@media (max-width:375px){.st-logo{margin-right: -7px; } .top_deal_product{margin-top: -50px;}} + +.custom_cart { + color: white !important; +} +.o_add_compare { +margin-bottom: -16px; +} + +.oe_product_cart { + border-width: var(--o-wsale-card-border-width, 0 0 0px)!important; +} +.testimonial_form{ + margin-left:200px; + display: none; + width:800px; +} +@media (max-width: 767px) { +.testimonial_form{ + margin-left:3px !important; + display: none; + width:100%; + !important +} + .testimonial{ + margin-left:0px; + display: none; + !important +} + .gap-2 { + gap: 1.5rem !important; + } + } diff --git a/theme_shopping/static/src/css/owl.carousel.css b/theme_shopping/static/src/css/owl.carousel.css new file mode 100644 index 000000000..82638a01a --- /dev/null +++ b/theme_shopping/static/src/css/owl.carousel.css @@ -0,0 +1,247 @@ +/** + * Owl Carousel v2.3.4 + * Copyright 2013-2018 David Deutsch + * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE + */ + +/* General Owl Carousel Styling */ +.owl-carousel { + display: none; + width: 100%; + -webkit-tap-highlight-color: transparent; + position: relative; + 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(0px, 0px, 0px); +} + +.owl-carousel .owl-wrapper, +.owl-carousel .owl-item { + -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 { + position: relative; + min-height: 1px; + float: left; + -webkit-backface-visibility: hidden; + -webkit-tap-highlight-color: transparent; + -webkit-touch-callout: none; +} + +.owl-carousel .owl-item img { + display: block; + width: 100%; +} + +.owl-carousel .owl-nav.disabled, +.owl-carousel .owl-dots.disabled { + display: none; +} + +.owl-carousel .owl-nav .owl-prev, +.owl-carousel .owl-nav .owl-next, +.owl-carousel .owl-dot { + 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-prev, +.owl-carousel .owl-nav button.owl-next, +.owl-carousel button.owl-dot { + background: none; + color: inherit; + border: none; + padding: 0 !important; + font: inherit; +} + +.owl-carousel.owl-loaded { + display: block; +} + +.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; +} + +/* No Js */ +.no-js .owl-carousel { + display: block; +} + +/* Responsive Styling */ + +/* Mobile View - 1 item per slide */ +@media (max-width: 767px) { + .owl-carousel .item { + width: 100% !important; /* 1 item per slide on mobile */ + } +} + +/* Tablet View - 2 items per slide */ +@media (min-width: 768px) and (max-width: 1023px) { + .owl-carousel .item { + width: 100%; /* 2 items per slide on tablets */ + } +} + +/* Desktop View - 3 items per slide */ +@media (min-width: 1024px) { + .owl-carousel .item { + width: 33.33%; /* 3 items per slide on desktops */ + } +} + +/* Owl Carousel - Animate Plugin */ +.owl-carousel .animated { + animation-duration: 1000ms; + 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 Carousel - Auto Height Plugin */ +.owl-height { + transition: height 500ms ease-in-out; +} + +/* Owl Carousel - Lazy Load Plugin */ +.owl-carousel .owl-item .owl-lazy { + opacity: 0; + transition: opacity 400ms ease; +} + +.owl-carousel .owl-item .owl-lazy[src^=""], .owl-carousel .owl-item .owl-lazy:not([src]) { + max-height: 0; +} + +.owl-carousel .owl-item img.owl-lazy { + transform-style: preserve-3d; +} + +/* Owl Carousel - Video Plugin */ +.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 100ms 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-tn, +.owl-carousel .owl-video-playing .owl-video-play-icon { + display: none; +} + +.owl-carousel .owl-video-tn { + opacity: 0; + height: 100%; + background-position: center center; + background-repeat: no-repeat; + background-size: contain; + transition: opacity 400ms ease; +} + +.owl-carousel .owl-video-frame { + position: relative; + z-index: 1; + height: 100%; + width: 100%; +} diff --git a/theme_shopping/static/src/css/owl.carousel.min.css b/theme_shopping/static/src/css/owl.carousel.min.css new file mode 100644 index 000000000..1a713dda5 --- /dev/null +++ b/theme_shopping/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:block}.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%} \ No newline at end of file diff --git a/theme_shopping/static/src/css/owl.theme.default.min.css b/theme_shopping/static/src/css/owl.theme.default.min.css new file mode 100644 index 000000000..49cfdf027 --- /dev/null +++ b/theme_shopping/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} \ No newline at end of file diff --git a/theme_shopping/static/src/images/08a99f081b7c7fc04c182881ad4d1cb1.jpg b/theme_shopping/static/src/images/08a99f081b7c7fc04c182881ad4d1cb1.jpg new file mode 100644 index 000000000..4a3049d34 Binary files /dev/null and b/theme_shopping/static/src/images/08a99f081b7c7fc04c182881ad4d1cb1.jpg differ diff --git a/theme_shopping/static/src/images/0ee2c56e6de752d57cbe818d7f779094.jpg b/theme_shopping/static/src/images/0ee2c56e6de752d57cbe818d7f779094.jpg new file mode 100644 index 000000000..79168938a Binary files /dev/null and b/theme_shopping/static/src/images/0ee2c56e6de752d57cbe818d7f779094.jpg differ diff --git a/theme_shopping/static/src/images/4d0009fb34fe3f47d9cfeb8489f36b10.png b/theme_shopping/static/src/images/4d0009fb34fe3f47d9cfeb8489f36b10.png new file mode 100644 index 000000000..d95a30b1a Binary files /dev/null and b/theme_shopping/static/src/images/4d0009fb34fe3f47d9cfeb8489f36b10.png differ diff --git a/theme_shopping/static/src/images/57eb7bf51ff78dc8415768debf6c876d.jpg b/theme_shopping/static/src/images/57eb7bf51ff78dc8415768debf6c876d.jpg new file mode 100644 index 000000000..7bdb67f6a Binary files /dev/null and b/theme_shopping/static/src/images/57eb7bf51ff78dc8415768debf6c876d.jpg differ diff --git a/theme_shopping/static/src/images/71f69b8cc982b3cddda12c64ad7d45fe.png b/theme_shopping/static/src/images/71f69b8cc982b3cddda12c64ad7d45fe.png new file mode 100644 index 000000000..b3268b5fc Binary files /dev/null and b/theme_shopping/static/src/images/71f69b8cc982b3cddda12c64ad7d45fe.png differ diff --git a/theme_shopping/static/src/images/Arrow 1.svg b/theme_shopping/static/src/images/Arrow 1.svg new file mode 100755 index 000000000..29b1829c3 --- /dev/null +++ b/theme_shopping/static/src/images/Arrow 1.svg @@ -0,0 +1,3 @@ + + + diff --git a/theme_shopping/static/src/images/Arrow 2.svg b/theme_shopping/static/src/images/Arrow 2.svg new file mode 100755 index 000000000..7f5df273a --- /dev/null +++ b/theme_shopping/static/src/images/Arrow 2.svg @@ -0,0 +1,3 @@ + + + diff --git a/theme_shopping/static/src/images/Rectangle 83.png b/theme_shopping/static/src/images/Rectangle 83.png new file mode 100644 index 000000000..e35242ccd Binary files /dev/null and b/theme_shopping/static/src/images/Rectangle 83.png differ diff --git a/theme_shopping/static/src/images/Rectangle 84.png b/theme_shopping/static/src/images/Rectangle 84.png new file mode 100644 index 000000000..3f6bdc69c Binary files /dev/null and b/theme_shopping/static/src/images/Rectangle 84.png differ diff --git a/theme_shopping/static/src/images/Rectangle 85.png b/theme_shopping/static/src/images/Rectangle 85.png new file mode 100644 index 000000000..2d0fc9e54 Binary files /dev/null and b/theme_shopping/static/src/images/Rectangle 85.png differ diff --git a/theme_shopping/static/src/images/Rectangle 86.png b/theme_shopping/static/src/images/Rectangle 86.png new file mode 100644 index 000000000..fdbb93d13 Binary files /dev/null and b/theme_shopping/static/src/images/Rectangle 86.png differ diff --git a/theme_shopping/static/src/images/Rectangle 87.png b/theme_shopping/static/src/images/Rectangle 87.png new file mode 100644 index 000000000..fdf07783b Binary files /dev/null and b/theme_shopping/static/src/images/Rectangle 87.png differ diff --git a/theme_shopping/static/src/images/Rectangle 88.png b/theme_shopping/static/src/images/Rectangle 88.png new file mode 100644 index 000000000..cb45a252a Binary files /dev/null and b/theme_shopping/static/src/images/Rectangle 88.png differ diff --git a/theme_shopping/static/src/images/about-main.png b/theme_shopping/static/src/images/about-main.png new file mode 100644 index 000000000..cadba87bf Binary files /dev/null and b/theme_shopping/static/src/images/about-main.png differ diff --git a/theme_shopping/static/src/images/bottle.png b/theme_shopping/static/src/images/bottle.png new file mode 100644 index 000000000..114043013 Binary files /dev/null and b/theme_shopping/static/src/images/bottle.png differ diff --git a/theme_shopping/static/src/images/cmpy-logo.png b/theme_shopping/static/src/images/cmpy-logo.png new file mode 100644 index 000000000..d89f1fd85 Binary files /dev/null and b/theme_shopping/static/src/images/cmpy-logo.png differ diff --git a/theme_shopping/static/src/images/cyber-monday-retail-sales 1.png b/theme_shopping/static/src/images/cyber-monday-retail-sales 1.png new file mode 100644 index 000000000..f31afd3cd Binary files /dev/null and b/theme_shopping/static/src/images/cyber-monday-retail-sales 1.png differ diff --git a/theme_shopping/static/src/images/d1b5c24cef48507521eeba649bd1f0cf.png b/theme_shopping/static/src/images/d1b5c24cef48507521eeba649bd1f0cf.png new file mode 100644 index 000000000..c7d0dff2d Binary files /dev/null and b/theme_shopping/static/src/images/d1b5c24cef48507521eeba649bd1f0cf.png differ diff --git a/theme_shopping/static/src/images/delivery.png b/theme_shopping/static/src/images/delivery.png new file mode 100644 index 000000000..0b81129c7 Binary files /dev/null and b/theme_shopping/static/src/images/delivery.png differ diff --git a/theme_shopping/static/src/images/fashion.png b/theme_shopping/static/src/images/fashion.png new file mode 100644 index 000000000..79463cc0b Binary files /dev/null and b/theme_shopping/static/src/images/fashion.png differ diff --git a/theme_shopping/static/src/images/fd41c182ff914d211fbbcdc1ee0f5cb1.jpg b/theme_shopping/static/src/images/fd41c182ff914d211fbbcdc1ee0f5cb1.jpg new file mode 100644 index 000000000..812371788 Binary files /dev/null and b/theme_shopping/static/src/images/fd41c182ff914d211fbbcdc1ee0f5cb1.jpg differ diff --git a/theme_shopping/static/src/images/footer-image.png b/theme_shopping/static/src/images/footer-image.png new file mode 100644 index 000000000..bae06d748 Binary files /dev/null and b/theme_shopping/static/src/images/footer-image.png differ diff --git a/theme_shopping/static/src/images/gadget.png b/theme_shopping/static/src/images/gadget.png new file mode 100644 index 000000000..08ff0fcd3 Binary files /dev/null and b/theme_shopping/static/src/images/gadget.png differ diff --git a/theme_shopping/static/src/images/gifts.png b/theme_shopping/static/src/images/gifts.png new file mode 100644 index 000000000..d95a30b1a Binary files /dev/null and b/theme_shopping/static/src/images/gifts.png differ diff --git a/theme_shopping/static/src/images/grocery.png b/theme_shopping/static/src/images/grocery.png new file mode 100644 index 000000000..0f72aee55 Binary files /dev/null and b/theme_shopping/static/src/images/grocery.png differ diff --git a/theme_shopping/static/src/images/guaranty.png b/theme_shopping/static/src/images/guaranty.png new file mode 100644 index 000000000..f23120b4a Binary files /dev/null and b/theme_shopping/static/src/images/guaranty.png differ diff --git a/theme_shopping/static/src/images/hero-img-2.png b/theme_shopping/static/src/images/hero-img-2.png new file mode 100644 index 000000000..8a7cc1695 Binary files /dev/null and b/theme_shopping/static/src/images/hero-img-2.png differ diff --git a/theme_shopping/static/src/images/hero-img.jpg b/theme_shopping/static/src/images/hero-img.jpg new file mode 100644 index 000000000..66b546364 Binary files /dev/null and b/theme_shopping/static/src/images/hero-img.jpg differ diff --git a/theme_shopping/static/src/images/homeappliance.png b/theme_shopping/static/src/images/homeappliance.png new file mode 100644 index 000000000..b7bfe78ec Binary files /dev/null and b/theme_shopping/static/src/images/homeappliance.png differ diff --git a/theme_shopping/static/src/images/hoodie.png b/theme_shopping/static/src/images/hoodie.png new file mode 100644 index 000000000..2bfc57191 Binary files /dev/null and b/theme_shopping/static/src/images/hoodie.png differ diff --git a/theme_shopping/static/src/images/lamp.png b/theme_shopping/static/src/images/lamp.png new file mode 100644 index 000000000..84aeca985 Binary files /dev/null and b/theme_shopping/static/src/images/lamp.png differ diff --git a/theme_shopping/static/src/images/offer.png b/theme_shopping/static/src/images/offer.png new file mode 100644 index 000000000..9178d5a60 Binary files /dev/null and b/theme_shopping/static/src/images/offer.png differ diff --git a/theme_shopping/static/src/images/plant-lover-home-decor-with-picture-frame 1.png b/theme_shopping/static/src/images/plant-lover-home-decor-with-picture-frame 1.png new file mode 100644 index 000000000..4b54f1d2b Binary files /dev/null and b/theme_shopping/static/src/images/plant-lover-home-decor-with-picture-frame 1.png differ diff --git a/theme_shopping/static/src/images/sm-logo.png b/theme_shopping/static/src/images/sm-logo.png new file mode 100644 index 000000000..e7ae10473 Binary files /dev/null and b/theme_shopping/static/src/images/sm-logo.png differ diff --git a/theme_shopping/static/src/images/snippet_icons/Best-Seller.jpg b/theme_shopping/static/src/images/snippet_icons/Best-Seller.jpg new file mode 100644 index 000000000..4cead665f Binary files /dev/null and b/theme_shopping/static/src/images/snippet_icons/Best-Seller.jpg differ diff --git a/theme_shopping/static/src/images/snippet_icons/Portfolio.png b/theme_shopping/static/src/images/snippet_icons/Portfolio.png new file mode 100644 index 000000000..b4e8675d5 Binary files /dev/null and b/theme_shopping/static/src/images/snippet_icons/Portfolio.png differ diff --git a/theme_shopping/static/src/images/snippet_icons/Refurbished-Carousel.jpg b/theme_shopping/static/src/images/snippet_icons/Refurbished-Carousel.jpg new file mode 100644 index 000000000..96ef31f41 Binary files /dev/null and b/theme_shopping/static/src/images/snippet_icons/Refurbished-Carousel.jpg differ diff --git a/theme_shopping/static/src/images/snippet_icons/Sign-up-snippet.jpg b/theme_shopping/static/src/images/snippet_icons/Sign-up-snippet.jpg new file mode 100644 index 000000000..668df9153 Binary files /dev/null and b/theme_shopping/static/src/images/snippet_icons/Sign-up-snippet.jpg differ diff --git a/theme_shopping/static/src/images/snippet_icons/asked-question-snippet.png b/theme_shopping/static/src/images/snippet_icons/asked-question-snippet.png new file mode 100644 index 000000000..3a0599a82 Binary files /dev/null and b/theme_shopping/static/src/images/snippet_icons/asked-question-snippet.png differ diff --git a/theme_shopping/static/src/images/snippet_icons/best-deal.png b/theme_shopping/static/src/images/snippet_icons/best-deal.png new file mode 100644 index 000000000..f17f798e7 Binary files /dev/null and b/theme_shopping/static/src/images/snippet_icons/best-deal.png differ diff --git a/theme_shopping/static/src/images/snippet_icons/best-product-carousel.png b/theme_shopping/static/src/images/snippet_icons/best-product-carousel.png new file mode 100644 index 000000000..17a815612 Binary files /dev/null and b/theme_shopping/static/src/images/snippet_icons/best-product-carousel.png differ diff --git a/theme_shopping/static/src/images/snippet_icons/packages_block.jpg b/theme_shopping/static/src/images/snippet_icons/packages_block.jpg new file mode 100644 index 000000000..32bcdfae6 Binary files /dev/null and b/theme_shopping/static/src/images/snippet_icons/packages_block.jpg differ diff --git a/theme_shopping/static/src/images/snippet_icons/team-block.jpg b/theme_shopping/static/src/images/snippet_icons/team-block.jpg new file mode 100644 index 000000000..764cfc604 Binary files /dev/null and b/theme_shopping/static/src/images/snippet_icons/team-block.jpg differ diff --git a/theme_shopping/static/src/images/snippet_icons/testinomial-1.png b/theme_shopping/static/src/images/snippet_icons/testinomial-1.png new file mode 100644 index 000000000..bef28d0ba Binary files /dev/null and b/theme_shopping/static/src/images/snippet_icons/testinomial-1.png differ diff --git a/theme_shopping/static/src/images/sofa-1.png b/theme_shopping/static/src/images/sofa-1.png new file mode 100644 index 000000000..da16d7dcd Binary files /dev/null and b/theme_shopping/static/src/images/sofa-1.png differ diff --git a/theme_shopping/static/src/images/sofa-10.png b/theme_shopping/static/src/images/sofa-10.png new file mode 100644 index 000000000..5df9bc4be Binary files /dev/null and b/theme_shopping/static/src/images/sofa-10.png differ diff --git a/theme_shopping/static/src/images/sofa-11.png b/theme_shopping/static/src/images/sofa-11.png new file mode 100644 index 000000000..841132dce Binary files /dev/null and b/theme_shopping/static/src/images/sofa-11.png differ diff --git a/theme_shopping/static/src/images/sofa-2.png b/theme_shopping/static/src/images/sofa-2.png new file mode 100644 index 000000000..a9ae9779d Binary files /dev/null and b/theme_shopping/static/src/images/sofa-2.png differ diff --git a/theme_shopping/static/src/images/sofa-3.png b/theme_shopping/static/src/images/sofa-3.png new file mode 100644 index 000000000..92cdb7fbb Binary files /dev/null and b/theme_shopping/static/src/images/sofa-3.png differ diff --git a/theme_shopping/static/src/images/sofa-4.png b/theme_shopping/static/src/images/sofa-4.png new file mode 100644 index 000000000..91eb1b177 Binary files /dev/null and b/theme_shopping/static/src/images/sofa-4.png differ diff --git a/theme_shopping/static/src/images/sofa-5.png b/theme_shopping/static/src/images/sofa-5.png new file mode 100644 index 000000000..b1f368624 Binary files /dev/null and b/theme_shopping/static/src/images/sofa-5.png differ diff --git a/theme_shopping/static/src/images/sofa-6.png b/theme_shopping/static/src/images/sofa-6.png new file mode 100644 index 000000000..922d0d44e Binary files /dev/null and b/theme_shopping/static/src/images/sofa-6.png differ diff --git a/theme_shopping/static/src/images/sofa-7.png b/theme_shopping/static/src/images/sofa-7.png new file mode 100644 index 000000000..7399960fe Binary files /dev/null and b/theme_shopping/static/src/images/sofa-7.png differ diff --git a/theme_shopping/static/src/images/sofa-8.png b/theme_shopping/static/src/images/sofa-8.png new file mode 100644 index 000000000..b6fc58bc6 Binary files /dev/null and b/theme_shopping/static/src/images/sofa-8.png differ diff --git a/theme_shopping/static/src/images/sofa-9.png b/theme_shopping/static/src/images/sofa-9.png new file mode 100644 index 000000000..417290f1c Binary files /dev/null and b/theme_shopping/static/src/images/sofa-9.png differ diff --git a/theme_shopping/static/src/images/sofa.jpg b/theme_shopping/static/src/images/sofa.jpg new file mode 100644 index 000000000..d96574e4a Binary files /dev/null and b/theme_shopping/static/src/images/sofa.jpg differ diff --git a/theme_shopping/static/src/images/support.png b/theme_shopping/static/src/images/support.png new file mode 100644 index 000000000..a70b09641 Binary files /dev/null and b/theme_shopping/static/src/images/support.png differ diff --git a/theme_shopping/static/src/images/team-member1.png b/theme_shopping/static/src/images/team-member1.png new file mode 100644 index 000000000..a3a7da848 Binary files /dev/null and b/theme_shopping/static/src/images/team-member1.png differ diff --git a/theme_shopping/static/src/images/team-member2.png b/theme_shopping/static/src/images/team-member2.png new file mode 100644 index 000000000..afe8bff7c Binary files /dev/null and b/theme_shopping/static/src/images/team-member2.png differ diff --git a/theme_shopping/static/src/images/team-member3.png b/theme_shopping/static/src/images/team-member3.png new file mode 100644 index 000000000..63bd10e0d Binary files /dev/null and b/theme_shopping/static/src/images/team-member3.png differ diff --git a/theme_shopping/static/src/images/team-member4.png b/theme_shopping/static/src/images/team-member4.png new file mode 100644 index 000000000..df4474263 Binary files /dev/null and b/theme_shopping/static/src/images/team-member4.png differ diff --git a/theme_shopping/static/src/images/testimonial-img.png b/theme_shopping/static/src/images/testimonial-img.png new file mode 100644 index 000000000..a2222c238 Binary files /dev/null and b/theme_shopping/static/src/images/testimonial-img.png differ diff --git a/theme_shopping/static/src/images/testimonial-pic.png b/theme_shopping/static/src/images/testimonial-pic.png new file mode 100644 index 000000000..04717a687 Binary files /dev/null and b/theme_shopping/static/src/images/testimonial-pic.png differ diff --git a/theme_shopping/static/src/images/wallet.png b/theme_shopping/static/src/images/wallet.png new file mode 100644 index 000000000..b49c22f22 Binary files /dev/null and b/theme_shopping/static/src/images/wallet.png differ diff --git a/theme_shopping/static/src/images/washing-machine.png b/theme_shopping/static/src/images/washing-machine.png new file mode 100644 index 000000000..8bea3b3e1 Binary files /dev/null and b/theme_shopping/static/src/images/washing-machine.png differ diff --git a/theme_shopping/static/src/js/owl.carousel.js b/theme_shopping/static/src/js/owl.carousel.js new file mode 100644 index 000000000..ba8f34315 --- /dev/null +++ b/theme_shopping/static/src/js/owl.carousel.js @@ -0,0 +1,3448 @@ +/** + * 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 + * @version 2.3.4 + * @author Bartosz Wojciechowski + * @author David Deutsch + * @license The MIT License (MIT) + * @todo Lazy Load Icon + * @todo prevent animationend bubling + * @todo itemsScaleUp + * @todo Test Zepto + * @todo stagePadding calculate wrong active classes + */ +;(function($, window, document, undefined) { + + /** + * Creates a carousel. + * @class The Owl Carousel. + * @public + * @param {HTMLElement|jQuery} element - The element to create the carousel for. + * @param {Object} [options] - The options + */ + function Owl(element, options) { + + /** + * Current settings for the carousel. + * @public + */ + this.settings = null; + + /** + * Current options set by the caller including defaults. + * @public + */ + this.options = $.extend({}, Owl.Defaults, options); + + /** + * Plugin element. + * @public + */ + this.$element = $(element); + + /** + * Proxied event handlers. + * @protected + */ + this._handlers = {}; + + /** + * References to the running plugins of this carousel. + * @protected + */ + this._plugins = {}; + + /** + * Currently suppressed events to prevent them from being retriggered. + * @protected + */ + this._supress = {}; + + /** + * Absolute current position. + * @protected + */ + this._current = null; + + /** + * Animation speed in milliseconds. + * @protected + */ + this._speed = null; + + /** + * Coordinates of all items in pixel. + * @todo The name of this member is missleading. + * @protected + */ + this._coordinates = []; + + /** + * Current breakpoint. + * @todo Real media queries would be nice. + * @protected + */ + this._breakpoint = null; + + /** + * Current width of the plugin element. + */ + this._width = null; + + /** + * All real items. + * @protected + */ + this._items = []; + + /** + * All cloned items. + * @protected + */ + this._clones = []; + + /** + * Merge values of all items. + * @todo Maybe this could be part of a plugin. + * @protected + */ + this._mergers = []; + + /** + * Widths of all items. + */ + this._widths = []; + + /** + * Invalidated parts within the update process. + * @protected + */ + this._invalidated = {}; + + /** + * Ordered list of workers for the update process. + * @protected + */ + this._pipe = []; + + /** + * Current state information for the drag operation. + * @todo #261 + * @protected + */ + this._drag = { + time: null, + target: null, + pointer: null, + stage: { + start: null, + current: null + }, + direction: null + }; + + /** + * Current state information and their tags. + * @type {Object} + * @protected + */ + this._states = { + current: {}, + tags: { + 'initializing': [ 'busy' ], + 'animating': [ 'busy' ], + 'dragging': [ 'interacting' ] + } + }; + + $.each([ 'onResize', 'onThrottledResize' ], $.proxy(function(i, handler) { + this._handlers[handler] = $.proxy(this[handler], this); + }, this)); + + $.each(Owl.Plugins, $.proxy(function(key, plugin) { + this._plugins[key.charAt(0).toLowerCase() + key.slice(1)] + = new plugin(this); + }, this)); + + $.each(Owl.Workers, $.proxy(function(priority, worker) { + this._pipe.push({ + 'filter': worker.filter, + 'run': $.proxy(worker.run, this) + }); + }, this)); + + this.setup(); + this.initialize(); + } + + /** + * Default options for the carousel. + * @public + */ + Owl.Defaults = { + items: 3, + loop: false, + center: false, + rewind: false, + checkVisibility: true, + + mouseDrag: true, + touchDrag: true, + pullDrag: true, + freeDrag: false, + + margin: 0, + stagePadding: 0, + + merge: false, + mergeFit: true, + autoWidth: false, + + startPosition: 0, + rtl: false, + + smartSpeed: 250, + fluidSpeed: false, + dragEndSpeed: false, + + responsive: {}, + responsiveRefreshRate: 200, + responsiveBaseElement: window, + + fallbackEasing: 'swing', + slideTransition: '', + + info: false, + + nestedItemSelector: false, + itemElement: 'div', + stageElement: 'div', + + refreshClass: 'owl-refresh', + loadedClass: 'owl-loaded', + loadingClass: 'owl-loading', + rtlClass: 'owl-rtl', + responsiveClass: 'owl-responsive', + dragClass: 'owl-drag', + itemClass: 'owl-item', + stageClass: 'owl-stage', + stageOuterClass: 'owl-stage-outer', + grabClass: 'owl-grab' + }; + + /** + * Enumeration for width. + * @public + * @readonly + * @enum {String} + */ + Owl.Width = { + Default: 'default', + Inner: 'inner', + Outer: 'outer' + }; + + /** + * Enumeration for types. + * @public + * @readonly + * @enum {String} + */ + Owl.Type = { + Event: 'event', + State: 'state' + }; + + /** + * Contains all registered plugins. + * @public + */ + Owl.Plugins = {}; + + /** + * List of workers involved in the update process. + */ + Owl.Workers = [ { + filter: [ 'width', 'settings' ], + run: function() { + this._width = this.$element.width(); + } + }, { + filter: [ 'width', 'items', 'settings' ], + run: function(cache) { + cache.current = this._items && this._items[this.relative(this._current)]; + } + }, { + filter: [ 'items', 'settings' ], + run: function() { + this.$stage.children('.cloned').remove(); + } + }, { + filter: [ 'width', 'items', 'settings' ], + run: function(cache) { + var margin = this.settings.margin || '', + grid = !this.settings.autoWidth, + rtl = this.settings.rtl, + css = { + 'width': 'auto', + 'margin-left': rtl ? margin : '', + 'margin-right': rtl ? '' : margin + }; + + !grid && this.$stage.children().css(css); + + cache.css = css; + } + }, { + filter: [ 'width', 'items', 'settings' ], + run: function(cache) { + var width = (this.width() / this.settings.items).toFixed(3) - this.settings.margin, + merge = null, + iterator = this._items.length, + grid = !this.settings.autoWidth, + widths = []; + + cache.items = { + merge: false, + width: width + }; + + while (iterator--) { + merge = this._mergers[iterator]; + merge = this.settings.mergeFit && Math.min(merge, this.settings.items) || merge; + + cache.items.merge = merge > 1 || cache.items.merge; + + widths[iterator] = !grid ? this._items[iterator].width() : width * merge; + } + + this._widths = widths; + } + }, { + filter: [ 'items', 'settings' ], + run: function() { + var clones = [], + items = this._items, + settings = this.settings, + // TODO: Should be computed from number of min width items in stage + view = Math.max(settings.items * 2, 4), + size = Math.ceil(items.length / 2) * 2, + repeat = settings.loop && items.length ? settings.rewind ? view : Math.max(view, size) : 0, + append = '', + prepend = ''; + + repeat /= 2; + + while (repeat > 0) { + // Switch to only using appended clones + clones.push(this.normalize(clones.length / 2, true)); + append = append + items[clones[clones.length - 1]][0].outerHTML; + clones.push(this.normalize(items.length - 1 - (clones.length - 1) / 2, true)); + prepend = items[clones[clones.length - 1]][0].outerHTML + prepend; + repeat -= 1; + } + + this._clones = clones; + + $(append).addClass('cloned').appendTo(this.$stage); + $(prepend).addClass('cloned').prependTo(this.$stage); + } + }, { + filter: [ 'width', 'items', 'settings' ], + run: function() { + var rtl = this.settings.rtl ? 1 : -1, + size = this._clones.length + this._items.length, + iterator = -1, + previous = 0, + current = 0, + coordinates = []; + + while (++iterator < size) { + previous = coordinates[iterator - 1] || 0; + current = this._widths[this.relative(iterator)] + this.settings.margin; + coordinates.push(previous + current * rtl); + } + + this._coordinates = coordinates; + } + }, { + filter: [ 'width', 'items', 'settings' ], + run: function() { + var padding = this.settings.stagePadding, + coordinates = this._coordinates, + css = { + 'width': Math.ceil(Math.abs(coordinates[coordinates.length - 1])) + padding * 2, + 'padding-left': padding || '', + 'padding-right': padding || '' + }; + + this.$stage.css(css); + } + }, { + filter: [ 'width', 'items', 'settings' ], + run: function(cache) { + var iterator = this._coordinates.length, + grid = !this.settings.autoWidth, + items = this.$stage.children(); + + if (grid && cache.items.merge) { + while (iterator--) { + cache.css.width = this._widths[this.relative(iterator)]; + items.eq(iterator).css(cache.css); + } + } else if (grid) { + cache.css.width = cache.items.width; + items.css(cache.css); + } + } + }, { + filter: [ 'items' ], + run: function() { + this._coordinates.length < 1 && this.$stage.removeAttr('style'); + } + }, { + filter: [ 'width', 'items', 'settings' ], + run: function(cache) { + cache.current = cache.current ? this.$stage.children().index(cache.current) : 0; + cache.current = Math.max(this.minimum(), Math.min(this.maximum(), cache.current)); + this.reset(cache.current); + } + }, { + filter: [ 'position' ], + run: function() { + this.animate(this.coordinates(this._current)); + } + }, { + filter: [ 'width', 'position', 'items', 'settings' ], + run: function() { + var rtl = this.settings.rtl ? 1 : -1, + padding = this.settings.stagePadding * 2, + begin = this.coordinates(this.current()) + padding, + end = begin + this.width() * rtl, + inner, outer, matches = [], i, n; + + for (i = 0, n = this._coordinates.length; i < n; i++) { + inner = this._coordinates[i - 1] || 0; + outer = Math.abs(this._coordinates[i]) + padding * rtl; + + if ((this.op(inner, '<=', begin) && (this.op(inner, '>', end))) + || (this.op(outer, '<', begin) && this.op(outer, '>', end))) { + matches.push(i); + } + } + + this.$stage.children('.active').removeClass('active'); + this.$stage.children(':eq(' + matches.join('), :eq(') + ')').addClass('active'); + + this.$stage.children('.center').removeClass('center'); + if (this.settings.center) { + this.$stage.children().eq(this.current()).addClass('center'); + } + } + } ]; + + /** + * Create the stage DOM element + */ + Owl.prototype.initializeStage = function() { + this.$stage = this.$element.find('.' + this.settings.stageClass); + + // if the stage is already in the DOM, grab it and skip stage initialization + if (this.$stage.length) { + return; + } + + this.$element.addClass(this.options.loadingClass); + + // create stage + this.$stage = $('<' + this.settings.stageElement + '>', { + "class": this.settings.stageClass + }).wrap( $( '
', { + "class": this.settings.stageOuterClass + })); + + // append stage + this.$element.append(this.$stage.parent()); + }; + + /** + * Create item DOM elements + */ + Owl.prototype.initializeItems = function() { + var $items = this.$element.find('.owl-item'); + + // if the items are already in the DOM, grab them and skip item initialization + if ($items.length) { + this._items = $items.get().map(function(item) { + return $(item); + }); + + this._mergers = this._items.map(function() { + return 1; + }); + + this.refresh(); + + return; + } + + // append content + this.replace(this.$element.children().not(this.$stage.parent())); + + // check visibility + if (this.isVisible()) { + // update view + this.refresh(); + } else { + // invalidate width + this.invalidate('width'); + } + + this.$element + .removeClass(this.options.loadingClass) + .addClass(this.options.loadedClass); + }; + + /** + * Initializes the carousel. + * @protected + */ + Owl.prototype.initialize = function() { + this.enter('initializing'); + this.trigger('initialize'); + + this.$element.toggleClass(this.settings.rtlClass, this.settings.rtl); + + if (this.settings.autoWidth && !this.is('pre-loading')) { + var imgs, nestedSelector, width; + imgs = this.$element.find('img'); + nestedSelector = this.settings.nestedItemSelector ? '.' + this.settings.nestedItemSelector : undefined; + width = this.$element.children(nestedSelector).width(); + + if (imgs.length && width <= 0) { + this.preloadAutoWidthImages(imgs); + } + } + + this.initializeStage(); + this.initializeItems(); + + // register event handlers + this.registerEventHandlers(); + + this.leave('initializing'); + this.trigger('initialized'); + }; + + /** + * @returns {Boolean} visibility of $element + * if you know the carousel will always be visible you can set `checkVisibility` to `false` to + * prevent the expensive browser layout forced reflow the $element.is(':visible') does + */ + Owl.prototype.isVisible = function() { + return this.settings.checkVisibility + ? this.$element.is(':visible') + : true; + }; + + /** + * Setups the current settings. + * @todo Remove responsive classes. Why should adaptive designs be brought into IE8? + * @todo Support for media queries by using `matchMedia` would be nice. + * @public + */ + Owl.prototype.setup = function() { + var viewport = this.viewport(), + overwrites = this.options.responsive, + match = -1, + settings = null; + + if (!overwrites) { + settings = $.extend({}, this.options); + } else { + $.each(overwrites, function(breakpoint) { + if (breakpoint <= viewport && breakpoint > match) { + match = Number(breakpoint); + } + }); + + settings = $.extend({}, this.options, overwrites[match]); + if (typeof settings.stagePadding === 'function') { + settings.stagePadding = settings.stagePadding(); + } + delete settings.responsive; + + // responsive class + if (settings.responsiveClass) { + this.$element.attr('class', + this.$element.attr('class').replace(new RegExp('(' + this.options.responsiveClass + '-)\\S+\\s', 'g'), '$1' + match) + ); + } + } + + this.trigger('change', { property: { name: 'settings', value: settings } }); + this._breakpoint = match; + this.settings = settings; + this.invalidate('settings'); + this.trigger('changed', { property: { name: 'settings', value: this.settings } }); + }; + + /** + * Updates option logic if necessery. + * @protected + */ + Owl.prototype.optionsLogic = function() { + if (this.settings.autoWidth) { + this.settings.stagePadding = false; + this.settings.merge = false; + } + }; + + /** + * Prepares an item before add. + * @todo Rename event parameter `content` to `item`. + * @protected + * @returns {jQuery|HTMLElement} - The item container. + */ + Owl.prototype.prepare = function(item) { + var event = this.trigger('prepare', { content: item }); + + if (!event.data) { + event.data = $('<' + this.settings.itemElement + '/>') + .addClass(this.options.itemClass).append(item) + } + + this.trigger('prepared', { content: event.data }); + + return event.data; + }; + + /** + * Updates the view. + * @public + */ + Owl.prototype.update = function() { + var i = 0, + n = this._pipe.length, + filter = $.proxy(function(p) { return this[p] }, this._invalidated), + cache = {}; + + while (i < n) { + if (this._invalidated.all || $.grep(this._pipe[i].filter, filter).length > 0) { + this._pipe[i].run(cache); + } + i++; + } + + this._invalidated = {}; + + !this.is('valid') && this.enter('valid'); + }; + + /** + * Gets the width of the view. + * @public + * @param {Owl.Width} [dimension=Owl.Width.Default] - The dimension to return. + * @returns {Number} - The width of the view in pixel. + */ + Owl.prototype.width = function(dimension) { + dimension = dimension || Owl.Width.Default; + switch (dimension) { + case Owl.Width.Inner: + case Owl.Width.Outer: + return this._width; + default: + return this._width - this.settings.stagePadding * 2 + this.settings.margin; + } + }; + + /** + * Refreshes the carousel primarily for adaptive purposes. + * @public + */ + Owl.prototype.refresh = function() { + this.enter('refreshing'); + this.trigger('refresh'); + + this.setup(); + + this.optionsLogic(); + + this.$element.addClass(this.options.refreshClass); + + this.update(); + + this.$element.removeClass(this.options.refreshClass); + + this.leave('refreshing'); + this.trigger('refreshed'); + }; + + /** + * Checks window `resize` event. + * @protected + */ + Owl.prototype.onThrottledResize = function() { + window.clearTimeout(this.resizeTimer); + this.resizeTimer = window.setTimeout(this._handlers.onResize, this.settings.responsiveRefreshRate); + }; + + /** + * Checks window `resize` event. + * @protected + */ + Owl.prototype.onResize = function() { + if (!this._items.length) { + return false; + } + + if (this._width === this.$element.width()) { + return false; + } + + if (!this.isVisible()) { + return false; + } + + this.enter('resizing'); + + if (this.trigger('resize').isDefaultPrevented()) { + this.leave('resizing'); + return false; + } + + this.invalidate('width'); + + this.refresh(); + + this.leave('resizing'); + this.trigger('resized'); + }; + + /** + * Registers event handlers. + * @todo Check `msPointerEnabled` + * @todo #261 + * @protected + */ + Owl.prototype.registerEventHandlers = function() { + if ($.support.transition) { + this.$stage.on($.support.transition.end + '.owl.core', $.proxy(this.onTransitionEnd, this)); + } + + if (this.settings.responsive !== false) { + this.on(window, 'resize', this._handlers.onThrottledResize); + } + + if (this.settings.mouseDrag) { + this.$element.addClass(this.options.dragClass); + this.$stage.on('mousedown.owl.core', $.proxy(this.onDragStart, this)); + this.$stage.on('dragstart.owl.core selectstart.owl.core', function() { return false }); + } + + if (this.settings.touchDrag){ + this.$stage.on('touchstart.owl.core', $.proxy(this.onDragStart, this)); + this.$stage.on('touchcancel.owl.core', $.proxy(this.onDragEnd, this)); + } + }; + + /** + * Handles `touchstart` and `mousedown` events. + * @todo Horizontal swipe threshold as option + * @todo #261 + * @protected + * @param {Event} event - The event arguments. + */ + Owl.prototype.onDragStart = function(event) { + var stage = null; + + if (event.which === 3) { + return; + } + + if ($.support.transform) { + stage = this.$stage.css('transform').replace(/.*\(|\)| /g, '').split(','); + stage = { + x: stage[stage.length === 16 ? 12 : 4], + y: stage[stage.length === 16 ? 13 : 5] + }; + } else { + stage = this.$stage.position(); + stage = { + x: this.settings.rtl ? + stage.left + this.$stage.width() - this.width() + this.settings.margin : + stage.left, + y: stage.top + }; + } + + if (this.is('animating')) { + $.support.transform ? this.animate(stage.x) : this.$stage.stop() + this.invalidate('position'); + } + + this.$element.toggleClass(this.options.grabClass, event.type === 'mousedown'); + + this.speed(0); + + this._drag.time = new Date().getTime(); + this._drag.target = $(event.target); + this._drag.stage.start = stage; + this._drag.stage.current = stage; + this._drag.pointer = this.pointer(event); + + $(document).on('mouseup.owl.core touchend.owl.core', $.proxy(this.onDragEnd, this)); + + $(document).one('mousemove.owl.core touchmove.owl.core', $.proxy(function(event) { + var delta = this.difference(this._drag.pointer, this.pointer(event)); + + $(document).on('mousemove.owl.core touchmove.owl.core', $.proxy(this.onDragMove, this)); + + if (Math.abs(delta.x) < Math.abs(delta.y) && this.is('valid')) { + return; + } + + event.preventDefault(); + + this.enter('dragging'); + this.trigger('drag'); + }, this)); + }; + + /** + * Handles the `touchmove` and `mousemove` events. + * @todo #261 + * @protected + * @param {Event} event - The event arguments. + */ + Owl.prototype.onDragMove = function(event) { + var minimum = null, + maximum = null, + pull = null, + delta = this.difference(this._drag.pointer, this.pointer(event)), + stage = this.difference(this._drag.stage.start, delta); + + if (!this.is('dragging')) { + return; + } + + event.preventDefault(); + + if (this.settings.loop) { + minimum = this.coordinates(this.minimum()); + maximum = this.coordinates(this.maximum() + 1) - minimum; + stage.x = (((stage.x - minimum) % maximum + maximum) % maximum) + minimum; + } else { + minimum = this.settings.rtl ? this.coordinates(this.maximum()) : this.coordinates(this.minimum()); + maximum = this.settings.rtl ? this.coordinates(this.minimum()) : this.coordinates(this.maximum()); + pull = this.settings.pullDrag ? -1 * delta.x / 5 : 0; + stage.x = Math.max(Math.min(stage.x, minimum + pull), maximum + pull); + } + + this._drag.stage.current = stage; + + this.animate(stage.x); + }; + + /** + * Handles the `touchend` and `mouseup` events. + * @todo #261 + * @todo Threshold for click event + * @protected + * @param {Event} event - The event arguments. + */ + Owl.prototype.onDragEnd = function(event) { + var delta = this.difference(this._drag.pointer, this.pointer(event)), + stage = this._drag.stage.current, + direction = delta.x > 0 ^ this.settings.rtl ? 'left' : 'right'; + + $(document).off('.owl.core'); + + this.$element.removeClass(this.options.grabClass); + + if (delta.x !== 0 && this.is('dragging') || !this.is('valid')) { + this.speed(this.settings.dragEndSpeed || this.settings.smartSpeed); + this.current(this.closest(stage.x, delta.x !== 0 ? direction : this._drag.direction)); + this.invalidate('position'); + this.update(); + + this._drag.direction = direction; + + if (Math.abs(delta.x) > 3 || new Date().getTime() - this._drag.time > 300) { + this._drag.target.one('click.owl.core', function() { return false; }); + } + } + + if (!this.is('dragging')) { + return; + } + + this.leave('dragging'); + this.trigger('dragged'); + }; + + /** + * Gets absolute position of the closest item for a coordinate. + * @todo Setting `freeDrag` makes `closest` not reusable. See #165. + * @protected + * @param {Number} coordinate - The coordinate in pixel. + * @param {String} direction - The direction to check for the closest item. Ether `left` or `right`. + * @return {Number} - The absolute position of the closest item. + */ + Owl.prototype.closest = function(coordinate, direction) { + var position = -1, + pull = 30, + width = this.width(), + coordinates = this.coordinates(); + + if (!this.settings.freeDrag) { + // check closest item + $.each(coordinates, $.proxy(function(index, value) { + // on a left pull, check on current index + if (direction === 'left' && coordinate > value - pull && coordinate < value + pull) { + position = index; + // on a right pull, check on previous index + // to do so, subtract width from value and set position = index + 1 + } else if (direction === 'right' && coordinate > value - width - pull && coordinate < value - width + pull) { + position = index + 1; + } else if (this.op(coordinate, '<', value) + && this.op(coordinate, '>', coordinates[index + 1] !== undefined ? coordinates[index + 1] : value - width)) { + position = direction === 'left' ? index + 1 : index; + } + return position === -1; + }, this)); + } + + if (!this.settings.loop) { + // non loop boundries + if (this.op(coordinate, '>', coordinates[this.minimum()])) { + position = coordinate = this.minimum(); + } else if (this.op(coordinate, '<', coordinates[this.maximum()])) { + position = coordinate = this.maximum(); + } + } + + return position; + }; + + /** + * Animates the stage. + * @todo #270 + * @public + * @param {Number} coordinate - The coordinate in pixels. + */ + Owl.prototype.animate = function(coordinate) { + var animate = this.speed() > 0; + + this.is('animating') && this.onTransitionEnd(); + + if (animate) { + this.enter('animating'); + this.trigger('translate'); + } + + if ($.support.transform3d && $.support.transition) { + this.$stage.css({ + transform: 'translate3d(' + coordinate + 'px,0px,0px)', + transition: (this.speed() / 1000) + 's' + ( + this.settings.slideTransition ? ' ' + this.settings.slideTransition : '' + ) + }); + } else if (animate) { + this.$stage.animate({ + left: coordinate + 'px' + }, this.speed(), this.settings.fallbackEasing, $.proxy(this.onTransitionEnd, this)); + } else { + this.$stage.css({ + left: coordinate + 'px' + }); + } + }; + + /** + * Checks whether the carousel is in a specific state or not. + * @param {String} state - The state to check. + * @returns {Boolean} - The flag which indicates if the carousel is busy. + */ + Owl.prototype.is = function(state) { + return this._states.current[state] && this._states.current[state] > 0; + }; + + /** + * Sets the absolute position of the current item. + * @public + * @param {Number} [position] - The new absolute position or nothing to leave it unchanged. + * @returns {Number} - The absolute position of the current item. + */ + Owl.prototype.current = function(position) { + if (position === undefined) { + return this._current; + } + + if (this._items.length === 0) { + return undefined; + } + + position = this.normalize(position); + + if (this._current !== position) { + var event = this.trigger('change', { property: { name: 'position', value: position } }); + + if (event.data !== undefined) { + position = this.normalize(event.data); + } + + this._current = position; + + this.invalidate('position'); + + this.trigger('changed', { property: { name: 'position', value: this._current } }); + } + + return this._current; + }; + + /** + * Invalidates the given part of the update routine. + * @param {String} [part] - The part to invalidate. + * @returns {Array.} - The invalidated parts. + */ + Owl.prototype.invalidate = function(part) { + if ($.type(part) === 'string') { + this._invalidated[part] = true; + this.is('valid') && this.leave('valid'); + } + return $.map(this._invalidated, function(v, i) { return i }); + }; + + /** + * Resets the absolute position of the current item. + * @public + * @param {Number} position - The absolute position of the new item. + */ + Owl.prototype.reset = function(position) { + position = this.normalize(position); + + if (position === undefined) { + return; + } + + this._speed = 0; + this._current = position; + + this.suppress([ 'translate', 'translated' ]); + + this.animate(this.coordinates(position)); + + this.release([ 'translate', 'translated' ]); + }; + + /** + * Normalizes an absolute or a relative position of an item. + * @public + * @param {Number} position - The absolute or relative position to normalize. + * @param {Boolean} [relative=false] - Whether the given position is relative or not. + * @returns {Number} - The normalized position. + */ + Owl.prototype.normalize = function(position, relative) { + var n = this._items.length, + m = relative ? 0 : this._clones.length; + + if (!this.isNumeric(position) || n < 1) { + position = undefined; + } else if (position < 0 || position >= n + m) { + position = ((position - m / 2) % n + n) % n + m / 2; + } + + return position; + }; + + /** + * Converts an absolute position of an item into a relative one. + * @public + * @param {Number} position - The absolute position to convert. + * @returns {Number} - The converted position. + */ + Owl.prototype.relative = function(position) { + position -= this._clones.length / 2; + return this.normalize(position, true); + }; + + /** + * Gets the maximum position for the current item. + * @public + * @param {Boolean} [relative=false] - Whether to return an absolute position or a relative position. + * @returns {Number} + */ + Owl.prototype.maximum = function(relative) { + var settings = this.settings, + maximum = this._coordinates.length, + iterator, + reciprocalItemsWidth, + elementWidth; + + if (settings.loop) { + maximum = this._clones.length / 2 + this._items.length - 1; + } else if (settings.autoWidth || settings.merge) { + iterator = this._items.length; + if (iterator) { + reciprocalItemsWidth = this._items[--iterator].width(); + elementWidth = this.$element.width(); + while (iterator--) { + reciprocalItemsWidth += this._items[iterator].width() + this.settings.margin; + if (reciprocalItemsWidth > elementWidth) { + break; + } + } + } + maximum = iterator + 1; + } else if (settings.center) { + maximum = this._items.length - 1; + } else { + maximum = this._items.length - settings.items; + } + + if (relative) { + maximum -= this._clones.length / 2; + } + + return Math.max(maximum, 0); + }; + + /** + * Gets the minimum position for the current item. + * @public + * @param {Boolean} [relative=false] - Whether to return an absolute position or a relative position. + * @returns {Number} + */ + Owl.prototype.minimum = function(relative) { + return relative ? 0 : this._clones.length / 2; + }; + + /** + * Gets an item at the specified relative position. + * @public + * @param {Number} [position] - The relative position of the item. + * @return {jQuery|Array.} - The item at the given position or all items if no position was given. + */ + Owl.prototype.items = function(position) { + if (position === undefined) { + return this._items.slice(); + } + + position = this.normalize(position, true); + return this._items[position]; + }; + + /** + * Gets an item at the specified relative position. + * @public + * @param {Number} [position] - The relative position of the item. + * @return {jQuery|Array.} - The item at the given position or all items if no position was given. + */ + Owl.prototype.mergers = function(position) { + if (position === undefined) { + return this._mergers.slice(); + } + + position = this.normalize(position, true); + return this._mergers[position]; + }; + + /** + * Gets the absolute positions of clones for an item. + * @public + * @param {Number} [position] - The relative position of the item. + * @returns {Array.} - The absolute positions of clones for the item or all if no position was given. + */ + Owl.prototype.clones = function(position) { + var odd = this._clones.length / 2, + even = odd + this._items.length, + map = function(index) { return index % 2 === 0 ? even + index / 2 : odd - (index + 1) / 2 }; + + if (position === undefined) { + return $.map(this._clones, function(v, i) { return map(i) }); + } + + return $.map(this._clones, function(v, i) { return v === position ? map(i) : null }); + }; + + /** + * Sets the current animation speed. + * @public + * @param {Number} [speed] - The animation speed in milliseconds or nothing to leave it unchanged. + * @returns {Number} - The current animation speed in milliseconds. + */ + Owl.prototype.speed = function(speed) { + if (speed !== undefined) { + this._speed = speed; + } + + return this._speed; + }; + + /** + * Gets the coordinate of an item. + * @todo The name of this method is missleanding. + * @public + * @param {Number} position - The absolute position of the item within `minimum()` and `maximum()`. + * @returns {Number|Array.} - The coordinate of the item in pixel or all coordinates. + */ + Owl.prototype.coordinates = function(position) { + var multiplier = 1, + newPosition = position - 1, + coordinate; + + if (position === undefined) { + return $.map(this._coordinates, $.proxy(function(coordinate, index) { + return this.coordinates(index); + }, this)); + } + + if (this.settings.center) { + if (this.settings.rtl) { + multiplier = -1; + newPosition = position + 1; + } + + coordinate = this._coordinates[position]; + coordinate += (this.width() - coordinate + (this._coordinates[newPosition] || 0)) / 2 * multiplier; + } else { + coordinate = this._coordinates[newPosition] || 0; + } + + coordinate = Math.ceil(coordinate); + + return coordinate; + }; + + /** + * Calculates the speed for a translation. + * @protected + * @param {Number} from - The absolute position of the start item. + * @param {Number} to - The absolute position of the target item. + * @param {Number} [factor=undefined] - The time factor in milliseconds. + * @returns {Number} - The time in milliseconds for the translation. + */ + Owl.prototype.duration = function(from, to, factor) { + if (factor === 0) { + return 0; + } + + return Math.min(Math.max(Math.abs(to - from), 1), 6) * Math.abs((factor || this.settings.smartSpeed)); + }; + + /** + * Slides to the specified item. + * @public + * @param {Number} position - The position of the item. + * @param {Number} [speed] - The time in milliseconds for the transition. + */ + Owl.prototype.to = function(position, speed) { + var current = this.current(), + revert = null, + distance = position - this.relative(current), + direction = (distance > 0) - (distance < 0), + items = this._items.length, + minimum = this.minimum(), + maximum = this.maximum(); + + if (this.settings.loop) { + if (!this.settings.rewind && Math.abs(distance) > items / 2) { + distance += direction * -1 * items; + } + + position = current + distance; + revert = ((position - minimum) % items + items) % items + minimum; + + if (revert !== position && revert - distance <= maximum && revert - distance > 0) { + current = revert - distance; + position = revert; + this.reset(current); + } + } else if (this.settings.rewind) { + maximum += 1; + position = (position % maximum + maximum) % maximum; + } else { + position = Math.max(minimum, Math.min(maximum, position)); + } + + this.speed(this.duration(current, position, speed)); + this.current(position); + + if (this.isVisible()) { + this.update(); + } + }; + + /** + * Slides to the next item. + * @public + * @param {Number} [speed] - The time in milliseconds for the transition. + */ + Owl.prototype.next = function(speed) { + speed = speed || false; + this.to(this.relative(this.current()) + 1, speed); + }; + + /** + * Slides to the previous item. + * @public + * @param {Number} [speed] - The time in milliseconds for the transition. + */ + Owl.prototype.prev = function(speed) { + speed = speed || false; + this.to(this.relative(this.current()) - 1, speed); + }; + + /** + * Handles the end of an animation. + * @protected + * @param {Event} event - The event arguments. + */ + Owl.prototype.onTransitionEnd = function(event) { + + // if css2 animation then event object is undefined + if (event !== undefined) { + event.stopPropagation(); + + // Catch only owl-stage transitionEnd event + if ((event.target || event.srcElement || event.originalTarget) !== this.$stage.get(0)) { + return false; + } + } + + this.leave('animating'); + this.trigger('translated'); + }; + + /** + * Gets viewport width. + * @protected + * @return {Number} - The width in pixel. + */ + Owl.prototype.viewport = function() { + var width; + if (this.options.responsiveBaseElement !== window) { + width = $(this.options.responsiveBaseElement).width(); + } else if (window.innerWidth) { + width = window.innerWidth; + } else if (document.documentElement && document.documentElement.clientWidth) { + width = document.documentElement.clientWidth; + } else { + console.warn('Can not detect viewport width.'); + } + return width; + }; + + /** + * Replaces the current content. + * @public + * @param {HTMLElement|jQuery|String} content - The new content. + */ + Owl.prototype.replace = function(content) { + this.$stage.empty(); + this._items = []; + + if (content) { + content = (content instanceof jQuery) ? content : $(content); + } + + if (this.settings.nestedItemSelector) { + content = content.find('.' + this.settings.nestedItemSelector); + } + + content.filter(function() { + return this.nodeType === 1; + }).each($.proxy(function(index, item) { + item = this.prepare(item); + this.$stage.append(item); + this._items.push(item); + this._mergers.push(item.find('[data-merge]').addBack('[data-merge]').attr('data-merge') * 1 || 1); + }, this)); + + this.reset(this.isNumeric(this.settings.startPosition) ? this.settings.startPosition : 0); + + this.invalidate('items'); + }; + + /** + * Adds an item. + * @todo Use `item` instead of `content` for the event arguments. + * @public + * @param {HTMLElement|jQuery|String} content - The item content to add. + * @param {Number} [position] - The relative position at which to insert the item otherwise the item will be added to the end. + */ + Owl.prototype.add = function(content, position) { + var current = this.relative(this._current); + + position = position === undefined ? this._items.length : this.normalize(position, true); + content = content instanceof jQuery ? content : $(content); + + this.trigger('add', { content: content, position: position }); + + content = this.prepare(content); + + if (this._items.length === 0 || position === this._items.length) { + this._items.length === 0 && this.$stage.append(content); + this._items.length !== 0 && this._items[position - 1].after(content); + this._items.push(content); + this._mergers.push(content.find('[data-merge]').addBack('[data-merge]').attr('data-merge') * 1 || 1); + } else { + this._items[position].before(content); + this._items.splice(position, 0, content); + this._mergers.splice(position, 0, content.find('[data-merge]').addBack('[data-merge]').attr('data-merge') * 1 || 1); + } + + this._items[current] && this.reset(this._items[current].index()); + + this.invalidate('items'); + + this.trigger('added', { content: content, position: position }); + }; + + /** + * Removes an item by its position. + * @todo Use `item` instead of `content` for the event arguments. + * @public + * @param {Number} position - The relative position of the item to remove. + */ + Owl.prototype.remove = function(position) { + position = this.normalize(position, true); + + if (position === undefined) { + return; + } + + this.trigger('remove', { content: this._items[position], position: position }); + + this._items[position].remove(); + this._items.splice(position, 1); + this._mergers.splice(position, 1); + + this.invalidate('items'); + + this.trigger('removed', { content: null, position: position }); + }; + + /** + * Preloads images with auto width. + * @todo Replace by a more generic approach + * @protected + */ + Owl.prototype.preloadAutoWidthImages = function(images) { + images.each($.proxy(function(i, element) { + this.enter('pre-loading'); + element = $(element); + $(new Image()).one('load', $.proxy(function(e) { + element.attr('src', e.target.src); + element.css('opacity', 1); + this.leave('pre-loading'); + !this.is('pre-loading') && !this.is('initializing') && this.refresh(); + }, this)).attr('src', element.attr('src') || element.attr('data-src') || element.attr('data-src-retina')); + }, this)); + }; + + /** + * Destroys the carousel. + * @public + */ + Owl.prototype.destroy = function() { + + this.$element.off('.owl.core'); + this.$stage.off('.owl.core'); + $(document).off('.owl.core'); + + if (this.settings.responsive !== false) { + window.clearTimeout(this.resizeTimer); + this.off(window, 'resize', this._handlers.onThrottledResize); + } + + for (var i in this._plugins) { + this._plugins[i].destroy(); + } + + this.$stage.children('.cloned').remove(); + + this.$stage.unwrap(); + this.$stage.children().contents().unwrap(); + this.$stage.children().unwrap(); + this.$stage.remove(); + this.$element + .removeClass(this.options.refreshClass) + .removeClass(this.options.loadingClass) + .removeClass(this.options.loadedClass) + .removeClass(this.options.rtlClass) + .removeClass(this.options.dragClass) + .removeClass(this.options.grabClass) + .attr('class', this.$element.attr('class').replace(new RegExp(this.options.responsiveClass + '-\\S+\\s', 'g'), '')) + .removeData('owl.carousel'); + }; + + /** + * Operators to calculate right-to-left and left-to-right. + * @protected + * @param {Number} [a] - The left side operand. + * @param {String} [o] - The operator. + * @param {Number} [b] - The right side operand. + */ + Owl.prototype.op = function(a, o, b) { + var rtl = this.settings.rtl; + switch (o) { + case '<': + return rtl ? a > b : a < b; + case '>': + return rtl ? a < b : a > b; + case '>=': + return rtl ? a <= b : a >= b; + case '<=': + return rtl ? a >= b : a <= b; + default: + break; + } + }; + + /** + * Attaches to an internal event. + * @protected + * @param {HTMLElement} element - The event source. + * @param {String} event - The event name. + * @param {Function} listener - The event handler to attach. + * @param {Boolean} capture - Wether the event should be handled at the capturing phase or not. + */ + Owl.prototype.on = function(element, event, listener, capture) { + if (element.addEventListener) { + element.addEventListener(event, listener, capture); + } else if (element.attachEvent) { + element.attachEvent('on' + event, listener); + } + }; + + /** + * Detaches from an internal event. + * @protected + * @param {HTMLElement} element - The event source. + * @param {String} event - The event name. + * @param {Function} listener - The attached event handler to detach. + * @param {Boolean} capture - Wether the attached event handler was registered as a capturing listener or not. + */ + Owl.prototype.off = function(element, event, listener, capture) { + if (element.removeEventListener) { + element.removeEventListener(event, listener, capture); + } else if (element.detachEvent) { + element.detachEvent('on' + event, listener); + } + }; + + /** + * Triggers a public event. + * @todo Remove `status`, `relatedTarget` should be used instead. + * @protected + * @param {String} name - The event name. + * @param {*} [data=null] - The event data. + * @param {String} [namespace=carousel] - The event namespace. + * @param {String} [state] - The state which is associated with the event. + * @param {Boolean} [enter=false] - Indicates if the call enters the specified state or not. + * @returns {Event} - The event arguments. + */ + Owl.prototype.trigger = function(name, data, namespace, state, enter) { + var status = { + item: { count: this._items.length, index: this.current() } + }, handler = $.camelCase( + $.grep([ 'on', name, namespace ], function(v) { return v }) + .join('-').toLowerCase() + ), event = $.Event( + [ name, 'owl', namespace || 'carousel' ].join('.').toLowerCase(), + $.extend({ relatedTarget: this }, status, data) + ); + + if (!this._supress[name]) { + $.each(this._plugins, function(name, plugin) { + if (plugin.onTrigger) { + plugin.onTrigger(event); + } + }); + + this.register({ type: Owl.Type.Event, name: name }); + this.$element.trigger(event); + + if (this.settings && typeof this.settings[handler] === 'function') { + this.settings[handler].call(this, event); + } + } + + return event; + }; + + /** + * Enters a state. + * @param name - The state name. + */ + Owl.prototype.enter = function(name) { + $.each([ name ].concat(this._states.tags[name] || []), $.proxy(function(i, name) { + if (this._states.current[name] === undefined) { + this._states.current[name] = 0; + } + + this._states.current[name]++; + }, this)); + }; + + /** + * Leaves a state. + * @param name - The state name. + */ + Owl.prototype.leave = function(name) { + $.each([ name ].concat(this._states.tags[name] || []), $.proxy(function(i, name) { + this._states.current[name]--; + }, this)); + }; + + /** + * Registers an event or state. + * @public + * @param {Object} object - The event or state to register. + */ + Owl.prototype.register = function(object) { + if (object.type === Owl.Type.Event) { + if (!$.event.special[object.name]) { + $.event.special[object.name] = {}; + } + + if (!$.event.special[object.name].owl) { + var _default = $.event.special[object.name]._default; + $.event.special[object.name]._default = function(e) { + if (_default && _default.apply && (!e.namespace || e.namespace.indexOf('owl') === -1)) { + return _default.apply(this, arguments); + } + return e.namespace && e.namespace.indexOf('owl') > -1; + }; + $.event.special[object.name].owl = true; + } + } else if (object.type === Owl.Type.State) { + if (!this._states.tags[object.name]) { + this._states.tags[object.name] = object.tags; + } else { + this._states.tags[object.name] = this._states.tags[object.name].concat(object.tags); + } + + this._states.tags[object.name] = $.grep(this._states.tags[object.name], $.proxy(function(tag, i) { + return $.inArray(tag, this._states.tags[object.name]) === i; + }, this)); + } + }; + + /** + * Suppresses events. + * @protected + * @param {Array.} events - The events to suppress. + */ + Owl.prototype.suppress = function(events) { + $.each(events, $.proxy(function(index, event) { + this._supress[event] = true; + }, this)); + }; + + /** + * Releases suppressed events. + * @protected + * @param {Array.} events - The events to release. + */ + Owl.prototype.release = function(events) { + $.each(events, $.proxy(function(index, event) { + delete this._supress[event]; + }, this)); + }; + + /** + * Gets unified pointer coordinates from event. + * @todo #261 + * @protected + * @param {Event} - The `mousedown` or `touchstart` event. + * @returns {Object} - Contains `x` and `y` coordinates of current pointer position. + */ + Owl.prototype.pointer = function(event) { + var result = { x: null, y: null }; + + event = event.originalEvent || event || window.event; + + event = event.touches && event.touches.length ? + event.touches[0] : event.changedTouches && event.changedTouches.length ? + event.changedTouches[0] : event; + + if (event.pageX) { + result.x = event.pageX; + result.y = event.pageY; + } else { + result.x = event.clientX; + result.y = event.clientY; + } + + return result; + }; + + /** + * Determines if the input is a Number or something that can be coerced to a Number + * @protected + * @param {Number|String|Object|Array|Boolean|RegExp|Function|Symbol} - The input to be tested + * @returns {Boolean} - An indication if the input is a Number or can be coerced to a Number + */ + Owl.prototype.isNumeric = function(number) { + return !isNaN(parseFloat(number)); + }; + + /** + * Gets the difference of two vectors. + * @todo #261 + * @protected + * @param {Object} - The first vector. + * @param {Object} - The second vector. + * @returns {Object} - The difference. + */ + Owl.prototype.difference = function(first, second) { + return { + x: first.x - second.x, + y: first.y - second.y + }; + }; + + /** + * The jQuery Plugin for the Owl Carousel + * @todo Navigation plugin `next` and `prev` + * @public + */ + $.fn.owlCarousel = function(option) { + var args = Array.prototype.slice.call(arguments, 1); + + return this.each(function() { + var $this = $(this), + data = $this.data('owl.carousel'); + + if (!data) { + data = new Owl(this, typeof option == 'object' && option); + $this.data('owl.carousel', data); + + $.each([ + 'next', 'prev', 'to', 'destroy', 'refresh', 'replace', 'add', 'remove' + ], function(i, event) { + data.register({ type: Owl.Type.Event, name: event }); + data.$element.on(event + '.owl.carousel.core', $.proxy(function(e) { + if (e.namespace && e.relatedTarget !== this) { + this.suppress([ event ]); + data[event].apply(this, [].slice.call(arguments, 1)); + this.release([ event ]); + } + }, data)); + }); + } + + if (typeof option == 'string' && option.charAt(0) !== '_') { + data[option].apply(data, args); + } + }); + }; + + /** + * The constructor for the jQuery Plugin + * @public + */ + $.fn.owlCarousel.Constructor = Owl; + +})(window.Zepto || window.jQuery, window, document); + +/** + * AutoRefresh Plugin + * @version 2.3.4 + * @author Artus Kolanowski + * @author David Deutsch + * @license The MIT License (MIT) + */ +;(function($, window, document, undefined) { + + /** + * Creates the auto refresh plugin. + * @class The Auto Refresh Plugin + * @param {Owl} carousel - The Owl Carousel + */ + var AutoRefresh = function(carousel) { + /** + * Reference to the core. + * @protected + * @type {Owl} + */ + this._core = carousel; + + /** + * Refresh interval. + * @protected + * @type {number} + */ + this._interval = null; + + /** + * Whether the element is currently visible or not. + * @protected + * @type {Boolean} + */ + this._visible = null; + + /** + * All event handlers. + * @protected + * @type {Object} + */ + this._handlers = { + 'initialized.owl.carousel': $.proxy(function(e) { + if (e.namespace && this._core.settings.autoRefresh) { + this.watch(); + } + }, this) + }; + + // set default options + this._core.options = $.extend({}, AutoRefresh.Defaults, this._core.options); + + // register event handlers + this._core.$element.on(this._handlers); + }; + + /** + * Default options. + * @public + */ + AutoRefresh.Defaults = { + autoRefresh: true, + autoRefreshInterval: 500 + }; + + /** + * Watches the element. + */ + AutoRefresh.prototype.watch = function() { + if (this._interval) { + return; + } + + this._visible = this._core.isVisible(); + this._interval = window.setInterval($.proxy(this.refresh, this), this._core.settings.autoRefreshInterval); + }; + + /** + * Refreshes the element. + */ + AutoRefresh.prototype.refresh = function() { + if (this._core.isVisible() === this._visible) { + return; + } + + this._visible = !this._visible; + + this._core.$element.toggleClass('owl-hidden', !this._visible); + + this._visible && (this._core.invalidate('width') && this._core.refresh()); + }; + + /** + * Destroys the plugin. + */ + AutoRefresh.prototype.destroy = function() { + var handler, property; + + window.clearInterval(this._interval); + + for (handler in this._handlers) { + this._core.$element.off(handler, this._handlers[handler]); + } + for (property in Object.getOwnPropertyNames(this)) { + typeof this[property] != 'function' && (this[property] = null); + } + }; + + $.fn.owlCarousel.Constructor.Plugins.AutoRefresh = AutoRefresh; + +})(window.Zepto || window.jQuery, window, document); + +/** + * Lazy Plugin + * @version 2.3.4 + * @author Bartosz Wojciechowski + * @author David Deutsch + * @license The MIT License (MIT) + */ +;(function($, window, document, undefined) { + + /** + * Creates the lazy plugin. + * @class The Lazy Plugin + * @param {Owl} carousel - The Owl Carousel + */ + var Lazy = function(carousel) { + + /** + * Reference to the core. + * @protected + * @type {Owl} + */ + this._core = carousel; + + /** + * Already loaded items. + * @protected + * @type {Array.} + */ + this._loaded = []; + + /** + * Event handlers. + * @protected + * @type {Object} + */ + this._handlers = { + 'initialized.owl.carousel change.owl.carousel resized.owl.carousel': $.proxy(function(e) { + if (!e.namespace) { + return; + } + + if (!this._core.settings || !this._core.settings.lazyLoad) { + return; + } + + if ((e.property && e.property.name == 'position') || e.type == 'initialized') { + var settings = this._core.settings, + n = (settings.center && Math.ceil(settings.items / 2) || settings.items), + i = ((settings.center && n * -1) || 0), + position = (e.property && e.property.value !== undefined ? e.property.value : this._core.current()) + i, + clones = this._core.clones().length, + load = $.proxy(function(i, v) { this.load(v) }, this); + //TODO: Need documentation for this new option + if (settings.lazyLoadEager > 0) { + n += settings.lazyLoadEager; + // If the carousel is looping also preload images that are to the "left" + if (settings.loop) { + position -= settings.lazyLoadEager; + n++; + } + } + + while (i++ < n) { + this.load(clones / 2 + this._core.relative(position)); + clones && $.each(this._core.clones(this._core.relative(position)), load); + position++; + } + } + }, this) + }; + + // set the default options + this._core.options = $.extend({}, Lazy.Defaults, this._core.options); + + // register event handler + this._core.$element.on(this._handlers); + }; + + /** + * Default options. + * @public + */ + Lazy.Defaults = { + lazyLoad: false, + lazyLoadEager: 0 + }; + + /** + * Loads all resources of an item at the specified position. + * @param {Number} position - The absolute position of the item. + * @protected + */ + Lazy.prototype.load = function(position) { + var $item = this._core.$stage.children().eq(position), + $elements = $item && $item.find('.owl-lazy'); + + if (!$elements || $.inArray($item.get(0), this._loaded) > -1) { + return; + } + + $elements.each($.proxy(function(index, element) { + var $element = $(element), image, + url = (window.devicePixelRatio > 1 && $element.attr('data-src-retina')) || $element.attr('data-src') || $element.attr('data-srcset'); + + this._core.trigger('load', { element: $element, url: url }, 'lazy'); + + if ($element.is('img')) { + $element.one('load.owl.lazy', $.proxy(function() { + $element.css('opacity', 1); + this._core.trigger('loaded', { element: $element, url: url }, 'lazy'); + }, this)).attr('src', url); + } else if ($element.is('source')) { + $element.one('load.owl.lazy', $.proxy(function() { + this._core.trigger('loaded', { element: $element, url: url }, 'lazy'); + }, this)).attr('srcset', url); + } else { + image = new Image(); + image.onload = $.proxy(function() { + $element.css({ + 'background-image': 'url("' + url + '")', + 'opacity': '1' + }); + this._core.trigger('loaded', { element: $element, url: url }, 'lazy'); + }, this); + image.src = url; + } + }, this)); + + this._loaded.push($item.get(0)); + }; + + /** + * Destroys the plugin. + * @public + */ + Lazy.prototype.destroy = function() { + var handler, property; + + for (handler in this.handlers) { + this._core.$element.off(handler, this.handlers[handler]); + } + for (property in Object.getOwnPropertyNames(this)) { + typeof this[property] != 'function' && (this[property] = null); + } + }; + + $.fn.owlCarousel.Constructor.Plugins.Lazy = Lazy; + +})(window.Zepto || window.jQuery, window, document); + +/** + * AutoHeight Plugin + * @version 2.3.4 + * @author Bartosz Wojciechowski + * @author David Deutsch + * @license The MIT License (MIT) + */ +;(function($, window, document, undefined) { + + /** + * Creates the auto height plugin. + * @class The Auto Height Plugin + * @param {Owl} carousel - The Owl Carousel + */ + var AutoHeight = function(carousel) { + /** + * Reference to the core. + * @protected + * @type {Owl} + */ + this._core = carousel; + + this._previousHeight = null; + + /** + * All event handlers. + * @protected + * @type {Object} + */ + this._handlers = { + 'initialized.owl.carousel refreshed.owl.carousel': $.proxy(function(e) { + if (e.namespace && this._core.settings.autoHeight) { + this.update(); + } + }, this), + 'changed.owl.carousel': $.proxy(function(e) { + if (e.namespace && this._core.settings.autoHeight && e.property.name === 'position'){ + this.update(); + } + }, this), + 'loaded.owl.lazy': $.proxy(function(e) { + if (e.namespace && this._core.settings.autoHeight + && e.element.closest('.' + this._core.settings.itemClass).index() === this._core.current()) { + this.update(); + } + }, this) + }; + + // set default options + this._core.options = $.extend({}, AutoHeight.Defaults, this._core.options); + + // register event handlers + this._core.$element.on(this._handlers); + this._intervalId = null; + var refThis = this; + + // These changes have been taken from a PR by gavrochelegnou proposed in #1575 + // and have been made compatible with the latest jQuery version + $(window).on('load', function() { + if (refThis._core.settings.autoHeight) { + refThis.update(); + } + }); + + // Autoresize the height of the carousel when window is resized + // When carousel has images, the height is dependent on the width + // and should also change on resize + $(window).resize(function() { + if (refThis._core.settings.autoHeight) { + if (refThis._intervalId != null) { + clearTimeout(refThis._intervalId); + } + + refThis._intervalId = setTimeout(function() { + refThis.update(); + }, 250); + } + }); + + }; + + /** + * Default options. + * @public + */ + AutoHeight.Defaults = { + autoHeight: false, + autoHeightClass: 'owl-height' + }; + + /** + * Updates the view. + */ + AutoHeight.prototype.update = function() { + var start = this._core._current, + end = start + this._core.settings.items, + lazyLoadEnabled = this._core.settings.lazyLoad, + visible = this._core.$stage.children().toArray().slice(start, end), + heights = [], + maxheight = 0; + + $.each(visible, function(index, item) { + heights.push($(item).height()); + }); + + maxheight = Math.max.apply(null, heights); + + if (maxheight <= 1 && lazyLoadEnabled && this._previousHeight) { + maxheight = this._previousHeight; + } + + this._previousHeight = maxheight; + + this._core.$stage.parent() + .height(maxheight) + .addClass(this._core.settings.autoHeightClass); + }; + + AutoHeight.prototype.destroy = function() { + var handler, property; + + for (handler in this._handlers) { + this._core.$element.off(handler, this._handlers[handler]); + } + for (property in Object.getOwnPropertyNames(this)) { + typeof this[property] !== 'function' && (this[property] = null); + } + }; + + $.fn.owlCarousel.Constructor.Plugins.AutoHeight = AutoHeight; + +})(window.Zepto || window.jQuery, window, document); + +/** + * Video Plugin + * @version 2.3.4 + * @author Bartosz Wojciechowski + * @author David Deutsch + * @license The MIT License (MIT) + */ +;(function($, window, document, undefined) { + + /** + * Creates the video plugin. + * @class The Video Plugin + * @param {Owl} carousel - The Owl Carousel + */ + var Video = function(carousel) { + /** + * Reference to the core. + * @protected + * @type {Owl} + */ + this._core = carousel; + + /** + * Cache all video URLs. + * @protected + * @type {Object} + */ + this._videos = {}; + + /** + * Current playing item. + * @protected + * @type {jQuery} + */ + this._playing = null; + + /** + * All event handlers. + * @todo The cloned content removale is too late + * @protected + * @type {Object} + */ + this._handlers = { + 'initialized.owl.carousel': $.proxy(function(e) { + if (e.namespace) { + this._core.register({ type: 'state', name: 'playing', tags: [ 'interacting' ] }); + } + }, this), + 'resize.owl.carousel': $.proxy(function(e) { + if (e.namespace && this._core.settings.video && this.isInFullScreen()) { + e.preventDefault(); + } + }, this), + 'refreshed.owl.carousel': $.proxy(function(e) { + if (e.namespace && this._core.is('resizing')) { + this._core.$stage.find('.cloned .owl-video-frame').remove(); + } + }, this), + 'changed.owl.carousel': $.proxy(function(e) { + if (e.namespace && e.property.name === 'position' && this._playing) { + this.stop(); + } + }, this), + 'prepared.owl.carousel': $.proxy(function(e) { + if (!e.namespace) { + return; + } + + var $element = $(e.content).find('.owl-video'); + + if ($element.length) { + $element.css('display', 'none'); + this.fetch($element, $(e.content)); + } + }, this) + }; + + // set default options + this._core.options = $.extend({}, Video.Defaults, this._core.options); + + // register event handlers + this._core.$element.on(this._handlers); + + this._core.$element.on('click.owl.video', '.owl-video-play-icon', $.proxy(function(e) { + this.play(e); + }, this)); + }; + + /** + * Default options. + * @public + */ + Video.Defaults = { + video: false, + videoHeight: false, + videoWidth: false + }; + + /** + * Gets the video ID and the type (YouTube/Vimeo/vzaar only). + * @protected + * @param {jQuery} target - The target containing the video data. + * @param {jQuery} item - The item containing the video. + */ + Video.prototype.fetch = function(target, item) { + var type = (function() { + if (target.attr('data-vimeo-id')) { + return 'vimeo'; + } else if (target.attr('data-vzaar-id')) { + return 'vzaar' + } else { + return 'youtube'; + } + })(), + id = target.attr('data-vimeo-id') || target.attr('data-youtube-id') || target.attr('data-vzaar-id'), + width = target.attr('data-width') || this._core.settings.videoWidth, + height = target.attr('data-height') || this._core.settings.videoHeight, + url = target.attr('href'); + + if (url) { + + /* + Parses the id's out of the following urls (and probably more): + https://www.youtube.com/watch?v=:id + https://youtu.be/:id + https://vimeo.com/:id + https://vimeo.com/channels/:channel/:id + https://vimeo.com/groups/:group/videos/:id + https://app.vzaar.com/videos/:id + + Visual example: https://regexper.com/#(http%3A%7Chttps%3A%7C)%5C%2F%5C%2F(player.%7Cwww.%7Capp.)%3F(vimeo%5C.com%7Cyoutu(be%5C.com%7C%5C.be%7Cbe%5C.googleapis%5C.com)%7Cvzaar%5C.com)%5C%2F(video%5C%2F%7Cvideos%5C%2F%7Cembed%5C%2F%7Cchannels%5C%2F.%2B%5C%2F%7Cgroups%5C%2F.%2B%5C%2F%7Cwatch%5C%3Fv%3D%7Cv%5C%2F)%3F(%5BA-Za-z0-9._%25-%5D*)(%5C%26%5CS%2B)%3F + */ + + id = url.match(/(http:|https:|)\/\/(player.|www.|app.)?(vimeo\.com|youtu(be\.com|\.be|be\.googleapis\.com|be\-nocookie\.com)|vzaar\.com)\/(video\/|videos\/|embed\/|channels\/.+\/|groups\/.+\/|watch\?v=|v\/)?([A-Za-z0-9._%-]*)(\&\S+)?/); + + if (id[3].indexOf('youtu') > -1) { + type = 'youtube'; + } else if (id[3].indexOf('vimeo') > -1) { + type = 'vimeo'; + } else if (id[3].indexOf('vzaar') > -1) { + type = 'vzaar'; + } else { + throw new Error('Video URL not supported.'); + } + id = id[6]; + } else { + throw new Error('Missing video URL.'); + } + + this._videos[url] = { + type: type, + id: id, + width: width, + height: height + }; + + item.attr('data-video', url); + + this.thumbnail(target, this._videos[url]); + }; + + /** + * Creates video thumbnail. + * @protected + * @param {jQuery} target - The target containing the video data. + * @param {Object} info - The video info object. + * @see `fetch` + */ + Video.prototype.thumbnail = function(target, video) { + var tnLink, + icon, + path, + dimensions = video.width && video.height ? 'width:' + video.width + 'px;height:' + video.height + 'px;' : '', + customTn = target.find('img'), + srcType = 'src', + lazyClass = '', + settings = this._core.settings, + create = function(path) { + icon = '
'; + + if (settings.lazyLoad) { + tnLink = $('
',{ + "class": 'owl-video-tn ' + lazyClass, + "srcType": path + }); + } else { + tnLink = $( '
', { + "class": "owl-video-tn", + "style": 'opacity:1;background-image:url(' + path + ')' + }); + } + target.after(tnLink); + target.after(icon); + }; + + // wrap video content into owl-video-wrapper div + target.wrap( $( '
', { + "class": "owl-video-wrapper", + "style": dimensions + })); + + if (this._core.settings.lazyLoad) { + srcType = 'data-src'; + lazyClass = 'owl-lazy'; + } + + // custom thumbnail + if (customTn.length) { + create(customTn.attr(srcType)); + customTn.remove(); + return false; + } + + if (video.type === 'youtube') { + path = "//img.youtube.com/vi/" + video.id + "/hqdefault.jpg"; + create(path); + } else if (video.type === 'vimeo') { + $.ajax({ + type: 'GET', + url: '//vimeo.com/api/v2/video/' + video.id + '.json', + jsonp: 'callback', + dataType: 'jsonp', + success: function(data) { + path = data[0].thumbnail_large; + create(path); + } + }); + } else if (video.type === 'vzaar') { + $.ajax({ + type: 'GET', + url: '//vzaar.com/api/videos/' + video.id + '.json', + jsonp: 'callback', + dataType: 'jsonp', + success: function(data) { + path = data.framegrab_url; + create(path); + } + }); + } + }; + + /** + * Stops the current video. + * @public + */ + Video.prototype.stop = function() { + this._core.trigger('stop', null, 'video'); + this._playing.find('.owl-video-frame').remove(); + this._playing.removeClass('owl-video-playing'); + this._playing = null; + this._core.leave('playing'); + this._core.trigger('stopped', null, 'video'); + }; + + /** + * Starts the current video. + * @public + * @param {Event} event - The event arguments. + */ + Video.prototype.play = function(event) { + var target = $(event.target), + item = target.closest('.' + this._core.settings.itemClass), + video = this._videos[item.attr('data-video')], + width = video.width || '100%', + height = video.height || this._core.$stage.height(), + html, + iframe; + + if (this._playing) { + return; + } + + this._core.enter('playing'); + this._core.trigger('play', null, 'video'); + + item = this._core.items(this._core.relative(item.index())); + + this._core.reset(item.index()); + + html = $( '' ); + html.attr( 'height', height ); + html.attr( 'width', width ); + if (video.type === 'youtube') { + html.attr( 'src', '//www.youtube.com/embed/' + video.id + '?autoplay=1&rel=0&v=' + video.id ); + } else if (video.type === 'vimeo') { + html.attr( 'src', '//player.vimeo.com/video/' + video.id + '?autoplay=1' ); + } else if (video.type === 'vzaar') { + html.attr( 'src', '//view.vzaar.com/' + video.id + '/player?autoplay=true' ); + } + + iframe = $(html).wrap( '
' ).insertAfter(item.find('.owl-video')); + + this._playing = item.addClass('owl-video-playing'); + }; + + /** + * Checks whether an video is currently in full screen mode or not. + * @todo Bad style because looks like a readonly method but changes members. + * @protected + * @returns {Boolean} + */ + Video.prototype.isInFullScreen = function() { + var element = document.fullscreenElement || document.mozFullScreenElement || + document.webkitFullscreenElement; + + return element && $(element).parent().hasClass('owl-video-frame'); + }; + + /** + * Destroys the plugin. + */ + Video.prototype.destroy = function() { + var handler, property; + + this._core.$element.off('click.owl.video'); + + for (handler in this._handlers) { + this._core.$element.off(handler, this._handlers[handler]); + } + for (property in Object.getOwnPropertyNames(this)) { + typeof this[property] != 'function' && (this[property] = null); + } + }; + + $.fn.owlCarousel.Constructor.Plugins.Video = Video; + +})(window.Zepto || window.jQuery, window, document); + +/** + * Animate Plugin + * @version 2.3.4 + * @author Bartosz Wojciechowski + * @author David Deutsch + * @license The MIT License (MIT) + */ +;(function($, window, document, undefined) { + + /** + * Creates the animate plugin. + * @class The Navigation Plugin + * @param {Owl} scope - The Owl Carousel + */ + var Animate = function(scope) { + this.core = scope; + this.core.options = $.extend({}, Animate.Defaults, this.core.options); + this.swapping = true; + this.previous = undefined; + this.next = undefined; + + this.handlers = { + 'change.owl.carousel': $.proxy(function(e) { + if (e.namespace && e.property.name == 'position') { + this.previous = this.core.current(); + this.next = e.property.value; + } + }, this), + 'drag.owl.carousel dragged.owl.carousel translated.owl.carousel': $.proxy(function(e) { + if (e.namespace) { + this.swapping = e.type == 'translated'; + } + }, this), + 'translate.owl.carousel': $.proxy(function(e) { + if (e.namespace && this.swapping && (this.core.options.animateOut || this.core.options.animateIn)) { + this.swap(); + } + }, this) + }; + + this.core.$element.on(this.handlers); + }; + + /** + * Default options. + * @public + */ + Animate.Defaults = { + animateOut: false, + animateIn: false + }; + + /** + * Toggles the animation classes whenever an translations starts. + * @protected + * @returns {Boolean|undefined} + */ + Animate.prototype.swap = function() { + + if (this.core.settings.items !== 1) { + return; + } + + if (!$.support.animation || !$.support.transition) { + return; + } + + this.core.speed(0); + + var left, + clear = $.proxy(this.clear, this), + previous = this.core.$stage.children().eq(this.previous), + next = this.core.$stage.children().eq(this.next), + incoming = this.core.settings.animateIn, + outgoing = this.core.settings.animateOut; + + if (this.core.current() === this.previous) { + return; + } + + if (outgoing) { + left = this.core.coordinates(this.previous) - this.core.coordinates(this.next); + previous.one($.support.animation.end, clear) + .css( { 'left': left + 'px' } ) + .addClass('animated owl-animated-out') + .addClass(outgoing); + } + + if (incoming) { + next.one($.support.animation.end, clear) + .addClass('animated owl-animated-in') + .addClass(incoming); + } + }; + + Animate.prototype.clear = function(e) { + $(e.target).css( { 'left': '' } ) + .removeClass('animated owl-animated-out owl-animated-in') + .removeClass(this.core.settings.animateIn) + .removeClass(this.core.settings.animateOut); + this.core.onTransitionEnd(); + }; + + /** + * Destroys the plugin. + * @public + */ + Animate.prototype.destroy = function() { + var handler, property; + + for (handler in this.handlers) { + this.core.$element.off(handler, this.handlers[handler]); + } + for (property in Object.getOwnPropertyNames(this)) { + typeof this[property] != 'function' && (this[property] = null); + } + }; + + $.fn.owlCarousel.Constructor.Plugins.Animate = Animate; + +})(window.Zepto || window.jQuery, window, document); + +/** + * Autoplay Plugin + * @version 2.3.4 + * @author Bartosz Wojciechowski + * @author Artus Kolanowski + * @author David Deutsch + * @author Tom De Caluwé + * @license The MIT License (MIT) + */ +;(function($, window, document, undefined) { + + /** + * Creates the autoplay plugin. + * @class The Autoplay Plugin + * @param {Owl} scope - The Owl Carousel + */ + var Autoplay = function(carousel) { + /** + * Reference to the core. + * @protected + * @type {Owl} + */ + this._core = carousel; + + /** + * The autoplay timeout id. + * @type {Number} + */ + this._call = null; + + /** + * Depending on the state of the plugin, this variable contains either + * the start time of the timer or the current timer value if it's + * paused. Since we start in a paused state we initialize the timer + * value. + * @type {Number} + */ + this._time = 0; + + /** + * Stores the timeout currently used. + * @type {Number} + */ + this._timeout = 0; + + /** + * Indicates whenever the autoplay is paused. + * @type {Boolean} + */ + this._paused = true; + + /** + * All event handlers. + * @protected + * @type {Object} + */ + this._handlers = { + 'changed.owl.carousel': $.proxy(function(e) { + if (e.namespace && e.property.name === 'settings') { + if (this._core.settings.autoplay) { + this.play(); + } else { + this.stop(); + } + } else if (e.namespace && e.property.name === 'position' && this._paused) { + // Reset the timer. This code is triggered when the position + // of the carousel was changed through user interaction. + this._time = 0; + } + }, this), + 'initialized.owl.carousel': $.proxy(function(e) { + if (e.namespace && this._core.settings.autoplay) { + this.play(); + } + }, this), + 'play.owl.autoplay': $.proxy(function(e, t, s) { + if (e.namespace) { + this.play(t, s); + } + }, this), + 'stop.owl.autoplay': $.proxy(function(e) { + if (e.namespace) { + this.stop(); + } + }, this), + 'mouseover.owl.autoplay': $.proxy(function() { + if (this._core.settings.autoplayHoverPause && this._core.is('rotating')) { + this.pause(); + } + }, this), + 'mouseleave.owl.autoplay': $.proxy(function() { + if (this._core.settings.autoplayHoverPause && this._core.is('rotating')) { + this.play(); + } + }, this), + 'touchstart.owl.core': $.proxy(function() { + if (this._core.settings.autoplayHoverPause && this._core.is('rotating')) { + this.pause(); + } + }, this), + 'touchend.owl.core': $.proxy(function() { + if (this._core.settings.autoplayHoverPause) { + this.play(); + } + }, this) + }; + + // register event handlers + this._core.$element.on(this._handlers); + + // set default options + this._core.options = $.extend({}, Autoplay.Defaults, this._core.options); + }; + + /** + * Default options. + * @public + */ + Autoplay.Defaults = { + autoplay: false, + autoplayTimeout: 5000, + autoplayHoverPause: false, + autoplaySpeed: false + }; + + /** + * Transition to the next slide and set a timeout for the next transition. + * @private + * @param {Number} [speed] - The animation speed for the animations. + */ + Autoplay.prototype._next = function(speed) { + this._call = window.setTimeout( + $.proxy(this._next, this, speed), + this._timeout * (Math.round(this.read() / this._timeout) + 1) - this.read() + ); + + if (this._core.is('interacting') || document.hidden) { + return; + } + this._core.next(speed || this._core.settings.autoplaySpeed); + } + + /** + * Reads the current timer value when the timer is playing. + * @public + */ + Autoplay.prototype.read = function() { + return new Date().getTime() - this._time; + }; + + /** + * Starts the autoplay. + * @public + * @param {Number} [timeout] - The interval before the next animation starts. + * @param {Number} [speed] - The animation speed for the animations. + */ + Autoplay.prototype.play = function(timeout, speed) { + var elapsed; + + if (!this._core.is('rotating')) { + this._core.enter('rotating'); + } + + timeout = timeout || this._core.settings.autoplayTimeout; + + // Calculate the elapsed time since the last transition. If the carousel + // wasn't playing this calculation will yield zero. + elapsed = Math.min(this._time % (this._timeout || timeout), timeout); + + if (this._paused) { + // Start the clock. + this._time = this.read(); + this._paused = false; + } else { + // Clear the active timeout to allow replacement. + window.clearTimeout(this._call); + } + + // Adjust the origin of the timer to match the new timeout value. + this._time += this.read() % timeout - elapsed; + + this._timeout = timeout; + this._call = window.setTimeout($.proxy(this._next, this, speed), timeout - elapsed); + }; + + /** + * Stops the autoplay. + * @public + */ + Autoplay.prototype.stop = function() { + if (this._core.is('rotating')) { + // Reset the clock. + this._time = 0; + this._paused = true; + + window.clearTimeout(this._call); + this._core.leave('rotating'); + } + }; + + /** + * Pauses the autoplay. + * @public + */ + Autoplay.prototype.pause = function() { + if (this._core.is('rotating') && !this._paused) { + // Pause the clock. + this._time = this.read(); + this._paused = true; + + window.clearTimeout(this._call); + } + }; + + /** + * Destroys the plugin. + */ + Autoplay.prototype.destroy = function() { + var handler, property; + + this.stop(); + + for (handler in this._handlers) { + this._core.$element.off(handler, this._handlers[handler]); + } + for (property in Object.getOwnPropertyNames(this)) { + typeof this[property] != 'function' && (this[property] = null); + } + }; + + $.fn.owlCarousel.Constructor.Plugins.autoplay = Autoplay; + +})(window.Zepto || window.jQuery, window, document); + +/** + * Navigation Plugin + * @version 2.3.4 + * @author Artus Kolanowski + * @author David Deutsch + * @license The MIT License (MIT) + */ +;(function($, window, document, undefined) { + 'use strict'; + + /** + * Creates the navigation plugin. + * @class The Navigation Plugin + * @param {Owl} carousel - The Owl Carousel. + */ + var Navigation = function(carousel) { + /** + * Reference to the core. + * @protected + * @type {Owl} + */ + this._core = carousel; + + /** + * Indicates whether the plugin is initialized or not. + * @protected + * @type {Boolean} + */ + this._initialized = false; + + /** + * The current paging indexes. + * @protected + * @type {Array} + */ + this._pages = []; + + /** + * All DOM elements of the user interface. + * @protected + * @type {Object} + */ + this._controls = {}; + + /** + * Markup for an indicator. + * @protected + * @type {Array.} + */ + this._templates = []; + + /** + * The carousel element. + * @type {jQuery} + */ + this.$element = this._core.$element; + + /** + * Overridden methods of the carousel. + * @protected + * @type {Object} + */ + this._overrides = { + next: this._core.next, + prev: this._core.prev, + to: this._core.to + }; + + /** + * All event handlers. + * @protected + * @type {Object} + */ + this._handlers = { + 'prepared.owl.carousel': $.proxy(function(e) { + if (e.namespace && this._core.settings.dotsData) { + this._templates.push('
' + + $(e.content).find('[data-dot]').addBack('[data-dot]').attr('data-dot') + '
'); + } + }, this), + 'added.owl.carousel': $.proxy(function(e) { + if (e.namespace && this._core.settings.dotsData) { + this._templates.splice(e.position, 0, this._templates.pop()); + } + }, this), + 'remove.owl.carousel': $.proxy(function(e) { + if (e.namespace && this._core.settings.dotsData) { + this._templates.splice(e.position, 1); + } + }, this), + 'changed.owl.carousel': $.proxy(function(e) { + if (e.namespace && e.property.name == 'position') { + this.draw(); + } + }, this), + 'initialized.owl.carousel': $.proxy(function(e) { + if (e.namespace && !this._initialized) { + this._core.trigger('initialize', null, 'navigation'); + this.initialize(); + this.update(); + this.draw(); + this._initialized = true; + this._core.trigger('initialized', null, 'navigation'); + } + }, this), + 'refreshed.owl.carousel': $.proxy(function(e) { + if (e.namespace && this._initialized) { + this._core.trigger('refresh', null, 'navigation'); + this.update(); + this.draw(); + this._core.trigger('refreshed', null, 'navigation'); + } + }, this) + }; + + // set default options + this._core.options = $.extend({}, Navigation.Defaults, this._core.options); + + // register event handlers + this.$element.on(this._handlers); + }; + + /** + * Default options. + * @public + * @todo Rename `slideBy` to `navBy` + */ + Navigation.Defaults = { + nav: false, + navText: [ + '', + '' + ], + navSpeed: false, + navElement: 'button type="button" role="presentation"', + navContainer: false, + navContainerClass: 'owl-nav', + navClass: [ + 'owl-prev', + 'owl-next' + ], + slideBy: 1, + dotClass: 'owl-dot', + dotsClass: 'owl-dots', + dots: true, + dotsEach: false, + dotsData: false, + dotsSpeed: false, + dotsContainer: false + }; + + /** + * Initializes the layout of the plugin and extends the carousel. + * @protected + */ + Navigation.prototype.initialize = function() { + var override, + settings = this._core.settings; + + // create DOM structure for relative navigation + this._controls.$relative = (settings.navContainer ? $(settings.navContainer) + : $('
').addClass(settings.navContainerClass).appendTo(this.$element)).addClass('disabled'); + + this._controls.$previous = $('<' + settings.navElement + '>') + .addClass(settings.navClass[0]) + .html(settings.navText[0]) + .prependTo(this._controls.$relative) + .on('click', $.proxy(function(e) { + this.prev(settings.navSpeed); + }, this)); + this._controls.$next = $('<' + settings.navElement + '>') + .addClass(settings.navClass[1]) + .html(settings.navText[1]) + .appendTo(this._controls.$relative) + .on('click', $.proxy(function(e) { + this.next(settings.navSpeed); + }, this)); + + // create DOM structure for absolute navigation + if (!settings.dotsData) { + this._templates = [ $(' +
+
+ +
+ +
+ +
+ + + +
+ Please Enable Top Deal Products and add the Offer price in the product variant form. +
+
+
+ + + + diff --git a/theme_shopping/static/src/js/welcome_message.js b/theme_shopping/static/src/js/welcome_message.js new file mode 100644 index 000000000..6dc1ee6a6 --- /dev/null +++ b/theme_shopping/static/src/js/welcome_message.js @@ -0,0 +1,21 @@ +import { Component } from '@odoo/owl'; +import { WebsitePreview } from '@website/client_actions/website_preview/website_preview'; +import { patch } from "@web/core/utils/patch"; +import { renderToElement } from "@web/core/utils/render"; + + +patch(WebsitePreview.prototype, { +//export class CustomWebsitePreview extends WebsitePreview { + addWelcomeMessage() { + if (this.websiteService.isRestrictedEditor) { + const wrap = this.iframe.el.contentDocument.querySelector('#wrapwrap.homepage #wrap'); + if (wrap && !wrap.innerHTML.trim()) { + this.welcomeMessage = renderToElement('website.homepage_editor_welcome_message'); + this.welcomeMessage.classList.add('o_homepage_editor_welcome_message', 'h-100'); + while (wrap.firstChild) { + wrap.removeChild(wrap.lastChild); + } + } + } + } +}); diff --git a/theme_shopping/static/src/js/winter_collection_carousel/winter_products_carousel.js b/theme_shopping/static/src/js/winter_collection_carousel/winter_products_carousel.js new file mode 100644 index 000000000..f888405fa --- /dev/null +++ b/theme_shopping/static/src/js/winter_collection_carousel/winter_products_carousel.js @@ -0,0 +1,114 @@ +/** @odoo-module **/ +import {rpc } from "@web/core/network/rpc"; +import publicWidget from "@web/legacy/js/public/public_widget"; +import animations from "@website/js/content/snippets.animation"; +import wSaleUtils from "@website_sale/js/website_sale_utils"; +import { Component } from "@odoo/owl"; +import { renderToElement } from "@web/core/utils/render"; + + +publicWidget.registry.WinterProduct = animations.Animation.extend({ + // To extend public widget + selector: '.winter_products_carousel', + disabledInEditableMode: false, + events: { + 'click .btn-add-to-cart': '_onClickAddToCart', + 'click .o_add_wishlist': '_onClickWishBtn' + }, + // Add to WishList + _onClickWishBtn: function (ev) { + var target = $(ev.currentTarget); + var productId = target.data('product-id'); + const $wishButton = $('.o_wsale_my_wish'); + var $navButton = $('header .o_wsale_my_wish').first(); + + rpc('/shop/wishlist/add', { + 'product_id': productId, + }).then(function (result) { + if (result) { + $wishButton.find('.my_wish_quantity').text(result[1]); + } + }) + }, + // Add to Cart + _onClickAddToCart: function (ev) { + var target = $(ev.currentTarget); + var productId = target.data('product-id'); + var self = this; + rpc('/shop/cart/update_json', { + 'product_id': productId, + 'add_qty': 1, + display: false, + force_create: true, + }).then(async function (result) { + wSaleUtils.updateCartNavBar(result); + wSaleUtils.showWarning(result.notification_info.warning); + wSaleUtils.showCartNotification(self.call.bind(self), result.notification_info); + // Propagating the change to the express checkout forms + Component.env.bus.trigger('cart_amount_changed', [result.amount, result.minor_amount]) + }); + }, + start: async function () { + var self = this; + this._super.apply(this, arguments); + var data = await rpc('/get_winter_product_snippet', {}) + console.log("data",data) + if (data) { + this.$target.empty().html(renderToElement('theme_shopping.winter_product_carousel_snippet', {products: data})) + self._initCarousel(); + } + }, + _initCarousel: function (autoplay = false, items = 5, slider_timing = 5000) { + var self = this; + this.$("#product").owlCarousel({ + items: 3, + loop: true, + margin: 30, + stagePadding: 30, + smartSpeed: 450, + autoplay: true, + autoPlaySpeed: 1000, + autoPlayTimeout: 1000, + autoplayHoverPause: true, + dots: true, + nav: false, + navText: ['', ''], + responsiveClass: true, + responsive: { + 0: { + items: 1, + nav: false, + loop: true + }, + 600: { + items: 2, + nav: false, + loop: true + }, + 1000: { + items: 5, + nav: false, + loop: true, + } + } + }); + }, + counter: function () { + var buttons = this.$('.owl-dots button'); + buttons.each(function (index, item) {}); + }, + + destroy: function () { + this._clearContent(); + this._super.apply(this, arguments); + }, + + _clearContent: function () { + const $templateArea = this.$el.find('.winter_products_carousel'); + this.trigger_up('widgets_stop_request', { + $target: $templateArea, + }); + $templateArea.html(''); + }, + +}) diff --git a/theme_shopping/static/src/js/winter_collection_carousel/winter_products_content.xml b/theme_shopping/static/src/js/winter_collection_carousel/winter_products_content.xml new file mode 100644 index 000000000..f770171df --- /dev/null +++ b/theme_shopping/static/src/js/winter_collection_carousel/winter_products_content.xml @@ -0,0 +1,68 @@ + + + + + + + + + diff --git a/theme_shopping/static/src/scss/abstracts/_base.scss b/theme_shopping/static/src/scss/abstracts/_base.scss new file mode 100644 index 000000000..e5a55aeb1 --- /dev/null +++ b/theme_shopping/static/src/scss/abstracts/_base.scss @@ -0,0 +1,113 @@ +body { + font-family: 'Lato', sans-serif; + box-sizing: border-box; + overflow-x: hidden; +} + +.st-body { + background-color: $background-color; +} + +a { + text-decoration: none; +} + +ul { + list-style: none; + padding-left: 0px; +} + +li { + list-style: none; +} + +.st-auto-image { + width: 100%; + height: 100%; + object-fit: cover; +} + +.st-wrapper { + margin: 5rem 0; + border-radius: 20px; /* Adjust this value to make the curves more or less pronounced */ + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Optional: Add shadow for some depth */ + @media (max-width:768px) { + margin: 3rem 0; + } +} +.st-secondary_wrapper{ + background-color: $background-primary; +} + +.st-section__head { + font-size: $st-font-size-md; + margin-bottom: 0; +} + +.st-link { + color: $primary-color; + font-weight: 400; + font-size: $st-font-size-base; + transition: all 0.3s; + + &:hover { + + color: $primary-color; + + } +} + +.st-page-link { + border-radius: 6px; + background-color: $background-primary; + color: $black-color; + padding: 0.5rem 0.8rem; + font-size: $st-font-size-sm; + font-weight: 600; + + &.active { + background-color: $primary-color; + color: $white-color; + } + + &:hover { + background-color: rgba($primary-color, 0.3); + color: $black-color; + } +} + +.st-page_navigate--btn { + background-color: transparent; + color: $primary-color; + + &:hover { + background-color: transparent; + color: $primary-color; + } +} + +.page-item { + &.disable { + .st-page-link { + color: $black-color; + pointer-events: none; + } + + } +} + +.st-hero_section-banner { + width: 100%; + height: 220px; + background: $background-primary; + + @media (max-width:768px) { + height: 110px; + } +} + +.st-hero_section-content { + display: flex; + align-items: center; + height: 100%; +} \ No newline at end of file diff --git a/theme_shopping/static/src/scss/abstracts/_buttons.scss b/theme_shopping/static/src/scss/abstracts/_buttons.scss new file mode 100644 index 000000000..99fd6950d --- /dev/null +++ b/theme_shopping/static/src/scss/abstracts/_buttons.scss @@ -0,0 +1,56 @@ +.st-btn__sm { + color: $primary-color; + font-size: $st-font-size-sm; + width: fit-content; + border: 1px solid $primary-color; + border-radius: 2px; + font-weight: 400; + white-space: nowrap; +} + +.st-btn__solid { + color: $primary-color; + font-size: $st-font-size-sm; + width: fit-content; + background-color: $white-color; + border-radius: 2px; + font-weight: 700; + padding: 0.6rem 1.4rem; + white-space: nowrap; +} + +.st-cart_btn--sm { + background-color: $primary-color; + color: $white-color; + font-size: $st-font-size-sm; + font-weight: 700; + width: auto; + + border: none; + border-radius: 4px; + display: flex; + align-items: center; + justify-content: center; + gap: 0.4rem; + &:hover{ + color: $white-color; + } +} + +.st-product-like_btn{ + border-radius: 50%; + background-color: $white-color; + color: $font-color; + font-size: $st-font-size-base; + width: 36px; + height: 36px; + display: flex; + align-self: center; + justify-content: center; + @media (max-width:575px){ + width: 30px; + height: 30px; + align-items: center; + } + +} \ No newline at end of file diff --git a/theme_shopping/static/src/scss/abstracts/_variables.scss b/theme_shopping/static/src/scss/abstracts/_variables.scss new file mode 100644 index 000000000..1e9b937fa --- /dev/null +++ b/theme_shopping/static/src/scss/abstracts/_variables.scss @@ -0,0 +1,35 @@ +// Font.............. + +@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,400&display=swap'); + + +// Colors.......................... + +$primary-color: #800000; +$dark-gray: #555555; +$font-color: #7D7D7D; +$light-font: #E2E2E2; + +$background-color: #FFFAF4; +$background-primary: rgba($primary-color, 0.08); +$border-light: #D9D9D9; + +$black-color: #000; +$white-color: #fff; + +$yellow:#F99417; +$yellow-light:#FFD400; + + + +// Font Sizes...................... +$st-font-size-sm: clamp(0.8rem, 0.17vw + 0.76rem, 0.89rem); +$st-font-size-base: clamp(1rem, 0.34vw + 0.91rem, 1.19rem); +$st-font-size-md: clamp(1.25rem, 0.61vw + 1.1rem, 1.58rem); +$st-font-size-lg: clamp(1.56rem, 1vw + 1.31rem, 2.11rem); +$st-font-size-xl: clamp(1.95rem, 1.56vw + 1.56rem, 2.81rem); +$st-font-size-xxl: clamp(2.44rem, 2.38vw + 1.85rem, 3.75rem); +$st-font-size-xxxl: clamp(3.05rem, 3.54vw + 2.17rem, 5rem); + + +//Break points......................... \ No newline at end of file diff --git a/theme_shopping/static/src/scss/components/_footer.scss b/theme_shopping/static/src/scss/components/_footer.scss new file mode 100644 index 000000000..61b82c166 --- /dev/null +++ b/theme_shopping/static/src/scss/components/_footer.scss @@ -0,0 +1,73 @@ +.st-footer { + background-color: $black-color; + width: 100%; +} + +.st-footer_container { + padding: 5rem 0; + display: flex; + align-items: flex-start; + justify-content: space-between; + color: $white-color; + flex-wrap: wrap; + margin-bottom: 0rem; + gap: 2rem; +} + +.st-footer_logo { + width: 170px; + height: auto; + margin-bottom: 1.3rem; +} + +.st-footer_text { + max-width: 380px; + font-size: $st-font-size-sm; + font-weight: 400; + color: $light-font; +} + +.st-footer_head { + font-size: $st-font-size-base; + color: $white-color; + font-weight: 600; + margin-bottom: 1.3rem; + min-width: 156px; +} + +.st-ft_soical-link { + display: flex; + gap: 0.7rem; + margin: 1rem 0 2rem 0; +} + +.st-ft_media--link { + color: $black-color; + width: 28px; + height: 28px; + border-radius: 6px; + background-color: $white-color; + font-size: $st-font-size-sm; + display: flex; + align-items: center; + justify-content: center; +} + +.st-ft_copyright { + color: $light-font; + font-size: 12px; + padding: 0.87rem 0; + display: block; + border-top: 1px solid $border-light; +} + +.st-payment_option { + padding-bottom: 2rem; + + width: 400px; + + @media (max-width:575px) { + width: 100%; + + } +} \ No newline at end of file diff --git a/theme_shopping/static/src/scss/components/_header.scss b/theme_shopping/static/src/scss/components/_header.scss new file mode 100644 index 000000000..558a10bab --- /dev/null +++ b/theme_shopping/static/src/scss/components/_header.scss @@ -0,0 +1,343 @@ +.st-topnavbar { + background-color: $primary-color; +} + +.st-search_icon { + position: absolute; + background-color: transparent; + padding-right: 0px; + border: none; + color: $primary-color; + z-index: 1; +} + +.st-search_input { + background-color: $background-color; + border-radius: 30px; + padding-left: 2rem; + border: none; + font-size: $st-font-size-sm; +} + +.st-search_container { + display: flex; + align-items: center; + width: 100%; + position: relative; + +} + +.st-top_menubar { + display: flex; + align-items: center; + padding-left: 0px; + list-style: none; + + margin-bottom: 0px; + padding: 1.3rem 0; +} + + + +.st-menu__item { + color: $black-color; + font-weight: 400; + transition: all 0.3s; + padding: 1.4rem 0; + cursor: pointer; + white-space: nowrap; + overflow: hidden; + position: relative; + + &:before { + content: ""; + position: absolute; + bottom: -1px; + left: 0; + width: 0px; + height: 2px; + background-color: $primary-color; + transition: width 0.3s ease-in-out; + } + + &:hover::before, + &.active::before { + width: 100%; + } + + &:hover { + color: $primary-color; + } + +} + +.st-topmenu_list { + box-shadow: 0px -4px 12px 4px rgba(0, 0, 0, 0.25); + +} + +.st-header_link { + color: $white-color; + font-size: $st-font-size-base; + font-weight: 300; + transition: all 0.3s; + padding: 0.2rem 0.5rem; + border-radius: 30px; + + &:hover { + background-color: rgba($background-color, 0.2); + color: $white-color; + } +} + +.st-header_link-list { + display: flex; + align-items: center; + flex-wrap: nowrap; + margin-left: 1rem; +} + + +.st-header_signin { + font-size: $st-font-size-sm; +} + +.st-menu_btn { + background-color: transparent; + border: none; +} + +.st-header_menu-link { + padding: 0.3rem 0.5rem; +} + +.st-sub_menu { + position: absolute; + width: 100vw; + padding: 40px 1%; + background-color: $background-color; + box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25); + margin-top: 1.3rem; + border-top: 1px solid $border-light; + transition: transform .65s cubic-bezier(.165, .84, .44, 1) .075s, opacity .65s cubic-bezier(.165, .84, .44, 1) .15s; + width: 100vw; + margin-left: -50vw; + left: 50%; + right: -15%; + visibility: hidden; + opacity: 0; + z-index: 11; +} + +.st-menu_list { + + padding: 0 0.75rem; + + &:hover { + .st-sub_menu { + visibility: visible; + opacity: 1; + } + } +} + +.st-mega_menu--container { + display: flex; + align-items: flex-start; + justify-content: space-between; + gap: 1rem; + flex-wrap: wrap; +} + +.st-mega-menu_header { + color: $primary-color; + font-size: $st-font-size-sm; + font-weight: 400; + padding-bottom: 0.5rem; + border-bottom: 1px solid $border-light; + margin-bottom: 0.5rem; + display: block; + width: 100%; +} + +.st-mega-menu-heading { + margin-bottom: 1rem; +} + +.st-mega-menu_item--list { + color: $dark-gray; + font-size: $st-font-size-sm; + font-weight: 400; + + &:hover { + color: $black-color; + } +} + +.st-mob_navbar { + padding: 0px; + display: flex; + background-color: $background-color; +} + +.st-mob_sidebar { + width: 56px; + padding: 15px; + background-color: $primary-color; + display: flex; + flex-direction: column; + align-items: center; + justify-content: flex-start; +} + +.st-mob_close-btn { + width: 28px; + height: 28px; + border-radius: 50px; + border: none; + background-color: $background-color; + color: $black-color; + transition: all 0.3s; + border: 0.5px solid $background-color; + display: flex; + align-items: center; + justify-content: center; + + + &:hover { + background-color: rgba($background-color, 0.2); + color: $white-color; + } +} + +.st-mob_sidebar--links { + display: flex; + align-items: center; + margin: 1rem 0; + flex-direction: column; +} + +.st-mob_sidebar--link { + font-size: 1.3rem; +} + +.st-soical__links { + height: 100%; + justify-content: end; +} + +.st-mob_sidebar--search { + border: 1px solid $border-light; + + &:focus { + box-shadow: none; + border: 1px solid $primary-color; + background-color: $background-color; + } +} + +.st-mob_sidebar--content { + width: 100%; + padding: 1.3rem 1rem; +} + +.st-mob-sidebar_menu-container { + margin: 2rem 0; + position: relative; + overflow: hidden; + + +} + +.st-mob-sidebar--nav-btn { + display: block; + position: relative; + padding: 7px 0; + text-align: left; + font-size: $st-font-size-sm; + line-height: 1; + font-weight: 400; + color: $dark-gray; + width: 100%; + cursor: pointer; + background-color: transparent; + border-width: 0px; + transition: color 250ms ease, background-color 250ms ease; + + &:hover { + color: $black-color; + } + + &:before { + content: '\EA6E'; + font-family: "remixicon"; + color: $dark-gray; + font-size: $st-font-size-sm; + padding-right: 0.5em; + position: absolute; + top: 10px; + right: -5px; + font-weight: 900; + } +} + +.st-mob-sidebar-sub__list { + display: block; + position: relative; + padding: 7px 0; + text-align: left; + font-size: $st-font-size-sm; + line-height: 1; + font-weight: 400; + color: $dark-gray; + width: 100%; + cursor: pointer; + background-color: transparent; + border-width: 0px; + transition: color 250ms ease, background-color 250ms ease; + + &:hover { + color: $black-color; + } +} + +.st-mob-sidebar--back-btn { + color: $primary-color; + padding-bottom: 0.7rem; + margin-bottom: 0.7rem; + + &:hover { + color: $primary-color; + } + + &:before { + content: '\EA64'; + } + + &:after { + content: ""; + border-bottom: 1px solid $border-light; + height: 1px; + width: 100%; + position: absolute; + bottom: 0; + left: 0; + } +} + +.sub-menu { + position: absolute; + top: 0; + right: 0; + + width: 100%; + display: none; + background-color: $background-color; + transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out; + height: 100%; +} + +.sub-menu.active { + display: block; + +} diff --git a/theme_shopping/static/src/scss/main.css b/theme_shopping/static/src/scss/main.css new file mode 100644 index 000000000..96c483bfe --- /dev/null +++ b/theme_shopping/static/src/scss/main.css @@ -0,0 +1,104 @@ +@import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,400&display=swap"); +body { + font-family: "Lato", sans-serif; +} + +.st-body { + background-color: #FFFAF4; +} + +a { + text-decoration: none; +} + +.st-topnavbar { + background-color: #800000; +} + +.st-search_icon { + position: absolute; + background-color: transparent; + padding-right: 0px; + border: none; + color: #800000; + z-index: 1; +} + +.st-search_input { + background-color: #FFFAF4; + border-radius: 30px; + padding-left: 2rem; + border: none; + font-size: clamp(0.8rem, 0.17vw + 0.76rem, 0.89rem); +} + +.st-search_container { + display: flex; + align-items: center; + width: 100%; +} + +.st-top_menubar { + display: flex; + align-items: center; + padding-left: 0px; + list-style: none; + gap: 1.5rem; + margin-bottom: 0px; + padding: 1.3rem 0; +} + +.st-menu__item { + color: #000; + font-weight: 400; + transition: all 0.3s; + padding: 1.4rem 0; + cursor: pointer; + white-space: nowrap; + overflow: hidden; + position: relative; +} +.st-menu__item:before { + content: ""; + position: absolute; + bottom: -1px; + left: 0; + width: 0px; + height: 2px; + background-color: #800000; + transition: width 0.3s ease-in-out; +} +.st-menu__item:hover::before { + width: 100%; +} +.st-menu__item:hover { + color: #800000; +} + +.st-topmenu_list { + box-shadow: 0px -4px 12px 4px rgba(0, 0, 0, 0.25); +} + +.st-header_link { + color: #fff; + font-size: clamp(1rem, 0.34vw + 0.91rem, 1.19rem); + font-weight: 300; + transition: all 0.3s; + padding: 0.2rem 0.5rem; + border-radius: 30px; +} +.st-header_link:hover { + background-color: rgba(255, 250, 244, 0.2); + color: #fff; +} + +.st-header_link-list { + display: flex; + align-items: center; + flex-wrap: nowrap; + margin-left: 1rem; +} + +.st-header_signin { + font-size: clamp(0.8rem, 0.17vw + 0.76rem, 0.89rem); +}/*# sourceMappingURL=main.css.map */ \ No newline at end of file diff --git a/theme_shopping/static/src/scss/main.css.map b/theme_shopping/static/src/scss/main.css.map new file mode 100644 index 000000000..ee75776ec --- /dev/null +++ b/theme_shopping/static/src/scss/main.css.map @@ -0,0 +1 @@ +{"version":3,"sources":["abstracts/_variables.scss","abstracts/_base.scss","main.css","components/_header.scss"],"names":[],"mappings":"AAGQ,6HAAA;ACFR;EACI,+BAAA;ACCJ;;ADCA;EACI,yBDOc;AELlB;;ADAA;EACI,qBAAA;ACGJ;;ACXA;EACI,yBHOW;AEOf;;ACXA;EACI,kBAAA;EACA,6BAAA;EACA,kBAAA;EACA,YAAA;EACA,cHDW;EGEX,UAAA;ADcJ;;ACXA;EACI,yBHFc;EGGd,mBAAA;EACA,kBAAA;EACA,YAAA;EACA,mDHGc;AEWlB;;ACXA;EACI,aAAA;EACA,mBAAA;EACA,WAAA;ADcJ;;ACVA;EACI,aAAA;EACA,mBAAA;EACA,iBAAA;EACA,gBAAA;EACA,WAAA;EACA,kBAAA;EACA,iBAAA;ADaJ;;ACRA;EACI,WH1BS;EG2BT,gBAAA;EACA,oBAAA;EACA,iBAAA;EACA,eAAA;EACA,mBAAA;EACA,gBAAA;EACA,kBAAA;ADWJ;ACTI;EACI,WAAA;EACA,kBAAA;EACA,YAAA;EACA,OAAA;EACA,UAAA;EACA,WAAA;EACA,yBHjDO;EGkDP,kCAAA;ADWR;ACRI;EACI,WAAA;ADUR;ACPI;EACI,cH1DO;AEmEf;;ACJA;EACI,iDAAA;ADOJ;;ACHA;EACI,WH7DS;EG8DT,iDHxDgB;EGyDhB,gBAAA;EACA,oBAAA;EACA,sBAAA;EACA,mBAAA;ADMJ;ACJI;EACI,0CAAA;EACA,WHtEK;AE4Eb;;ACFA;EACI,aAAA;EACA,mBAAA;EACA,iBAAA;EACA,iBAAA;ADKJ;;ACFA;EACI,mDH7Ec;AEkFlB","file":"main.css"} \ No newline at end of file diff --git a/theme_shopping/static/src/scss/main.scss b/theme_shopping/static/src/scss/main.scss new file mode 100644 index 000000000..20f0733ae --- /dev/null +++ b/theme_shopping/static/src/scss/main.scss @@ -0,0 +1,12 @@ +@charset "UTF-8"; + +@import + +//abstracts..... +'abstracts/variables','abstracts/base','abstracts/buttons', + +//components... +'components/header','components/footer', + +//pages... +'pages/home','pages/product-list','pages/selected-product','pages/about-us','pages/blog'; \ No newline at end of file diff --git a/theme_shopping/static/src/scss/pages/_about-us.scss b/theme_shopping/static/src/scss/pages/_about-us.scss new file mode 100644 index 000000000..ea1c68477 --- /dev/null +++ b/theme_shopping/static/src/scss/pages/_about-us.scss @@ -0,0 +1,199 @@ +.st-hero_section-banner--head { + font-weight: bold; +} + +.st-sm_highlight { + color: $primary-color; + text-transform: uppercase; + font-size: $st-font-size-sm; +} + +.st-abt__main--heading { + font-size: $st-font-size-lg; + font-weight: 700; + margin: 1rem 0; +} + +.st-abt__text { + font-size: $st-font-size-sm; + line-height: 170%; +} + +.st-abt__link { + color: $primary-color; + font-weight: 700; + position: relative; + + &:after { + content: ''; + float: right; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(128,0,0,1)'%3E%3Cpath fill='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpath d='M13.1717 12.0007L8.22192 7.05093L9.63614 5.63672L16.0001 12.0007L9.63614 18.3646L8.22192 16.9504L13.1717 12.0007Z'%3E%3C/path%3E%3C/svg%3E"); + width: 1.5rem; + height: 1.5rem; + position: absolute; + background-position: center; + background-repeat: no-repeat; + } + + &:hover { + color: $primary-color; + } +} + +.st-abouts_img--container { + height: 100%; +} + +.st-aboutus__heading { + font-size: $st-font-size-md; + font-weight: bold; +} + +.st-aboutus__service { + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + margin: 7rem 0; + + @media (max-width:768px) { + margin: 3rem 0; + } +} + +.st-abouts_service-items { + display: flex; + gap: 1rem; +} + +.st-aboutus__service--container { + display: flex; + align-items: center; + justify-content: space-between; + width: 100%; + margin: 3rem 0; + flex-wrap: wrap; + gap: 2rem; + + @media (max-width:768px) { + margin: 1rem 0; + } +} + +.st-aboutus_imgContainer { + width: 4rem; +} + +.st-aboutus_service-head { + font-size: $st-font-size-base; + color: $black-color; + font-weight: 500; +} + +.st-aboutus_service-subtext { + color: $font-color; + margin-bottom: 0px; +} + +.st-aboutus_light--text { + color: $black-color; + font-weight: 300; + padding: 0.5rem 0; +} + +.st-aboutus_team-imgcontainer { + height: 320px; + + img { + object-fit: cover; + } + @media (max-width:992px) { + height: 210px; + } + + @media (max-width:400px) { + height: 150px; + } + +} + +.st-sm__testimonial--head { + text-transform: capitalize; +} +#add_testimonial { + cursor: pointer; /* Ensure the cursor changes to a pointer */ + display: inline-block; /* Make sure it's a clickable block */ + pointer-events: auto; /* Ensure pointer events are enabled */ +} +.st-testimonial__card { + background-color: $white-color; + border-radius: 2px; + box-shadow: 0px 0px 14px 0px $background-primary; + padding: 2rem; + margin: 0.8rem; +} + +.st-testimonial__content { + color: $font-color; + font-size: $st-font-size-sm; +} + +.st-testimonial__person--detail { + display: flex; + gap: 0.5rem; +} + +.st-testimonial__person-img { + width: 50px; + height: 50px; + border-radius: 50px; + overflow: hidden; +} + +.st-testimonial_name { + font-weight: 300; + font-size: $st-font-size-sm; + margin-bottom: 0; +} + +.st-star__icon { + color: $yellow-light; + font-size: $st-font-size-sm; +} + +.st_accordion-btn { + margin: 1rem 0; + transition: all 0.3s; + + &:after { + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(128,0,0,1)'%3E%3Cpath fill='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpath d='M11 11V5H13V11H19V13H13V19H11V13H5V11H11Z'%3E%3C/path%3E%3C/svg%3E"); + } +} + +.st-accordion__item { + background-color: transparent; + border: none; + + + .st_accordion-btn { + border-radius: 4px; + background-color: $white-color; + box-shadow: 0px 0px 14px 0px rgba(255, 250, 244, 0.42); + } +} + +.st_accordion-btn:not(.collapsed) { + background-color: $primary-color; + color: $white-color; + box-shadow: 0px 0px 14px 0px rgba(255, 250, 244, 0.42); + + &:after { + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(255,255,255,1)'%3E%3Cpath fill='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpath d='M5 11V13H19V11H5Z'%3E%3C/path%3E%3C/svg%3E"); + } +} + +.st-accordion__body { + font-size: $st-font-size-sm; + color: $dark-gray ; + line-height: 1.7rem; +} \ No newline at end of file diff --git a/theme_shopping/static/src/scss/pages/_blog.scss b/theme_shopping/static/src/scss/pages/_blog.scss new file mode 100644 index 000000000..8a2a5609b --- /dev/null +++ b/theme_shopping/static/src/scss/pages/_blog.scss @@ -0,0 +1,86 @@ +.st-blog__header { + margin: 3rem 0; + position: relative; +} + +.st-blog__item-list { + display: flex; + justify-content: center; + + + ::before{ + content: ''; + position: absolute; + width: 100%; + left: 0; + right: 0; + height: 1px; + background-color: $light-font; + top: 14px; + z-index: -1; + } +} + +.st-blog__category-item { + color: $black-color; + font-size: $st-font-size-sm; + padding: 0 0.7rem; + background-color: $background-color; + + &:hover { + color: $primary-color; + } + + &.active { + color: $primary-color; + } +} + +.st-blog__img { + width: 100%; + height: 280px; + border-radius: 4px; + overflow: hidden; +} + +.st-blog__title { + color: $black-color; + font-size: $st-font-size-base; + font-weight: 600; + margin-bottom: 2rem; +} + +.st-blog__sub-title { + color: $dark-gray; + font-size: $st-font-size-base; + +} + +.st-blog-label { + color: $font-color; + font-size: $st-font-size-sm; + padding-right: 2rem; +} + +.st-singleblog_container { + height: 470px; + + @media (max-width:768px) { + height: 280px; + } +} + +.st-singleblog__title { + font-size: $st-font-size-lg; + color: $black-color; + font-weight: 600; + margin: 1rem 0; +} + +.st-blog-highlight { + color: $black-color; + font-size: $st-font-size-sm; + + font-weight: 600; + width: 100px; +} \ No newline at end of file diff --git a/theme_shopping/static/src/scss/pages/_home.scss b/theme_shopping/static/src/scss/pages/_home.scss new file mode 100644 index 000000000..57e25791f --- /dev/null +++ b/theme_shopping/static/src/scss/pages/_home.scss @@ -0,0 +1,335 @@ +.st-hero_section { + position: relative; + height: 400px; + border-radius: 4px; + overflow: hidden; + margin: 2rem 0 1rem 0; + display: flex; + justify-content: center; + flex-direction: column; + padding: 2rem; + + @media (max-width:992px) { + height: 340px; + } + + @media (max-width:768px) { + height: unset; + } +} + @media (max-width:768px) { + .gap-2 { + gap: 1.5rem !important; + } + } + +.st-hero__img { + width: 100%; + position: absolute; + top: 0px; + left: 0px; + z-index: -1; + height: 100%; + + img { + object-fit: cover; + } +} + +.st-hero__headline { + color: $black-color; + font-size: $st-font-size-lg; + font-weight: 700; + margin-bottom: 1.4rem; +} + +.st-hero_imgcontainer { + width: 100%; + height: 100%; + position: relative; + padding: 2rem; + min-height: 210px; + + + @media (max-width:768px) { + min-height: unset; + padding: 2rem 1rem; + } + +} + +.st-product_card--img { + width: 100%; + height: 265px; + position: relative; + transition: all 0.3s; + cursor: pointer; + + &:hover .st-product_overlay { + display: flex; + } + + @media (max-width:472px) { + height: 190px; + } +} + +.st-product__container { + display: flex; + justify-content: space-between; +} + +.st-product-list__header { + display: flex; + justify-content: space-between; + align-items: center; + padding: 4rem 0; + + @media (max-width:768px) { + padding: 2.6rem 0; + } +} + +.st-product_card { + padding: 0.4rem; +} + +.st-product_card--detail { + padding: 0.8rem 0; +} + +.st-product_offer-price { + font-size: $st-font-size-base; + color: $primary-color; + font-weight: 700; +} + +.st-product_price { + color: $font-color; + font-size: $st-font-size-sm; + font-weight: 400; + text-decoration: line-through; + padding: 0 0.4rem; +} + +.st-product_name { + font-size: $st-font-size-base; + color: $black-color; + font-weight: 600; +} + +.st-product_desc { + font-size: $st-font-size-sm; + color: $font-color; + display: block; + padding-top: 0.2rem; +} + +.st-product_overlay { + position: absolute; + left: 0px; + bottom: 0px; + background: linear-gradient(0deg, rgba(0, 0, 0, 0.80) 0%, rgba(65, 65, 65, 0.00) 109.73%); + width: 100%; + height: 100%; + display: flex; + align-items: end; + display: none; +} + +.st-product_overlay-content { + display: flex; + gap: 0.8rem; + justify-content: space-between; + margin: 1rem; + width: 100%; + + @media (max-width:575px) { + margin: 0.6rem; + gap: 0.6rem; + } +} + +.st-home_offer-container { + background-color: $black-color; + padding: 1rem; + +} + +.st-home_offer-container-head { + display: flex; + align-items: center; + justify-content: space-between; + margin-bottom: 1rem; +} + +.st-home_offer-headline { + color: $white-color; + font-size: $st-font-size-md; + font-weight: 700; + +} + +.st-home_more-offer--link { + color: $white-color; + font-size: $st-font-size-sm; +} + +.st-home_offer--box { + width: 100%; + height: 220px; + padding: 0.8rem; + position: relative; +} + +.st-home_category--name { + color: $black-color; + background-color: rgba($white-color, 0.53); + position: absolute; + bottom: 0px; + left: 0px; + margin: 0.8rem; + width: -webkit-fill-available; + display: flex; + align-items: center; + padding: 0.2rem; + font-size: $st-font-size-sm; + font-weight: 600; + justify-content: center; +} + +.st-home_category-items { + display: flex; + align-items: center; + justify-content: space-between; + flex-wrap: wrap; + margin: 4rem 0; + gap: 2rem; + + @media (max-width:768px) { + justify-content: space-around; + gap: 1rem; + } +} + +.st-home_category-itemcard { + text-align: center; + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; +} + +.st-home_category--img { + width: 180px; + height: 180px; + border-radius: 50%; + overflow: hidden; + + &:hover { + box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px; + } + + &:hover .st-auto-image { + + transform: scale(1.1); + transition: transform 0.5s ease-in-out; + } + + @media (max-width:992px) { + width: 100px; + height: 100px; + } +} + +.st-home_category--itemname { + margin: 0.4rem 0; + font-size: $st-font-size-base; +} + +.st-newsletter__container { + text-align: center; + flex-direction: column; + align-items: center; + justify-content: center; + margin: 2rem 0 5rem 0; +} + +.st-newsletter__header { + font-weight: 800; + font-size: $st-font-size-lg; +} + +.st-newsletter_subline { + color: $font-color; + font-size: $st-font-size-base; + max-width: 50%; + text-align: center; + margin: 0 auto; + + @media (max-width:768px) { + max-width: 100%; + } + +} + +.st-newsletter_subscribe--btn { + font-weight: 700; + color: $primary-color; + font-size: $st-font-size-base; + transition: all 0.3s linear; + + &:hover { + color: $primary-color; + } + + &:focus { + box-shadow: none; + } +} + +.st-newsletter_input-box { + border-bottom: 1px solid $primary-color; + width: fit-content; + margin: 4rem auto; + +} + +.st-newsletter_input { + background-color: transparent; + border: none; + font-size: $st-font-size-base; + font-weight: 400; + + &:focus { + outline: none; + + } +} + +.owl-carosel-hero { + position: relative; + display: flex; + align-items: center; + + .owl-nav { + width: 100%; + display: flex; + justify-content: space-between; + position: absolute; + top: 50% + } + + span { + padding: 1rem; + color: $primary-color; + font-size: $st-font-size-base; + } + +} +.oe_website_sale { + // ==== Products list designs + .o_wsale_design_cards { + --o-wsale-card-border-width: 0px !important; + } +} \ No newline at end of file diff --git a/theme_shopping/static/src/scss/pages/_product-list.scss b/theme_shopping/static/src/scss/pages/_product-list.scss new file mode 100644 index 000000000..75275c37e --- /dev/null +++ b/theme_shopping/static/src/scss/pages/_product-list.scss @@ -0,0 +1,133 @@ +.st-breadcrumbs { + margin: 2rem 0; +} + +.st-breadcrumb__item { + color: $font-color; + font-size: $st-font-size-sm; + + &:hover { + color: $primary-color; + } +} + +.st-breadcrumb__list { + color: $font-color; + font-size: $st-font-size-sm; +} + +.st-breadcrumb__list+.st-breadcrumb__list::before { + float: left; + color: $font-color; + content: "|"; +} + +.st-product_filter-head { + display: flex; + align-items: center; + justify-content: space-between; + border-bottom: 1px solid $light-font; + padding-bottom: 0.5rem; + margin-bottom: 1rem; +} + +.st-product_filter--heading { + color: $black-color; + font-size: $st-font-size-base; + font-weight: 700; +} + +.st-product_clear-btn { + color: $primary-color; + font-size: $st-font-size-sm; + background-color: transparent; + border: none; +} + +.st-product_filter--btn { + font-size: $st-font-size-sm; + color: $black-color; + font-weight: 600; + padding: 0px; + width: 100%; + text-align: left; + display: flex; + align-items: center; + justify-content: space-between; + position: relative; + + + &::after { + content: ''; + float: right; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath fill='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpath d='M12 11.8284L9.17154 14.6569L7.75732 13.2426L12 9L16.2426 13.2426L14.8284 14.6569L12 11.8284Z'%3E%3C/path%3E%3C/svg%3E"); + width: 1.5rem; + height: 1.5rem; + } + + &.active::after { + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath fill='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpath d='M12 15.0006L7.75732 10.758L9.17154 9.34375L12 12.1722L14.8284 9.34375L16.2426 10.758L12 15.0006Z'%3E%3C/path%3E%3C/svg%3E"); + } + + &:focus { + box-shadow: none; + } +} + +.st-product_filter--sidebarlist { + padding-bottom: 1rem; + border-bottom: 1px solid $light-font; + margin-bottom: 1rem; +} + +.st-productlist_submenu { + display: flex; + align-items: center; + gap: 0.5rem; + padding: 0.1rem 0; +} + +.st-product-toggle-nav { + padding-top: 0.4rem; +} + +.st-productlist_searchbar { + border-radius: 2px; + border: 1px solid $border-light; + background-color: transparent; + color: $font-color; + + &:focus { + box-shadow: none; + border-color: $primary-color; + background-color: $background-color; + } +} + +.st-productlist-result_top { + display: flex; + align-items: center; + gap: 0.6rem; +} + +.st-product_listtab-btn { + background-color: $background-primary ; + border: 1px solid $background-color; + + &:focus, + &:active { + box-shadow: none; + border: 1px solid $primary-color; + outline: none; + } + &.active{ + border: 1px solid $primary-color; + } +} +.st-productlist-result_top{ + .btn-check:focus, + .btn-check:focus+.btn{ + box-shadow: none; + } +} + diff --git a/theme_shopping/static/src/scss/pages/_selected-product.scss b/theme_shopping/static/src/scss/pages/_selected-product.scss new file mode 100644 index 000000000..b40cfafcd --- /dev/null +++ b/theme_shopping/static/src/scss/pages/_selected-product.scss @@ -0,0 +1,254 @@ +.st-selected_prdt-detail-heading { + font-size: $st-font-size-md; + color: $black-color; + font-weight: 600; +} + +.st-selected_prdt-detail { + margin: 1rem 0; +} + +.st-selected_prdt_sub-text { + color: $font-color; + font-size: $st-font-size-sm; +} + +.st-selected_prdt--price { + font-size: $st-font-size-lg; + color: $primary-color; + font-weight: 700; +} + +.st-selected_prdt-offerprice { + text-decoration: line-through; + color: $font-color; + font-size: $st-font-size-md; + padding: 0 0.4rem; +} + +.st-rating_star { + color: $yellow; + font-size: $st-font-size-sm; +} + +.st-selected_prdt-rating { + font-weight: bold; + font-size: $st-font-size-sm; +} + +.st-selected__rating-count { + padding-left: 0.5rem; + border-left: 1px solid $border-light; +} + +.st-rating_text { + color: $dark-gray; + font-size: $st-font-size-sm; +} + +.st-selected_prdt-rating--container { + padding-bottom: 0.8rem; + border-bottom: 1px solid $border-light; + margin-bottom: 0.8rem; +} + +.st-selected_color--input { + margin: 8px; + height: 13px; + width: 13px; + opacity: 0; +} + +.st-select_prdt-heading { + color: $black-color; + font-size: $st-font-size-base; + font-weight: 600; + margin-top: 1rem; +} + +.st-selected_prdt-group { + display: flex; + gap: 0.8rem; + +} + +.st-selected_prdt--btn { + width: 100%; + font-size: $st-font-size-sm; + border-radius: 4px; + border: 1px solid $black-color; + padding: 0.6rem; + font-weight: 600; +} + +.st-selected_prdt-activebtn { + background-color: $primary-color; + color: $white-color; + border-color: $primary-color; + + &:hover { + color: $white-color; + } +} + +.st-selected_prdct-img { + height: 540px; + + @media (max-width:768px) { + height: auto; + } +} + +.st-selected_prdct--container { + margin: 1rem 0; + display: flex; + gap: 0.4rem; +} + +.st-selected_prdct__choice-container { + width: 135px; + height: 130px; + + @media (max-width:992px) { + width: 90px; + height: 86px; + } + + @media (max-width:768px) { + width: 70px; + height: 64px; + } +} + +.st-selected_prdct--choice { + display: flex; + flex-direction: column; + gap: 0.4rem; +} + +.st-selected_color--label { + + position: relative; + display: inline-block; + border: 5px solid $black-color; + border-radius: 50%; + text-align: center; + transition: background-color 0.05s ease-in-out, border-color 0.05s ease-in-out, box-shadow 0.05s ease-in-out; + + &::before { + + content: ""; + display: block; + position: absolute; + top: -4px; + left: -4px; + bottom: -4px; + right: -4px; + border: 4px solid $background-color; + border-radius: 50%; + box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3); + + } + + &:hover {} +} + +.st-select_prdt-quantity { + display: flex; + margin-bottom: 2rem; + border: 2px solid $border-light; + width: fit-content; +} + +.st-select_quantity-input { + height: auto; + max-width: fit-content; + background-color: transparent; + border: none; + max-width: 5ch; + border-left: 1px solid $border-light; + border-right: 1px solid $border-light; + border-radius: 0px; + + &:focus { + background-color: transparent; + box-shadow: none; + border-left: 1px solid $border-light; + border-right: 1px solid $border-light; + } +} + +.st-select_prdct-info--container { + margin: 2rem 0; +} + +.st-select_prdt-quanity-btn { + font-weight: 700; + border-radius: 0px; + + &:hover { + background-color: $background-primary; + } + + &:focus { + box-shadow: none; + } +} + + +.st-tabs { + border-bottom: 1px solid $border-light; + + .st-select-prdt_tab--link { + color: $font-color; + font-size: $st-font-size-base; + background-color: transparent; + + font-weight: 500; + padding-left: 0px; + padding-right: 1.6rem; + + &:hover { + border: none; + } + + &:focus, + &.active { + background-color: transparent; + color: $black-color; + border: none; + border-bottom: 2px solid $black-color; + } + + @media (max-width:575px) { + padding-right: 1rem; + } + } + + +} + +.st-select_prdt-tab--content { + padding: 1rem 0; + color: $font-color; + max-width: 90%; + line-height: 1.8rem; +} + +.st-share_in-media { + color: $black-color; + padding: 0.2rem; + font-size: $st-font-size-base; + + &:hover { + color: $primary-color; + } +} + +.st-share-media_container { + margin-top: 2rem; + display: flex; + justify-content: end; + width: 100%; + align-items: center; +} \ No newline at end of file diff --git a/theme_shopping/views/about_us_views.xml b/theme_shopping/views/about_us_views.xml new file mode 100644 index 000000000..aa555f983 --- /dev/null +++ b/theme_shopping/views/about_us_views.xml @@ -0,0 +1,150 @@ + + + + + About Us + qweb + /about + + True + theme_shopping.about_us_shopping + + + +
+
+
+
+

+ About Us +

+
+
+
+
+
+
+ +
+
+
+ Start From + Since 1990 + +

Who We + Are +

+

Lorem Ipsum is + simply dummy text of the printing + and typesetting industry. + Lorem Ipsum has been + the industry's standard dummy text + ever since the 1500s, when an + unknown printer took a galley + of type and scrambled it to make a + type specimen book. It has survived + not only five centuries, + but also the leap into electronic + typesetting, remaining essentially + unchanged. It was + popularised in the 1960s with the + release of Letraset sheets + containing Lorem Ipsum passages, + and more recently with desktop + publishing software like Aldus + PageMaker including versions of + Lorem Ipsum. when an unknown printer + took a galley of type and scrambled + it to make a type + specimen book. It has survived not + only five centuries, but also the + leap into electronic + typesetting, remaining essentially + unchanged. +

+
+
+
+

Our + Service +

+
+
+
+ +
+
+ + Free Consulting + +

+ 24 hour coustmer service +

+
+
+
+
+ +
+
+ + Overall Guaranty + +

+ 90% Assured 1 year guaranty +

+
+
+
+
+ +
+
+ + Special Offer + +

+ Special Offer on your + special Occasions +

+
+
+
+
+ +
+
+ + Fast Delivery + +

+ Easy Delivery and Returns +

+
+
+
+
+
+
+
+
+
+
+
+ + + About Us + /about + + 61 + +
diff --git a/theme_shopping/views/add_testimonial.xml b/theme_shopping/views/add_testimonial.xml new file mode 100644 index 000000000..9682ab3d1 --- /dev/null +++ b/theme_shopping/views/add_testimonial.xml @@ -0,0 +1,48 @@ + + + + + add.testimonial.view.form + website.testimonial + +
+ + + + + + + + + + + + + +
+
+ + + + add.testimonial.view.tree + website.testimonial + + + + + + + + + + Add Testimonial + website.testimonial + list,form + + + +
\ No newline at end of file diff --git a/theme_shopping/views/blog_templates.xml b/theme_shopping/views/blog_templates.xml new file mode 100644 index 000000000..41e7a15e0 --- /dev/null +++ b/theme_shopping/views/blog_templates.xml @@ -0,0 +1,18 @@ + + + + diff --git a/theme_shopping/views/footer_templates.xml b/theme_shopping/views/footer_templates.xml new file mode 100644 index 000000000..9abc5c15e --- /dev/null +++ b/theme_shopping/views/footer_templates.xml @@ -0,0 +1,69 @@ + + + + + diff --git a/theme_shopping/views/header_templates.xml b/theme_shopping/views/header_templates.xml new file mode 100644 index 000000000..ec5df74fa --- /dev/null +++ b/theme_shopping/views/header_templates.xml @@ -0,0 +1,148 @@ + + + + + + + + + diff --git a/theme_shopping/views/homepage_snippets.xml b/theme_shopping/views/homepage_snippets.xml new file mode 100644 index 000000000..266669f67 --- /dev/null +++ b/theme_shopping/views/homepage_snippets.xml @@ -0,0 +1,511 @@ + +