| @ -0,0 +1,51 @@ | |||
| .. 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 | |||
| 
 | |||
| Website Product Customization | |||
| ============================= | |||
| This Module allows users to customize the the product they buy from website/shop | |||
| by applying individual designs. | |||
| 
 | |||
| Configuration | |||
| ============= | |||
| * Add appropriate number of designs in the product.design model for the customer | |||
| to choose from the front-end. | |||
| 
 | |||
| License | |||
| ------- | |||
| Affero General Public License v3.0 (AGPL v3) | |||
| (https://www.gnu.org/licenses/agpl-3.0-standalone.html) | |||
| 
 | |||
| Company | |||
| ------- | |||
| * `Cybrosys Techno Solutions <https://cybrosys.com/>`__ | |||
| 
 | |||
| Credits | |||
| ------- | |||
| * Developers: 	(V16)Vivek @ cybrosys, | |||
|                 (V17) Gayathri V, | |||
|                 (V18) Busthana Shirin | |||
| 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 <https://cybrosys.com/>`__ | |||
| 
 | |||
| Further information | |||
| =================== | |||
| HTML Description: `<static/description/index.html>`__ | |||
| @ -0,0 +1,23 @@ | |||
| # -*- coding: utf-8 -*- | |||
| ############################################################################# | |||
| # | |||
| #    Cybrosys Technologies Pvt. Ltd. | |||
| # | |||
| #    Copyright (C) 2024-TODAY Cybrosys Technologies(<https://www.cybrosys.com>). | |||
| #    Author: Cybrosys Techno Solutions(<https://www.cybrosys.com>) | |||
| # | |||
| #    You can modify it under the terms of the GNU 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 <http://www.gnu.org/licenses/>. | |||
| # | |||
| ############################################################################# | |||
| from . import controllers | |||
| from . import models | |||
| @ -0,0 +1,53 @@ | |||
| # -*- coding: utf-8 -*- | |||
| ############################################################################# | |||
| # | |||
| #    Cybrosys Technologies Pvt. Ltd. | |||
| # | |||
| #    Copyright (C) 2024-TODAY Cybrosys Technologies(<https://www.cybrosys.com>). | |||
| #    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 <http://www.gnu.org/licenses/>. | |||
| # | |||
| ############################################################################# | |||
| { | |||
|     'name': 'Website Product Customization', | |||
|     'version': '18.0.1.0.0', | |||
|     'category': 'Website', | |||
|     'summary': 'Customize products from website', | |||
|     'description': 'This module helps to customise the products from website' | |||
|                    'according to the customer wish', | |||
|     'author': 'Cybrosys Techno Solutions', | |||
|     'company': 'Cybrosys Techno Solutions', | |||
|     'maintainer': 'Cybrosys Techno Solutions', | |||
|     'website': "https://www.cybrosys.com", | |||
|     'depends': ['website_sale'], | |||
|     'data': [ | |||
|         'security/ir.model.access.csv', | |||
|         'views/product_design_views.xml', | |||
|         'views/website_sale_templates.xml', | |||
|         'views/sale_order_views.xml', | |||
|     ], | |||
|     'assets': { | |||
|         'web.assets_frontend': [ | |||
|             "/website_product_customization/static/src/css/style.css", | |||
|             "/website_product_customization/static/lib/fabric.js", | |||
|             "/website_product_customization/static/src/js/website_product_custom.js", | |||
|             "/website_product_customization/static/src/js/website_sale.js", | |||
|         ], | |||
|     }, | |||
|     'images': ['static/description/banner.jpg'], | |||
|     'license': 'AGPL-3', | |||
|     'installable': True, | |||
|     'auto_install': False, | |||
|     'application': True, | |||
| } | |||
| @ -0,0 +1,22 @@ | |||
| # -*- coding: utf-8 -*- | |||
| ############################################################################# | |||
| # | |||
| #    Cybrosys Technologies Pvt. Ltd. | |||
| # | |||
| #    Copyright (C) 2024-TODAY Cybrosys Technologies(<https://www.cybrosys.com>). | |||
| #    Author: Cybrosys Techno Solutions(<https://www.cybrosys.com>) | |||
| # | |||
| #    You can modify it under the terms of the GNU 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 <http://www.gnu.org/licenses/>. | |||
| # | |||
| ############################################################################# | |||
| from . import website_product_customization | |||
| @ -0,0 +1,201 @@ | |||
| # -*- coding: utf-8 -*- | |||
| ############################################################################# | |||
| # | |||
| #    Cybrosys Technologies Pvt. Ltd. | |||
| # | |||
| #    Copyright (C) 2024-TODAY Cybrosys Technologies(<https://www.cybrosys.com>). | |||
| #    Author: Cybrosys Techno Solutions(<https://www.cybrosys.com>) | |||
| # | |||
| #    You can modify it under the terms of the GNU 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 <http://www.gnu.org/licenses/>. | |||
| # | |||
| ############################################################################# | |||
| import re | |||
| from odoo import http | |||
| from odoo.http import request | |||
| from odoo.addons.website_sale.controllers.main import WebsiteSale | |||
| from odoo.addons.website_sale.controllers.product_configurator import ( | |||
|     WebsiteSaleProductConfiguratorController, | |||
| ) | |||
| 
 | |||
| 
 | |||
| class WebsiteProductCustomization(WebsiteSale): | |||
|     """ | |||
|     Inheriting 'WebsiteSale' class from 'website_sale.controllers.main' to | |||
|     modify the method 'cart_update_json'. | |||
|     """ | |||
| 
 | |||
|     @http.route() | |||
|     def cart_update_json( | |||
|         self, | |||
|         product_id, | |||
|         design_image=None, | |||
|         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). | |||
|         """ | |||
|         res = super(WebsiteProductCustomization, self).cart_update_json( | |||
|             product_id=product_id, | |||
|             design_image=design_image, | |||
|             line_id=line_id, | |||
|             add_qty=add_qty, | |||
|             set_qty=set_qty, | |||
|             display=display, | |||
|             product_custom_attribute_values=product_custom_attribute_values, | |||
|             no_variant_attribute_values=no_variant_attribute_values, | |||
|             **kw | |||
|         ) | |||
|         order = request.website.sale_get_order(force_create=True) | |||
|         if design_image: | |||
|             for record in order.order_line: | |||
|                 if record.id == res["line_id"]: | |||
|                     record.product_design = str( | |||
|                         re.sub("^data:image\/\w+;base64,", "", design_image), | |||
|                     ) | |||
|                     record.is_customized_product = True | |||
|         else: | |||
|             if not order.order_line.browse(res["line_id"]).product_design: | |||
|                 order.order_line.browse(res["line_id"]).product_design = ( | |||
|                     request.env["product.product"].sudo().browse(product_id).image_1920 | |||
|                 ) | |||
|         request.session["website_sale_cart_quantity"] = order.cart_quantity | |||
|         return res | |||
| 
 | |||
| 
 | |||
| class WebsiteSaleStockProductConfiguratorController( | |||
|         WebsiteSaleProductConfiguratorController): | |||
| 
 | |||
|     """ | |||
|     Inheriting 'WebsiteSale' class from to modify the method | |||
|     'cart_options_update_json'. | |||
|     """ | |||
| 
 | |||
|     @http.route() | |||
|     def website_sale_product_configurator_update_cart( | |||
|             self, main_product, optional_products, **kwargs | |||
|     ): | |||
|         """ Add the provided main and optional products to the cart. | |||
| 
 | |||
|         Main and optional products have the following shape: | |||
|         ``` | |||
|         { | |||
|             'product_id': int, | |||
|             'product_template_id': int, | |||
|             'parent_product_template_id': int, | |||
|             'quantity': float, | |||
|             'product_custom_attribute_values': list(dict), | |||
|             'no_variant_attribute_value_ids': list(int), | |||
|         } | |||
|         ``` | |||
| 
 | |||
|         Note: if product A is a parent of product B, then product A must come before product B in | |||
|         the optional_products list. Otherwise, the corresponding order lines won't be linked. | |||
| 
 | |||
|         :param dict main_product: The main product to add. | |||
|         :param list(dict) optional_products: The optional products to add. | |||
|         :param dict kwargs: Locally unused data passed to `_cart_update`. | |||
|         :rtype: dict | |||
|         :return: A dict containing information about the cart update. | |||
|         """ | |||
|         order_sudo = request.website.sale_get_order(force_create=True) | |||
|         if order_sudo.state != 'draft': | |||
|             request.session['sale_order_id'] = None | |||
|             order_sudo = request.website.sale_get_order(force_create=True) | |||
| 
 | |||
|         # The main product could theoretically have a parent, but we ignore it to avoid | |||
|         # circularities in the linked line ids. | |||
| 
 | |||
|         design_image = ( | |||
|             main_product[ | |||
|                 "design_image"] if "design_image" in main_product else None | |||
|         ) | |||
| 
 | |||
|         values = order_sudo._cart_update( | |||
|             product_id=main_product['product_id'], | |||
|             add_qty=main_product['quantity'], | |||
|             product_custom_attribute_values=main_product[ | |||
|                 'product_custom_attribute_values'], | |||
|             no_variant_attribute_value_ids=[ | |||
|                 int(value_id) for value_id in | |||
|                 main_product['no_variant_attribute_value_ids'] | |||
|             ], | |||
|             design_image=design_image, | |||
|             **kwargs, | |||
|         ) | |||
|         line_ids = {main_product['product_template_id']: values['line_id']} | |||
| 
 | |||
|         if optional_products and values['line_id']: | |||
|             for option in optional_products: | |||
|                 option_values = order_sudo._cart_update( | |||
|                     product_id=option['product_id'], | |||
|                     add_qty=option['quantity'], | |||
|                     product_custom_attribute_values=option[ | |||
|                         'product_custom_attribute_values'], | |||
|                     no_variant_attribute_value_ids=[ | |||
|                         int(value_id) for value_id in | |||
|                         option['no_variant_attribute_value_ids'] | |||
|                     ], | |||
|                     # Using `line_ids[...]` instead of `line_ids.get(...)` ensures that this throws | |||
|                     # if an optional product contains bad data. | |||
|                     linked_line_id=line_ids[ | |||
|                         option['parent_product_template_id']], | |||
|                     design_image=design_image, | |||
|                     **kwargs, | |||
|                 ) | |||
|                 line_ids[option['product_template_id']] = option_values[ | |||
|                     'line_id'] | |||
|                 for record in order_sudo.order_line: | |||
|                     if record.id == option_values["line_id"]: | |||
|                         record.product_design = ( | |||
|                             request.env["product.product"] | |||
|                             .sudo() | |||
|                             .browse(option["product_id"]) | |||
|                             .image_1920 | |||
|                         ) | |||
|         if design_image: | |||
|             for record in order_sudo.order_line: | |||
|                 if record.id == values["line_id"]: | |||
|                     record.product_design = str( | |||
|                         re.sub( | |||
|                             "^data:image\/\w+;base64,", | |||
|                             "", | |||
|                             main_product["design_image"], | |||
|                         ), | |||
|                     ) | |||
|                     record.is_customized_product = True | |||
|         else: | |||
|             if not order_sudo.order_line.browse(values["line_id"]).product_design: | |||
|                 order_sudo.order_line.browse(values["line_id"]).product_design = ( | |||
|                     request.env["product.product"] | |||
|                     .sudo() | |||
|                     .browse(main_product["product_id"]) | |||
|                     .image_1920 | |||
|                 ) | |||
| 
 | |||
|         values['notification_info'] = self._get_cart_notification_information( | |||
|             order_sudo, line_ids.values() | |||
|         ) | |||
|         values['cart_quantity'] = order_sudo.cart_quantity | |||
|         request.session['website_sale_cart_quantity'] = order_sudo.cart_quantity | |||
| 
 | |||
|         return values | |||
| @ -0,0 +1,5 @@ | |||
| ## Module <website_product_customization> | |||
| #### 27.11.2024 | |||
| #### Version 18.0.1.0.0 | |||
| #### ADD | |||
| - Initial Commit for Website Product Customization. | |||
| @ -0,0 +1,24 @@ | |||
| # -*- coding: utf-8 -*- | |||
| ############################################################################# | |||
| # | |||
| #    Cybrosys Technologies Pvt. Ltd. | |||
| # | |||
| #    Copyright (C) 2024-TODAY Cybrosys Technologies(<https://www.cybrosys.com>). | |||
| #    Author: Cybrosys Techno Solutions(<https://www.cybrosys.com>) | |||
| # | |||
| #    You can modify it under the terms of the GNU 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 <http://www.gnu.org/licenses/>. | |||
| # | |||
| ############################################################################# | |||
| from . import product_design | |||
| from . import sale_order_line | |||
| from . import sale_order | |||
| @ -0,0 +1,35 @@ | |||
| # -*- coding: utf-8 -*- | |||
| ############################################################################# | |||
| # | |||
| #    Cybrosys Technologies Pvt. Ltd. | |||
| # | |||
| #    Copyright (C) 2024-TODAY Cybrosys Technologies(<https://www.cybrosys.com>). | |||
| #    Author: Cybrosys Techno Solutions(<https://www.cybrosys.com>) | |||
| # | |||
| #    You can modify it under the terms of the GNU 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 <http://www.gnu.org/licenses/>. | |||
| # | |||
| ############################################################################# | |||
| from odoo import fields, models | |||
| 
 | |||
| 
 | |||
| class ProductDesign(models.Model): | |||
|     """ | |||
|     Creating the product.design model to add product designs in the back-end | |||
|     """ | |||
|     _name = 'product.design' | |||
|     _description = "Product Design" | |||
| 
 | |||
|     name = fields.Char(string='Product Customization', | |||
|                        help="Name field for product design") | |||
|     product_design = fields.Image(string='Design', | |||
|                                   help="Binary field for adding product design") | |||
| @ -0,0 +1,58 @@ | |||
| # -*- coding: utf-8 -*- | |||
| ############################################################################# | |||
| # | |||
| #    Cybrosys Technologies Pvt. Ltd. | |||
| # | |||
| #    Copyright (C) 2024-TODAY Cybrosys Technologies(<https://www.cybrosys.com>). | |||
| #    Author: Cybrosys Techno Solutions(<https://www.cybrosys.com>) | |||
| # | |||
| #    You can modify it under the terms of the GNU 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 <http://www.gnu.org/licenses/>. | |||
| # | |||
| ############################################################################# | |||
| from odoo import models | |||
| 
 | |||
| 
 | |||
| class SaleOrder(models.Model): | |||
|     """Inherited the class sale.order to match the order line.""" | |||
|     _inherit = "sale.order" | |||
| 
 | |||
|     def _cart_find_product_line(self, product_id, line_id=None, **kwargs): | |||
|         """Find the cart line matching the given parameters. | |||
| 
 | |||
|         If a product_id is given, the line will match the product only if the | |||
|         line also has the same special attributes: `no_variant` attributes and | |||
|         `is_custom` values. | |||
|         """ | |||
|         self.ensure_one() | |||
|         SaleOrderLine = self.env["sale.order.line"] | |||
|         if not self.order_line: | |||
|             return SaleOrderLine | |||
|         product = self.env["product.product"].browse(product_id) | |||
|         if not line_id and ( | |||
|             product.product_tmpl_id.has_dynamic_attributes() | |||
|             or product.product_tmpl_id._has_no_variant_attributes() | |||
|         ): | |||
|             return SaleOrderLine | |||
|         design_image = kwargs.get("design_image", False) | |||
|         if design_image: | |||
|             return SaleOrderLine | |||
|         else: | |||
|             domain = [("order_id", "=", self.id), ("product_id", "=", product_id)] | |||
|             if line_id: | |||
|                 domain += [("id", "=", line_id)] | |||
|             else: | |||
|                 domain += [ | |||
|                     ("product_custom_attribute_value_ids", "=", False), | |||
|                     ("is_customized_product", "=", False), | |||
|                 ] | |||
|         return SaleOrderLine.search(domain) | |||
| @ -0,0 +1,36 @@ | |||
| # -*- coding: utf-8 -*- | |||
| ############################################################################# | |||
| # | |||
| #    Cybrosys Technologies Pvt. Ltd. | |||
| # | |||
| #    Copyright (C) 2024-TODAY Cybrosys Technologies(<https://www.cybrosys.com>). | |||
| #    Author: Cybrosys Techno Solutions(<https://www.cybrosys.com>) | |||
| # | |||
| #    You can modify it under the terms of the GNU 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 <http://www.gnu.org/licenses/>. | |||
| # | |||
| ############################################################################# | |||
| from odoo import fields, models | |||
| 
 | |||
| 
 | |||
| class SaleOrderLine(models.Model): | |||
|     """ | |||
|     Inheriting the 'sale.order.line' model add the product_design field | |||
|     """ | |||
|     _inherit = 'sale.order.line' | |||
| 
 | |||
|     product_design = fields.Binary(string="Product Design", | |||
|                                    help="Binary field to show product design") | |||
|     is_customized_product = fields.Boolean(string="Customized Product" | |||
|                                                   "product", | |||
|                                            help="Is it is a customized product" | |||
|                                                 " or not", default=False) | |||
| 
 | 
| After Width: | Height: | Size: 1.1 KiB | 
| After Width: | Height: | Size: 210 KiB | 
| After Width: | Height: | Size: 209 KiB | 
| After Width: | Height: | Size: 109 KiB | 
| After Width: | Height: | Size: 495 B | 
| After Width: | Height: | Size: 1.0 KiB | 
| After Width: | Height: | Size: 624 B | 
| After Width: | Height: | Size: 136 KiB | 
| After Width: | Height: | Size: 214 KiB | 
| After Width: | Height: | Size: 36 KiB | 
| After Width: | Height: | Size: 3.6 KiB | 
| After Width: | Height: | Size: 310 B | 
| After Width: | Height: | Size: 929 B | 
| After Width: | Height: | Size: 1.3 KiB | 
| After Width: | Height: | Size: 3.3 KiB | 
| After Width: | Height: | Size: 1.4 KiB | 
| After Width: | Height: | Size: 17 KiB | 
| After Width: | Height: | Size: 542 B | 
| After Width: | Height: | Size: 576 B | 
| After Width: | Height: | Size: 733 B | 
| After Width: | Height: | Size: 4.3 KiB | 
| After Width: | Height: | Size: 1.2 KiB | 
| After Width: | Height: | Size: 4.0 KiB | 
| After Width: | Height: | Size: 1.7 KiB | 
| After Width: | Height: | Size: 738 KiB | 
| After Width: | Height: | Size: 2.2 KiB | 
| After Width: | Height: | Size: 911 B | 
| After Width: | Height: | Size: 1.1 KiB | 
| After Width: | Height: | Size: 1.2 KiB | 
| After Width: | Height: | Size: 1.2 KiB | 
| After Width: | Height: | Size: 600 B | 
| After Width: | Height: | Size: 673 B | 
| After Width: | Height: | Size: 2.0 KiB | 
| After Width: | Height: | Size: 462 B | 
| After Width: | Height: | Size: 2.1 KiB | 
| After Width: | Height: | Size: 926 B | 
| After Width: | Height: | Size: 9.0 KiB | 
| After Width: | Height: | Size: 23 KiB | 
| After Width: | Height: | Size: 7.0 KiB | 
| After Width: | Height: | Size: 878 B | 
| After Width: | Height: | Size: 1.2 KiB | 
| After Width: | Height: | Size: 653 B | 
| After Width: | Height: | Size: 800 B | 
| After Width: | Height: | Size: 905 B | 
| After Width: | Height: | Size: 189 KiB | 
| After Width: | Height: | Size: 4.3 KiB | 
| After Width: | Height: | Size: 839 B | 
| After Width: | Height: | Size: 1.7 KiB | 
| After Width: | Height: | Size: 5.9 KiB | 
| After Width: | Height: | Size: 1.6 KiB | 
| After Width: | Height: | Size: 34 KiB | 
| After Width: | Height: | Size: 26 KiB | 
| After Width: | Height: | Size: 3.8 KiB | 
| After Width: | Height: | Size: 23 KiB | 
| After Width: | Height: | Size: 1.9 KiB | 
| After Width: | Height: | Size: 2.3 KiB | 
| After Width: | Height: | Size: 427 B | 
| After Width: | Height: | Size: 627 B | 
| After Width: | Height: | Size: 1.1 KiB | 
| After Width: | Height: | Size: 1.2 KiB | 
| After Width: | Height: | Size: 988 B | 
| After Width: | Height: | Size: 3.7 KiB | 
| After Width: | Height: | Size: 5.0 KiB | 
| After Width: | Height: | Size: 875 B | 
| After Width: | Height: | Size: 1.2 KiB | 
| After Width: | Height: | Size: 912 KiB | 
| After Width: | Height: | Size: 1.3 MiB | 
| After Width: | Height: | Size: 46 KiB | 
| After Width: | Height: | Size: 44 KiB | 
| After Width: | Height: | Size: 46 KiB | 
| After Width: | Height: | Size: 85 KiB | 
| After Width: | Height: | Size: 42 KiB | 
| After Width: | Height: | Size: 168 KiB | 
| After Width: | Height: | Size: 119 KiB | 
| After Width: | Height: | Size: 140 KiB | 
| After Width: | Height: | Size: 173 KiB | 
| After Width: | Height: | Size: 192 KiB | 
| After Width: | Height: | Size: 193 KiB | 
| After Width: | Height: | Size: 239 KiB | 
| After Width: | Height: | Size: 36 KiB | 
| After Width: | Height: | Size: 190 KiB | 
| After Width: | Height: | Size: 122 KiB | 
| After Width: | Height: | Size: 143 KiB | 
| After Width: | Height: | Size: 153 KiB | 
| After Width: | Height: | Size: 202 KiB | 
| After Width: | Height: | Size: 167 KiB | 
| After Width: | Height: | Size: 758 KiB | 
| After Width: | Height: | Size: 37 KiB | 
| @ -0,0 +1,919 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
|     <meta charset="UTF-8"/> | |||
|     <meta name="viewport" content="width=device-width, initial-scale=1.0"/> | |||
|     <title>Website Product Customization</title> | |||
|     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" | |||
|           rel="stylesheet"/> | |||
|     <link rel="preconnect" href="https://fonts.googleapis.com"> | |||
|     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> | |||
|     <link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap" | |||
|           rel="stylesheet"> | |||
|     <link rel="stylesheet" | |||
|           href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css"/> | |||
|     <link rel="stylesheet" | |||
|           href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css"/> | |||
|     <style> | |||
|         :root { | |||
|             --primary-color: #7f54b3; | |||
|             --bg-white: #fff; | |||
|             --text-color: #121212; | |||
|             --text-color-light: #64728f; | |||
|         } | |||
| 
 | |||
|         body { | |||
|             font-family: "Montserrat", sans-serif; | |||
|         } | |||
| 
 | |||
|         .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { | |||
|             color: #121212; | |||
|             font-family: Montserrat; | |||
|             font-size: 16px !important; | |||
|             font-weight: 500 !important; | |||
|             border-radius: 30px; | |||
|             line-height: normal; | |||
|             text-transform: capitalize; | |||
|             background-color: #F5F5F5; | |||
|             border: none; | |||
|             margin-bottom: 0; | |||
|             padding: 12px 24px; | |||
|         } | |||
| 
 | |||
|         .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { | |||
|             border-color: transparent; | |||
|             isolation: isolate; | |||
|         } | |||
| 
 | |||
|         .nav-tabs .nav-link:focus-visible { | |||
|             border-color: transparent; | |||
|             box-shadow: none; | |||
|         } | |||
| 
 | |||
|         /* owl-carosel */ | |||
|         .owl-carousel .owl-nav { | |||
|             position: absolute; | |||
|             top: 42%; | |||
|             width: 100%; | |||
|             display: flex; | |||
|             justify-content: space-between; | |||
|             transform: translateY(-42%); | |||
|         } | |||
| 
 | |||
|         .owl-carousel .owl-nav button.owl-prev { | |||
|             position: absolute; | |||
|             right: -36px; | |||
|             font-size: 28px; | |||
|             background-color: #e4e4e4; | |||
|             border-radius: 20px; | |||
|             width: 40px; | |||
|             height: 40px; | |||
|             display: flex; | |||
|             justify-content: center; | |||
|             align-items: center; | |||
|         } | |||
| 
 | |||
|         .owl-carousel .owl-nav button.owl-next { | |||
|             position: absolute; | |||
|             left: -36px; | |||
|             font-size: 28px; | |||
|             background-color: #e4e4e4; | |||
|             border-radius: 20px; | |||
|             width: 40px; | |||
|             height: 40px; | |||
|             display: flex; | |||
|             justify-content: center; | |||
|             align-items: center; | |||
| 
 | |||
|         } | |||
| 
 | |||
|     </style> | |||
| </head> | |||
| <body> | |||
| <!-- overview --> | |||
| <div class="container"> | |||
|     <div class="my-5"> | |||
|         <!-- button tab --> | |||
|         <!--  --> | |||
|         <!-- version support --> | |||
|         <div class="my-3 d-flex align-items-center justify-content-end"> | |||
|             <div class="text-center" | |||
|                  style="background-color:#017E84 !important; font-size:0.8rem !important; color:#fff !important; font-weight:500 !important; padding:4px !important; margin:0 3px !important; border-radius:50px !important; min-width:120px !important"> | |||
|                 Community | |||
|             </div> | |||
|             <div class="text-center" | |||
|                  style="background-color:#875A7B !important; color:#fff !important; font-size:0.8rem !important; font-weight:500 !important; padding:4px !important; margin:0 3px !important; border-radius:50px !important; min-width:120px !important"> | |||
|                 Enterprise | |||
|             </div> | |||
|         </div> | |||
|         <div class="tab-content" id="myTabContent"> | |||
|             <!-- description --> | |||
|             <div class="tab-pane fade show active" id="home" role="tabpanel" | |||
|                  aria-labelledby="home-tab"> | |||
|                 <div class="position-relative" | |||
|                      style="border-radius: 16px; background: #f8f8f8; padding: 20px 0;"> | |||
|                     <div class="row " style=" | |||
|           padding: 2rem 0rem 0 !important; | |||
|         "> | |||
|                         <div class="col-lg-8 mx-auto gap-4 d-flex flex-column align-items-center"> | |||
|                             <p class="my-1 text-center text-uppercase" | |||
|                                style=" | |||
|               letter-spacing: 4px !important; | |||
|               color: #7f54b3; | |||
|               font-weight: bold; | |||
|               text-align: center; | |||
|               font-size: 14px; | |||
|               font-weight: 600; | |||
|               line-height: 15.96px; | |||
|               text-transform: uppercase; | |||
|             "> | |||
|                                 Customize Product Design From Website. | |||
|                             </p> | |||
|                             <h1 class="text-center text-uppercase my-0" | |||
|                                 style=" | |||
|               color: #121212; | |||
|               font-size: 46px; | |||
|               font-weight: 700; | |||
|               line-height: normal; | |||
|             ">Website Product Customization | |||
|                             </h1> | |||
|                         </div> | |||
|                         <div class="col-lg-12 d-flex justify-content-center align-items-center" | |||
|                              style="margin: 3rem 0;"> | |||
|                             <img src="./assets/icons/brand-pair.svg" | |||
|                                  width="100%" | |||
|                                  height="auto" | |||
|                                  style="width: 50%" | |||
|                                  class="img-responsive"/> | |||
|                         </div> | |||
|                         <div class="col-md-12 text-center"> | |||
|                             <a href="mailto:odoo@cybrosys.com" | |||
|                                target="_blank" | |||
|                                style="background-color: transparent;border-radius: 35px; | |||
|               font-family: Montserrat; | |||
|               display: inline-block; | |||
|               padding: 7px 33px; | |||
|               border: 1px solid #7f54b3; | |||
|               color: #7f54b3; | |||
|               text-decoration: none; | |||
|             " | |||
|                                class="mx-1 mb-2 deep-1 deep_hover"> | |||
|                                 <img class="img" | |||
|                                      style="width: 24px" | |||
|                                      src="./assets/icons/mail.svg"/> | |||
|                                 <span class="pl-2" | |||
|                                       style=" font-size: 16px; vertical-align: middle" | |||
|                                 >Email Us</span | |||
|                                 > | |||
|                             </a> | |||
|                             <a href="skype:cybroopenerp?chat" | |||
|                                target="_blank" | |||
|                                style=" | |||
|               background-color: #7f289b; | |||
|               font-family: Montserrat; | |||
|               display: inline-block; | |||
|               padding: 7px 33px; | |||
|               border: 1px solid #7f289b; | |||
|               border-radius: 35px; | |||
|               text-decoration: none; | |||
|             " | |||
|                                class="mx-1 mb-2 deep-1 deep_hover"> | |||
|                                 <img | |||
|                                         class="img" | |||
|                                         style="width: 24px" | |||
|                                         src="./assets/icons/skype-fill.svg" | |||
|                                 /> | |||
|                                 <span | |||
|                                         class="pl-2" | |||
|                                         style="color: #fff; font-size: 16px; vertical-align: middle" | |||
|                                 >Skype Us</span | |||
|                                 > | |||
|                             </a> | |||
|                         </div> | |||
|                         <div class="d-flex justify-content-center mt-2"> | |||
|                             <img src="./assets/screenshots/hero.gif" | |||
|                                  class="w-100" | |||
|                                  style="z-index: 3; height: auto;"> | |||
|                         </div> | |||
|                     </div> | |||
|                     <div class="position-absolute bottom-0" | |||
|                          style="z-index: 1; width: 100%;"> | |||
|                         <img src="./assets/icons/banner-bg.svg" | |||
|                              class="img-fluid w-100"> | |||
|                     </div> | |||
|                     <div class="position-absolute bottom-0 end-0" | |||
|                          style=" z-index: 2;"> | |||
|                         <img src="./assets/icons/patter.svg"> | |||
|                     </div> | |||
|                 </div> | |||
| <!--                <section class="oe_container pb-5">--> | |||
| <!--                    <div class="mt64 mb64">--> | |||
| <!--                        <div class="col-sm-12 py-4">--> | |||
| 
 | |||
| <!--                            <div class="alert alert-primary mt-4"--> | |||
| <!--                                 style="color: #000;background-color: #f8f8f8;border: 1px solid #dcdcdc;border-radius: 16px;">--> | |||
| <!--                                <hr style="color: #888;">--> | |||
| <!--                                This module uses some external python dependencies :--> | |||
| <!--                                dropbox, nextcloud , nextcloud-api-wrapper , boto3 and paramiko. Before--> | |||
| <!--                                installing the module install the python--> | |||
| <!--                                package--> | |||
| <!--                                first. The required python packages can be installed using the--> | |||
| <!--                                following commands.--> | |||
| <!--                                <br>--> | |||
| <!--                                <code class="d-block mt-2"--> | |||
| <!--                                      style="background-color:#4e4e4e;color: #fff; border-radius: 5px; padding: 6px 8px;">pip--> | |||
| <!--                                    install dropbox</code>--> | |||
| <!--                                <code class="d-block mt-2"--> | |||
| <!--                                      style="background-color:#4e4e4e;color: #fff;padding: 6px 8px; border-radius: 5px;">pip--> | |||
| <!--                                    install nextcloud</code>--> | |||
| <!--                                <code class="d-block mt-2"--> | |||
| <!--                                      style="background-color:#4e4e4e;color: #fff;padding: 6px 8px; border-radius: 5px;">pip--> | |||
| <!--                                    install nextcloud-api-wrapper</code>--> | |||
| <!--                                <code class="d-block mt-2"--> | |||
| <!--                                      style="background-color:#4e4e4e;color: #fff;padding: 6px 8px; border-radius: 5px;">pip--> | |||
| <!--                                    install boto3</code>--> | |||
| <!--                                <code class="d-block mt-2"--> | |||
| <!--                                      style="background-color:#4e4e4e;color: #fff;padding: 6px 8px; border-radius: 5px;">pip--> | |||
| <!--                                    install paramiko</code>--> | |||
| <!--                            </div>--> | |||
| <!--                        </div>--> | |||
| <!--                    </div>--> | |||
| <!--                </section>--> | |||
|                 <!-- key-highlight --> | |||
|                 <div class="" style="border-radius: 16px; | |||
|      padding: 60px 40px; | |||
|      border: 1px solid #EBEEF2; | |||
|      background: #F5F5F7; | |||
|      box-shadow: 0px 5px 20px -11px rgba(0, 0, 0, 0.25); "> | |||
|                     <div class="row"> | |||
|                         <div class="col-lg-12 d-flex flex-column justify-content-center align-items-center"> | |||
|                             <h2 style=" color: #121212; | |||
|             text-align: center; | |||
|             font-size: 40px; | |||
|             font-weight: 700; | |||
|             text-transform: uppercase; padding-bottom: 50px;">Key | |||
|                                 Highlights</h2> | |||
|                         </div> | |||
|                         <div class="col-lg-4"> | |||
|                             <div class="mb-4 d-flex flex-column justify-content-center gap-3" | |||
|                                  style="border-radius: 12px; border: 1px solid  #B6BCCD; | |||
|             background:  #FFF;padding:32px "> | |||
|                                 <div class="d-flex justify-content-center align-items-center" | |||
|                                      style="background-color:#7847D9 !important; border-radius:8px !important; height:42px; width:42px"> | |||
|                                     <img src="./assets/icons/feature-icon.svg" | |||
|                                          class="img-responsive" height="26px" | |||
|                                          width="26px"> | |||
|                                 </div> | |||
|                                 <p class="m-0" | |||
|                                    style="font-size:0.9rem; color:#64728f; font-size: 16px; font-weight: 400;"> | |||
|                                      Create customized designs.</p> | |||
|                             </div> | |||
|                         </div> | |||
|                         <div class="col-lg-4"> | |||
|                             <div class="mb-4 d-flex flex-column justify-content-center gap-3" | |||
|                                  style="border-radius: 12px; | |||
|           border: 1px solid  #B6BCCD; | |||
|           background:  #FFF;padding:32px "> | |||
|                                 <div class="d-flex justify-content-center align-items-center" | |||
|                                      style="background-color:#7847D9 !important; border-radius:8px !important; height:42px; width:42px"> | |||
|                                     <img src="./assets/icons/feature-icon.svg" | |||
|                                          class="img-responsive" height="26px" | |||
|                                          width="26px"> | |||
|                                 </div> | |||
|                                 <p class="m-0" | |||
|                                    style="font-size:0.9rem; color:#64728f; font-size: 16px; font-weight: 400;"> | |||
|                                     Allows users to customize products by choosing | |||
|                                 the designs from front-end. | |||
|                                 </p> | |||
|                             </div> | |||
|                         </div> | |||
|                     </div> | |||
|                 </div> | |||
|                 <!--code  --> | |||
|                 <div class="my-5"> | |||
|                     <div class="position-relative" style=" padding: 5rem 4rem 5rem 4rem; background-color: #0A1425; border-radius: 12px;"> | |||
|                         <div class="d-flex flex-column gap-4"> | |||
|                             <span class="wrapper-subtitle" | |||
|                                   style="font-size: 40px; font-weight: 700; color: #fff;line-height: 60px; text-transform: capitalize; width: 450px;  font-family: Montserrat;">Website Product Customization</span> | |||
|                             <h3 class="wrapper-details" | |||
|                                 style="font-size: 20px; font-weight: 400; color: #fff; line-height: 32px;  "> | |||
|                                 Are you ready to make your business more | |||
|                                 organized? | |||
|                                 <br> Improve now! | |||
|                             </h3> | |||
|                             <div class="d-flex gap-3"> | |||
|                                 <a href="mailto:odoo@cybrosys.com" | |||
|                                    class="shop-btn" style="cursor: pointer; border-radius: 16px; display: flex; justify-content: center; align-items: center; gap: 7px; | |||
|             border: 1px solid  #ffffff33; | |||
|             background-color: #ffffff14; | |||
|             backdrop-filter: blur(10px); color: #fff; padding: 12px 16px 12px 16px; text-decoration: none;"> | |||
|              <span style="border-radius: 12px; | |||
|              background-color: #ffffff1a; | |||
|              backdrop-filter: blur(6px);padding: 12px;  "> | |||
|               <img src="./assets/icons/banner-mail.svg"> | |||
|            </span> | |||
|                                     <span style="font-weight: 500;font-family: Montserrat;">odoo@cybrosys.com</span> | |||
|                                 </a> | |||
|                                 <a href="tel:+91 9074270811" class="shop-btn" | |||
|                                    style="cursor: pointer; border-radius: 16px; display: flex; justify-content: center; align-items: center; gap: 7px; | |||
|              border: 1px solid  #ffffff33; | |||
|              background-color: #ffffff14; | |||
|             backdrop-filter: blur(10px); color: #fff; padding: 12px 22px 12px 18px; text-decoration: none;"> | |||
|              <span style="border-radius: 12px; | |||
|              background-color: #ffffff1a; | |||
|              backdrop-filter: blur(6px);padding: 12px;"> | |||
|               <img src="./assets/icons/banner-call.svg"> | |||
|            </span> | |||
|                                     <span style="font-weight: 500;font-family: Montserrat;">+91 9074270811</span> | |||
|                                 </a> | |||
|                             </div> | |||
|                         </div> | |||
|                         <div class="position-absolute bottom-0 end-0"> | |||
|                             <img src="./assets/icons/banner-pattern.svg" | |||
|                                  style="width: 540px;"> | |||
|                         </div> | |||
|                     </div> | |||
|                 </div> | |||
|                 <!-- end-code --> | |||
|                 <!--  --> | |||
|                 <!-- screenshot and other --> | |||
| 
 | |||
|                 <div class="mb-4 bg-white" | |||
|                      style=" border: 1px solid #EBEEF2; border-radius: 6px; box-shadow: 0px 8px 20px -4px rgba(0, 0, 0, 0.10); border: 1px solid #EBEEF2;"> | |||
|                     <div> | |||
|                         <ul class="nav nav-tabs justify-content-center bg-white py-2" | |||
|                             id="myTab" role="tablist" | |||
|                             style="border-radius: 6px 6px 0 0;"> | |||
|                             <li class="nav-item"> | |||
|                                 <a aria-controls="overview" | |||
|                                    aria-bs-selected="true" | |||
|                                    class="nav-link active" data-bs-toggle="tab" | |||
|                                    href="#overview" id="overview-tab" role="tab" | |||
|                                    style="color:#121212; font-weight:500; font-size:16px"> | |||
|                                     Screenshots</a> | |||
|                             </li> | |||
|                             <li class="nav-item"> | |||
|                                 <a aria-controls="feature" | |||
|                                    aria-bs-selected="false" | |||
|                                    class="nav-link py-2" data-bs-toggle="tab" | |||
|                                    href="#feature" id="feature-tab" role="tab" | |||
|                                    style="color:#121212; font-weight:500; font-size:16px">Features</a> | |||
|                             </li> | |||
|                             <li class="nav-item"> | |||
|                                 <a aria-controls="releases" | |||
|                                    aria-bs-selected="false" class="nav-link" | |||
|                                    data-bs-toggle="tab" href="#releases" | |||
|                                    id="releases-tab" role="tab" | |||
|                                    style="color:#121212; font-weight:500; font-size:16px">Releases</a> | |||
|                             </li> | |||
|                         </ul> | |||
|                     </div> | |||
|                     <div class="tab-content p-md-5 p-2 py-3" id="myTabContent"> | |||
|                         <div aria-labelledby="overview-tab" | |||
|                              class="tab-pane fade show active" id="overview" | |||
|                              role="tabpanel"> | |||
|                             <div class="position-relative mb-4" | |||
|                                  style="border-radius:10px"> | |||
|                                 <img alt="acc_bg" | |||
|                                      class="w-100 h-100 position-absolute img-fluid left_0" | |||
|                                      loading="lazy" | |||
|                                      src="//apps.odoocdn.com/apps/assets/17.0/ks_dashboard_ninja/ai-img/o3.png?007008f" | |||
|                                      style=""> | |||
|                             </div> | |||
|                             <!-- screenshots section--> | |||
|                             <div class="position-relative mb-4" | |||
|                                  style="border-radius:10px; background-color:#f4f4f4"> | |||
|                                 <div class="p-md-5 p-3 position-relative"> | |||
|                                     <div class="row"> | |||
|                                         <div class="col-md-12"> | |||
|                                             <h1 style="font-weight:bold; font-size:calc(1.1rem + 1vw); line-height:120%; text-align:center; text-transform:capitalize; font-size: 40px; | |||
|                               font-weight: 700;"> | |||
|                                                 <span style="color:#121212; font-size:calc(1.1rem + 1vw)">Create designs in the back-end</span> | |||
|                                             </h1> | |||
|                                         </div> | |||
|                                         <div class="col-md-12 mb-4"> | |||
|                                             <p style="font-weight:400; font-size:16px; line-height:150%; text-align:center;  color:#64728f"> | |||
|                                                 For the design to be available to the | |||
|                                     front-end customer, create the designs in | |||
|                                     the backend first. | |||
|                                             </p> | |||
|                                         </div> | |||
|                                         <div class="col-md-12 text-center"> | |||
|                                             <div class="d-inline-block p-3 shadow-sm" | |||
|                                                  style="background-color:#fff; border-radius:10px"> | |||
|                                                 <img alt="" class="img-fluid" | |||
|                                                      loading="lazy" | |||
|                                                      src="./assets/screenshots/web1.png" | |||
|                                                      style="min-height: 1px;"> | |||
|                                             </div> | |||
|                                         </div> | |||
|                                     </div> | |||
|                                 </div> | |||
|                             </div> | |||
|                             <div class="position-relative mb-4" | |||
|                                  style="border-radius:10px; background-color:#f4f4f4"> | |||
|                                 <div class="p-md-5 p-3 position-relative"> | |||
|                                     <div class="row"> | |||
|                                         <div class="col-md-12"> | |||
|                                             <h1 style="font-weight:bold; font-size:calc(1.1rem + 1vw); line-height:120%; text-align:center; text-transform:capitalize; font-size: 40px; | |||
|                               font-weight: 700;"> | |||
|                                       <span style="color:#121212; font-size:calc(1.1rem + 1vw)">Click on the 'CUSTOMIZE PRODUCT' | |||
|                                     button. | |||
|                                       </span> | |||
|                                             </h1> | |||
|                                         </div> | |||
|                                         <div class="col-md-12 mb-4"> | |||
|                                             <p style="font-weight:400; font-size:16px; line-height:150%; text-align:center;  color:#64728f"> | |||
|                                                 Click on the 'CUSTOMIZE PRODUCT' button to | |||
|                                     customize the design of the product. | |||
|                                             </p> | |||
|                                         </div> | |||
|                                         <div class="col-md-12 text-center"> | |||
|                                             <div class="d-inline-block p-3 shadow-sm" | |||
|                                                  style="background-color:#fff; border-radius:10px"> | |||
|                                                 <img alt="" class="img-fluid" | |||
|                                                      loading="lazy" | |||
|                                                      src="./assets/screenshots/web2.png" | |||
|                                                      style="min-height: 1px;"> | |||
|                                             </div> | |||
|                                         </div> | |||
|                                     </div> | |||
|                                 </div> | |||
|                             </div> | |||
|                             <div class="position-relative mb-4" | |||
|                                  style="border-radius:10px; background-color:#f4f4f4"> | |||
|                                 <div class="p-md-5 p-3 position-relative"> | |||
|                                     <div class="row"> | |||
|                                         <div class="col-md-12"> | |||
|                                             <h1 style="font-weight:bold; font-size:calc(1.1rem + 1vw); line-height:120%; text-align:center; text-transform:capitalize; font-size: 40px; | |||
|                               font-weight: 700;"> | |||
|                                       <span style="color:#121212; font-size:calc(1.1rem + 1vw)">Choose preferred design. | |||
|                                       </span> | |||
|                                             </h1> | |||
|                                         </div> | |||
|                                         <div class="col-md-12 mb-4"> | |||
|                                             <p style="font-weight:400; font-size:16px; line-height:150%; text-align:center;  color:#64728f"> | |||
|                                                 Select the preferred design from the | |||
|                                     available options. | |||
|                                             </p> | |||
|                                         </div> | |||
|                                         <div class="col-md-12 text-center"> | |||
|                                             <div class="d-inline-block p-3 shadow-sm" | |||
|                                                  style="background-color:#fff; border-radius:10px"> | |||
|                                                 <img alt="" class="img-fluid" | |||
|                                                      loading="lazy" | |||
|                                                      src="./assets/screenshots/web3.png" | |||
|                                                      style="min-height: 1px;"> | |||
|                                             </div> | |||
|                                         </div> | |||
|                                     </div> | |||
|                                 </div> | |||
|                             </div> | |||
|                             <div class="position-relative mb-4" | |||
|                                  style="border-radius:10px; background-color:#f4f4f4"> | |||
|                                 <div class="p-md-5 p-3 position-relative"> | |||
|                                     <div class="row"> | |||
|                                         <div class="col-md-12"> | |||
|                                             <h1 style="font-weight:bold; font-size:calc(1.1rem + 1vw); line-height:120%; text-align:center; text-transform:capitalize; font-size: 40px; | |||
|                               font-weight: 700;"> | |||
|                                       <span style="color:#121212; font-size:calc(1.1rem + 1vw)">Design appears on the product | |||
|                                       </span> | |||
| 
 | |||
|                                             </h1> | |||
|                                         </div> | |||
|                                         <div class="col-md-12 mb-4"> | |||
|                                             <p style="font-weight:400; font-size:16px; line-height:150%; text-align:center;  color:#64728f"> | |||
|                                                  After choosing appropriate design, the | |||
|                                     design will automatically appear on the | |||
|                                     product. | |||
|                                             </p> | |||
|                                         </div> | |||
|                                         <div class="col-md-12 text-center"> | |||
|                                             <div class="d-inline-block p-3 shadow-sm" | |||
|                                                  style="background-color:#fff; border-radius:10px"> | |||
|                                                 <img alt="" class="img-fluid" | |||
|                                                      loading="lazy" | |||
|                                                      src="./assets/screenshots/web4.png" | |||
|                                                      style="min-height: 1px;"> | |||
|                                             </div> | |||
|                                         </div> | |||
|                                     </div> | |||
|                                 </div> | |||
|                             </div> | |||
|                             <div class="position-relative mb-4" | |||
|                                  style="border-radius:10px; background-color:#f4f4f4"> | |||
|                                 <div class="p-md-5 p-3 position-relative"> | |||
|                                     <div class="row"> | |||
|                                         <div class="col-md-12"> | |||
|                                             <h1 style="font-weight:bold; font-size:calc(1.1rem + 1vw); line-height:120%; text-align:center; text-transform:capitalize; font-size: 40px; | |||
|                               font-weight: 700;"> | |||
|                                       <span style="color:#121212; font-size:calc(1.1rem + 1vw)">Save the design. | |||
| 
 | |||
|                                       </span> | |||
| 
 | |||
|                                             </h1> | |||
|                                         </div> | |||
|                                         <div class="col-md-12 mb-4"> | |||
|                                             <p style="font-weight:400; font-size:16px; line-height:150%; text-align:center;  color:#64728f"> | |||
|                                         After customizing the design by moving the | |||
|                                     design, resizing the design, or rotating the | |||
|                                     design etc., save the changes by clicking on | |||
|                                     the 'Save' button. | |||
|                                             </p> | |||
|                                         </div> | |||
|                                         <div class="col-md-12 text-center"> | |||
|                                             <div class="d-inline-block p-3 shadow-sm" | |||
|                                                  style="background-color:#fff; border-radius:10px"> | |||
|                                                 <img alt="" class="img-fluid" | |||
|                                                      loading="lazy" | |||
|                                                      src="./assets/screenshots/web5.png" | |||
|                                                      style="min-height: 1px;"> | |||
|                                             </div> | |||
|                                             <div class="d-inline-block p-3 shadow-sm" | |||
|                                                  style="background-color:#fff; border-radius:10px"> | |||
|                                                 <img alt="" class="img-fluid" | |||
|                                                      loading="lazy" | |||
|                                                      src="./assets/screenshots/web6.png" | |||
|                                                      style="min-height: 1px;"> | |||
|                                             </div> | |||
|                                         </div> | |||
|                                     </div> | |||
|                                 </div> | |||
|                             </div> | |||
|                             <div class="position-relative mb-4" | |||
|                                  style="border-radius:10px; background-color:#f4f4f4"> | |||
|                                 <div class="p-md-5 p-3 position-relative"> | |||
|                                     <div class="row"> | |||
|                                         <div class="col-md-12"> | |||
|                                             <h1 style="font-weight:bold; font-size:calc(1.1rem + 1vw); line-height:120%; text-align:center; text-transform:capitalize; font-size: 40px; | |||
|                               font-weight: 700;"> | |||
|                                       <span style="color:#121212; font-size:calc(1.1rem + 1vw)">Updated product in the back-end. | |||
| 
 | |||
|                                       </span> | |||
| 
 | |||
|                                             </h1> | |||
|                                         </div> | |||
|                                         <div class="col-md-12 mb-4"> | |||
|                                             <p style="font-weight:400; font-size:16px; line-height:150%; text-align:center;  color:#64728f"> | |||
|                                        Product with design will appear on the associated | |||
|                                     sale order in the back-end. | |||
|                                             </p> | |||
|                                         </div> | |||
|                                         <div class="col-md-12 text-center"> | |||
|                                             <div class="d-inline-block p-3 shadow-sm" | |||
|                                                  style="background-color:#fff; border-radius:10px"> | |||
|                                                 <img alt="" class="img-fluid" | |||
|                                                      loading="lazy" | |||
|                                                      src="./assets/screenshots/web7.png" | |||
|                                                      style="min-height: 1px;"> | |||
|                                             </div> | |||
|                                         </div> | |||
|                                     </div> | |||
|                                 </div> | |||
|                             </div> | |||
| 
 | |||
|                         </div> | |||
|                         <div aria-labelledby="feature-tab" | |||
|                              class="tab-pane fade show py-1" id="feature" | |||
|                              role="tabpanel"> | |||
|                             <div class="row py-4"> | |||
|                                 <!-- Features Section --> | |||
|                                 <div class="col-md-6 col-sm-12 p-3"> | |||
|                                     <div class="d-flex flex-column align-items-start h-100" | |||
|                                          style="padding:30px; border-radius:12px; background-color:#faf8ff"> | |||
|                                         <div class="d-flex align-items-center justify-content-center"> | |||
|                                             <div class="d-flex align-items-center justify-content-center " | |||
|                                                  style="width:36px; height:36px; border-radius:50%; background-color:#7847D9 ; margin-right:10px"> | |||
|                                                 <i class="fa fa-star  " | |||
|                                                    style="color:#fff; font-size:14px"></i> | |||
|                                             </div> | |||
|                                             <p style="color:#1A202C; font-weight:600; font-size:1.2rem; margin-bottom:2px">Create customized designs</p> | |||
|                                         </div> | |||
| 
 | |||
|                                     </div> | |||
|                                 </div> | |||
|                                 <div class="col-md-6 col-sm-12 p-3"> | |||
|                                     <div class="d-flex flex-column align-items-start h-100" | |||
|                                          style="padding:30px; border-radius:12px; background-color:#faf8ff"> | |||
|                                         <div class="d-flex align-items-center justify-content-center"> | |||
|                                             <div class="d-flex align-items-center justify-content-center " | |||
|                                                  style="width:36px; height:36px; border-radius:50%; background-color:#7847D9 ; margin-right:10px"> | |||
|                                                 <i class="fa fa-star  " | |||
|                                                    style="color:#fff; font-size:14px"></i> | |||
|                                             </div> | |||
|                                             <p style="color:#1A202C; font-weight:600; font-size:1.2rem; margin-bottom:2px">Allows users to customize products by choosing | |||
|                                                 the designs from front-end</p> | |||
|                                         </div> | |||
|                                     </div> | |||
|                                 </div> | |||
|                             </div> | |||
|                         </div> | |||
|                         <div aria-labelledby="releases-tab" | |||
|                              class="tab-pane fade show" id="releases" | |||
|                              role="tabpanel"> | |||
|                             <!-- Release Notes --> | |||
|                             <div class="row pt-5 m-0"> | |||
|                                 <div class="col-md-3"> | |||
|                                     <h4 style="font-size:16px; font-weight:600; color:#514F4F; margin:0; line-height:26px;"> | |||
|                                         Latest Release 18.0.1.0.0 | |||
|                                     </h4> | |||
|                                     <span style="font-size:14px; color:#7A7979; display:block; margin-bottom:20px;"> | |||
|                                           27th November, 2024 | |||
|                                     </span> | |||
|                                 </div> | |||
|                                 <div class="col-md-8"> | |||
|                                     <div style="padding:0 0 40px"> | |||
|                                         <div style="margin:0 0 10px"> | |||
|                                             <div style="display:inline-block; padding:0px 8px; color:#514F4F; background-color:#FFD8D8; border-radius:20px"> | |||
|                                                 Add | |||
|                                             </div> | |||
|                                         </div> | |||
|                                         <div class="d-flex m-0" | |||
|                                              style="color:#7A7979;"> | |||
|                                             <ul class="pl-3 mb-0"> | |||
|                                                 <li> | |||
|                                                     Initial Commit | |||
|                                                 </li> | |||
| 
 | |||
|                                             </ul> | |||
|                                         </div> | |||
|                                     </div> | |||
|                                     <div style="padding:0 0 0; border-bottom:1px solid #E3E3E3"> | |||
|                                     </div> | |||
|                                 </div> | |||
|                             </div> | |||
|                         </div> | |||
|                     </div> | |||
|                 </div> | |||
|                 <!--  --> | |||
|                 <!-- related post --> | |||
|                 <!--  --> | |||
|                 <section class="oe_container mt32"> | |||
|                 <h2 style="color: #091E42;font-family: "Montserrat";text-align: center;margin: 25px auto;text-transform: uppercase;" class="oe_slogan"> | |||
|                     <b>Related Products</b> | |||
|                 </h2> | |||
|                 <div id="demo" class="row carousel slide mt64 mb32" data-bs-ride="carousel"> | |||
|                     <!-- The slideshow --> | |||
|                     <div class="carousel-inner"> | |||
|                         <div class="carousel-item active"> | |||
|                             <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float: left; padding: 10px;"> | |||
|                                 <a href="https://apps.odoo.com/apps/modules/17.0/base_accounting_kit" target="_blank" style="color: #000; text-decoration: none;"> | |||
|                                     <div style="border-radius: 6px; padding: 16px; border: 1px solid #cbcbcb;" class="shadow-sm"> | |||
|                                         <img class="img img-responsive center-block" style=" max-width: 100%;" src="./assets/modules/1.gif" /> | |||
|                                         <h4 class="mt0 text-truncate" style="text-align:center;width:100% margin-bottom: 8px; font-weight: 600; padding-top: 16px; text-decoration:none;font-size: 18px; padding-bottom: 8px; margin-bottom: 0px"> | |||
|                                             Odoo 17 Full Accounting Kit</h4> | |||
|                                     </div> | |||
|                                 </a> | |||
|                             </div> | |||
|                             <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float: left; padding: 10px;"> | |||
|                                 <a href="https://apps.odoo.com/apps/modules/17.0/ohrms_core" target="_blank" style="color: #000; text-decoration: none;"> | |||
|                                     <div style="border-radius: 6px; padding: 16px; border: 1px solid #cbcbcb;" class="shadow-sm"> | |||
|                                         <img class="img img-responsive center-block" style=" max-width: 100%;" src="./assets/modules/2.gif" /> | |||
|                                         <h4 class="mt0 text-truncate" style="text-align:center;width:100% margin-bottom: 8px; font-weight: 600; padding-top: 16px; text-decoration:none;font-size: 18px; padding-bottom: 8px; margin-bottom: 0px"> | |||
|                                              Open HRMS Core</h4> | |||
|                                     </div> | |||
|                                 </a> | |||
|                             </div> | |||
|                             <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float: left; padding: 10px;"> | |||
|                                 <a  href="https://apps.odoo.com/apps/modules/17.0/invoice_format_editor" target="_blank" style="color: #000; text-decoration: none;"> | |||
|                                     <div style="border-radius: 6px;padding: 16px; border: 1px solid #cbcbcb;" class="shadow-sm"> | |||
|                                         <img class="img img-responsive center-block" style=" max-width: 100%;" src="./assets/modules/3.png"/> | |||
|                                         <h4 class="mt0 text-truncate" style="text-align:center;width:100% margin-bottom: 8px; font-weight: 600; padding-top: 16px; text-decoration:none;font-size: 18px; padding-bottom: 8px; margin-bottom: 0px"> | |||
|                                             Odoo17 Invoice Format Editor </h4> | |||
|                                     </div> | |||
|                                 </a> | |||
|                             </div> | |||
|                         </div> | |||
|                         <div class="carousel-item"> | |||
|                             <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float: left; padding: 10px;"> | |||
|                                 <a href="https://apps.odoo.com/apps/modules/17.0/login_user_detail" target="_blank" style="color: #000; text-decoration: none;"> | |||
|                                     <div style="border-radius: 6px; padding: 16px; border: 1px solid #cbcbcb;" class="shadow-sm"> | |||
|                                         <img class="img img-responsive center-block" style=" max-width: 100%;" src="./assets/modules/4.png" /> | |||
|                                         <h4 class="mt0 text-truncate" style="text-align:center;width:100% margin-bottom: 8px; font-weight: 600; padding-top: 16px; text-decoration:none;font-size: 18px; padding-bottom: 8px; margin-bottom: 0px"> | |||
|                                             User Log Details</h4> | |||
|                                     </div> | |||
|                                 </a> | |||
|                             </div> | |||
|                             <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float: left; padding: 10px;"> | |||
|                                 <a href="https://apps.odoo.com/apps/modules/17.0/product_barcode" target="_blank" style="color: #000; text-decoration: none;"> | |||
|                                     <div style="border-radius: 6px; padding: 16px; border: 1px solid #cbcbcb;" class="shadow-sm"> | |||
|                                         <img class="img img-responsive center-block" style=" max-width: 100%;" src="./assets/modules/5.png" /> | |||
|                                         <h4 class="mt0 text-truncate" style="text-align:center;width:100% margin-bottom: 8px; font-weight: 600; padding-top: 16px; text-decoration:none;font-size: 18px; padding-bottom: 8px; margin-bottom: 0px"> | |||
|                                              Odoo17 Product Barcode Generator </h4> | |||
|                                     </div> | |||
|                                 </a> | |||
|                             </div> | |||
|                             <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float: left; padding: 10px;"> | |||
|                                 <a href="https://apps.odoo.com/apps/modules/17.0/whatsapp_redirect" target="_blank" style="color: #000; text-decoration: none;"> | |||
|                                     <div style="border-radius: 6px; padding: 16px; border: 1px solid #cbcbcb;" class="shadow-sm"> | |||
|                                         <img class="img img-responsive center-block" style=" max-width: 100%;" src="./assets/modules/6.jpg" /> | |||
|                                         <h4 class="mt0 text-truncate" style="text-align:center;width:100% margin-bottom: 8px; font-weight: 600; padding-top: 16px; text-decoration:none;font-size: 18px; padding-bottom: 8px; margin-bottom: 0px"> | |||
|                                             Send Whatsapp Message Odoo17</h4> | |||
|                                     </div> | |||
|                                 </a> | |||
|                             </div> | |||
|                         </div> | |||
|                     </div> | |||
|                     <!-- Left and right controls --> | |||
|                     <a class="carousel-control-prev" href="#demo" data-bs-slide="prev" style="margin-left: -30px;width: 35px;color: #000;"> | |||
|                         <span class="carousel-control-prev-icon"> | |||
|         <i class="fa fa-chevron-left" style="font-size:24px"></i> | |||
|       </span> | |||
|                     </a> | |||
|                     <a class="carousel-control-next" href="#demo" data-bs-slide="next" style="margin-right: -30px;width: 35px;color: #000;"> | |||
|                         <span class="carousel-control-next-icon"> | |||
|         <i class="fa fa-chevron-right" style="font-size:24px"></i> | |||
|       </span> | |||
|                     </a> | |||
|                 </div> | |||
|             </section> | |||
|                 <!-- service-section --> | |||
| 
 | |||
|                 <section id="services" class="mt-5" style="border-radius: 16px; | |||
|                                                             border: 1px solid #EBEEF2; | |||
|                                                             background: var(--Neutral-N0, #FFF); | |||
|                                                             padding: 60px 40px; | |||
|                                                             box-shadow: 0px 5px 20px -11px rgba(0, 0, 0, 0.25);"> | |||
|                     <div class="text-center mt-4"><h3 class="mb-0" style="color: #000; | |||
|                                                                   text-align: center; | |||
|                                                                   font-family: Montserrat; | |||
|                                                                   font-size: 40px; | |||
|                                                                   font-style: normal; | |||
|                                                                   font-weight: 700; | |||
|                                                                   line-height: normal; | |||
|                                                                   text-transform: uppercase; | |||
|                                                                   padding-bottom: 50px;"> | |||
|                         Our Services</h3></div> | |||
|                     <div class="row mt-3"> | |||
|                         <div class="col-lg-3 col-sm-12 mb-3"> | |||
|                             <a href="#" style="text-decoration:none"> | |||
|                                 <div class="btn-lg btn-block p-4 mb-2 d-flex flex-column justify-content-center align-items-center" | |||
|                                      style="font-size:25px; font-weight:bold;background-color:#FFE2E5; margin:auto; gap: 16px; border-radius: 8px;"> | |||
|                                     <div class="d-flex justify-content-center align-items-center" | |||
|                                          style="background-color:#FA5A7D; border-radius:50%; height:56px; width:56px"> | |||
|                                         <img src="./assets/icons/gear.svg" | |||
|                                              class="img-responsive" | |||
|                                              height="28px" width="28px"> | |||
|                                     </div> | |||
|                                     <span style="font-size: 18px; | |||
|                                   color: var(--text-color); | |||
|                                   font-weight: 600;"> Odoo Customization</span> | |||
|                                 </div> | |||
|                             </a> | |||
|                         </div> | |||
|                         <div class="col-lg-3 col-sm-12 mb-3"> | |||
|                             <a href="#" style="text-decoration:none"> | |||
|                                 <div class="btn-lg btn-block p-4 mb-2 d-flex flex-column justify-content-center align-items-center" | |||
|                                      style="font-size:25px; font-weight:bold;background-color:#FFF4DE; margin:auto; gap: 16px; border-radius: 8px;"> | |||
|                                     <div class="d-flex justify-content-center align-items-center" | |||
|                                          style="background-color:#FF947A; border-radius:50%; height:56px; width:56px"> | |||
|                                         <img src="./assets/icons/wrench-icon.svg" | |||
|                                              class="img-responsive" | |||
|                                              height="28px" width="28px"> | |||
|                                     </div> | |||
|                                     <span style="font-size: 18px; | |||
|                     color: var(--text-color); | |||
|                     font-weight: 600;"> Odoo Implementation</span> | |||
|                                 </div> | |||
|                             </a> | |||
|                         </div> | |||
|                         <div class="col-lg-3 col-sm-12 mb-3"> | |||
|                             <a href="#" style="text-decoration:none"> | |||
|                                 <div class="btn-lg btn-block p-4 mb-2 d-flex flex-column justify-content-center align-items-center" | |||
|                                      style="font-size:25px; font-weight:bold;background-color:#DCFCE7; margin:auto; gap: 16px; border-radius: 8px;"> | |||
|                                     <div class="d-flex justify-content-center align-items-center" | |||
|                                          style="background-color:#3CD856; border-radius:50%; height:56px; width:56px"> | |||
|                                         <img src="./assets/icons/life-ring-icon.svg" | |||
|                                              class="img-responsive" | |||
|                                              height="28px" width="28px"> | |||
|                                     </div> | |||
|                                     <span style="font-size: 18px; | |||
|                   color: var(--text-color); | |||
|                   font-weight: 600;">Odoo Support</span> | |||
|                                 </div> | |||
|                             </a> | |||
|                         </div> | |||
|                         <div class="col-lg-3 col-sm-12 mb-3"> | |||
|                             <a href="#" style="text-decoration:none"> | |||
|                                 <div class="btn-lg btn-block p-4 mb-2 d-flex flex-column justify-content-center align-items-center" | |||
|                                      style="font-size:25px; font-weight:bold;background-color:#F3E8FF; margin:auto; gap: 16px; border-radius: 8px;"> | |||
|                                     <div class="d-flex justify-content-center align-items-center" | |||
|                                          style="background-color:#BF83FF; border-radius:50%; height:56px; width:56px"> | |||
|                                         <img src="./assets/icons/arrows-repeat.svg" | |||
|                                              class="img-responsive" | |||
|                                              height="28px" width="28px"> | |||
|                                     </div> | |||
|                                     <span style="font-size: 18px; | |||
|                 color: var(--text-color); | |||
|                 font-weight: 600;">Odoo Migration</span> | |||
|                                 </div> | |||
|                             </a> | |||
|                         </div> | |||
|                         <div class="col-lg-3 col-sm-12 mb-3"> | |||
|                             <a href="#" style="text-decoration:none"> | |||
|                                 <div class="btn-lg btn-block p-4 mb-2 d-flex flex-column justify-content-center align-items-center" | |||
|                                      style="font-size:25px; font-weight:bold;background-color:#F1F9FF; margin:auto; gap: 16px; border-radius: 8px;"> | |||
|                                     <div class="d-flex justify-content-center align-items-center" | |||
|                                          style="background-color:#01649C; border-radius:50%; height:56px; width:56px"> | |||
|                                         <img src="./assets/icons/puzzle-piece-icon.svg" | |||
|                                              class="img-responsive" | |||
|                                              height="28px" width="28px"> | |||
|                                     </div> | |||
|                                     <span style="font-size: 18px; | |||
|               color: var(--text-color); | |||
|               font-weight: 600;">Odoo integration</span> | |||
|                                 </div> | |||
|                             </a> | |||
|                         </div> | |||
|                         <div class="col-lg-3 col-sm-12 mb-3"> | |||
|                             <a href="#" style="text-decoration:none"> | |||
|                                 <div class="btn-lg btn-block p-4 mb-2 d-flex flex-column justify-content-center align-items-center" | |||
|                                      style="font-size:25px; font-weight:bold;background-color:#EDF8ED; margin:auto; gap: 16px; border-radius: 8px;"> | |||
| 
 | |||
|                                     <div class="d-flex justify-content-center align-items-center" | |||
|                                          style="background-color:#69CC70; border-radius:50%; height:56px; width:56px"> | |||
|                                         <img src="./assets/icons/odoo-consultancy.svg" | |||
|                                              class="img-responsive" | |||
|                                              height="28px" width="28px"> | |||
|                                     </div> | |||
|                                     <span style="font-size: 18px; | |||
|             color: var(--text-color); | |||
|             font-weight: 600;">Odoo Consultancy</span> | |||
|                                 </div> | |||
|                             </a> | |||
|                         </div> | |||
|                         <div class="col-lg-3 col-sm-12 mb-3"> | |||
|                             <a href="#" style="text-decoration:none"> | |||
|                                 <div class="btn-lg btn-block p-4 mb-2 d-flex flex-column justify-content-center align-items-center" | |||
|                                      style="font-size:25px; font-weight:bold;background-color:#F1F6FF; margin:auto; gap: 16px; border-radius: 8px;"> | |||
| 
 | |||
|                                     <div class="d-flex justify-content-center align-items-center" | |||
|                                          style="background-color:#2E4556; border-radius:50%; height:56px; width:56px"> | |||
|                                         <img src="./assets/icons/odoo-licencing.svg" | |||
|                                              class="img-responsive" | |||
|                                              height="28px" width="28px"> | |||
|                                     </div> | |||
|                                     <span style="font-size: 18px; | |||
|           color: var(--text-color); | |||
|           font-weight: 600;">Odoo Licensing</span> | |||
|                                 </div> | |||
|                             </a> | |||
|                         </div> | |||
|                         <div class="col-lg-3 col-sm-12 mb-3"> | |||
|                             <a href="#" style="text-decoration:none"> | |||
|                                 <div class="btn-lg btn-block p-4 mb-2 d-flex flex-column justify-content-center align-items-center" | |||
|                                      style="font-size:25px; font-weight:bold;background-color:#FAF6EA; margin:auto; gap: 16px; border-radius: 8px;"> | |||
| 
 | |||
|                                     <div class="d-flex justify-content-center align-items-center" | |||
|                                          style="background-color:#FCD12C; border-radius:50%; height:56px; width:56px"> | |||
|                                         <img src="./assets/icons/hire-odoo.svg" | |||
|                                              class="img-responsive" | |||
|                                              height="28px" width="28px"> | |||
|                                     </div> | |||
|                                     <span style="font-size: 18px; | |||
|           color: var(--text-color); | |||
|           font-weight: 600;">Hire Odoo Developer</span> | |||
|                                 </div> | |||
|                             </a> | |||
|                         </div> | |||
|                     </div> | |||
|             </div> | |||
|             <!-- licence --> | |||
|             <div class="tab-pane fade" id="profile" role="tabpanel" | |||
|                  aria-labelledby="profile-tab"> | |||
|                 <div class="px-5"> | |||
|                     .... | |||
|                 </div> | |||
|             </div> | |||
|             <!--  --> | |||
|         </div> | |||
|         </section> | |||
|         <!--  --> | |||
|     </div> | |||
| </div> | |||
| </body> | |||
| <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"></script> | |||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js" | |||
|         integrity="sha512-v2CJ7UaYy4JwqLDIrZUI/4hqeoQieOmAZNXBeQyjo21dadnwR+8ZaIJVT8EE2iyI61OV8e6M8PP2/4hpQINQ/g==" | |||
|         crossorigin="anonymous" referrerpolicy="no-referrer"></script> | |||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script> | |||
| <script> | |||
|     $('.owl-carousel').owlCarousel({ | |||
|         rtl: true, | |||
|         loop: true, | |||
|         margin: 10, | |||
|         nav: true, | |||
|         responsive: { | |||
|             0: { | |||
|                 items: 1 | |||
|             }, | |||
|             600: { | |||
|                 items: 3 | |||
|             }, | |||
|             1000: { | |||
|                 items: 3 | |||
|             } | |||
|         } | |||
|     }) | |||
| </script> | |||
| </html> | |||