964 lines
		
	
	
	
		
			61 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			964 lines
		
	
	
	
		
			61 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <!DOCTYPE html>
 | |
| <html lang="en">
 | |
| <head>
 | |
|     <meta charset="UTF-8"/>
 | |
|     <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 | |
|     <title>Smart Alerts Index</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 class="text-center"-->
 | |
| <!--                 style="background-color:#7C7BAD !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">-->
 | |
| <!--                Odoo.sh-->
 | |
| <!--            </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;
 | |
|             ">
 | |
|                                 This module helps provide smart alerts on
 | |
|                                 any model based on various conditions.
 | |
|                             </p>
 | |
|                             <h1 class="text-center text-uppercase my-0"
 | |
|                                 style="
 | |
|               color: #121212;
 | |
|               font-size: 46px;
 | |
|               font-weight: 700;
 | |
|               line-height: normal;
 | |
|             ">Smart Alerts</span>
 | |
|                             </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/icons/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>
 | |
|                 <!-- 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>
 | |
|                                 <h5 class="m-0"
 | |
|                                     style="color:#000 !important; font-weight:bold">
 | |
|                                     Alert for any document type.
 | |
|                                 </h5>
 | |
|                             </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>
 | |
|                                 <h5 class="m-0"
 | |
|                                     style="color:#000 !important; font-weight:bold">
 | |
|                                     General and Specific Alerts.
 | |
|                                 </h5>
 | |
|                             </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>
 | |
|                                 <h5 class="m-0"
 | |
|                                     style="color:#000 !important; font-weight:bold">
 | |
|                                     Different Alert style.
 | |
|                                 </h5>
 | |
|                             </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>
 | |
|                                 <h5 class="m-0"
 | |
|                                     style="color:#000 !important; font-weight:bold">
 | |
|                                     Secured Alerts.
 | |
|                                 </h5>
 | |
|                             </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;">Smart Alerts</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)">User </span>
 | |
|                                                 <span style="color: #7f54b3; font-size:calc(1.1rem + 1vw)"> Configuration</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">
 | |
|                                                 Settings -> Users -> Access Rights -> Smart Alerts Warning: Admin
 | |
|                                             </p>
 | |
|                                             <p style="font-weight:400; font-size:16px; line-height:150%; text-align:center;  color:#64728f">
 | |
|                                                 Only Smart Alerts Warning: Admin Can create and manage the smart alerts.
 | |
|                                             </p>
 | |
|                                             <p style="font-weight:400; font-size:16px; line-height:150%; text-align:center;  color:#64728f">
 | |
|                                                 Only Smart Alerts Warning: User can View the created records.
 | |
|                                             </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/1.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)">Alert</span>
 | |
|                                                 <span style="color: #7f54b3; font-size:calc(1.1rem + 1vw)"> Configuration</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">
 | |
|                                                 Create a new alert record and click the apply 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/2.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)">Alert </span>
 | |
|                                                 <span style="color: #7f54b3; font-size:calc(1.1rem + 1vw)"> Message</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">
 | |
|                                                 We can view the alert message for its corresponding record.
 | |
|                                             </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/3.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)">Alert </span>
 | |
|                                                 <span style="color: #7f54b3; font-size:calc(1.1rem + 1vw)"> Configuration</span>
 | |
|                                             </h1>
 | |
|                                         </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/4.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)">Alert </span>
 | |
|                                                 <span style="color: #7f54b3; font-size:calc(1.1rem + 1vw)"> Message</span>
 | |
|                                             </h1>
 | |
|                                         </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/5.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)">Alert </span>
 | |
|                                                 <span style="color: #7f54b3; font-size:calc(1.1rem + 1vw)"> Configuration</span>
 | |
|                                             </h1>
 | |
|                                         </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/6.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)">Alert </span>
 | |
|                                                 <span style="color: #7f54b3; font-size:calc(1.1rem + 1vw)"> Message</span>
 | |
|                                             </h1>
 | |
|                                         </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/7.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">
 | |
|                                                 Alert for any document type.
 | |
|                                             </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">
 | |
|                                                  General and specific alerts.
 | |
|                                             </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">
 | |
|                                                 Different Alert style.
 | |
|                                             </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">
 | |
|                                                 Secured Alerts.
 | |
|                                             </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">
 | |
|                                                  Community & Enterprise Support .
 | |
|                                             </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;">
 | |
|                                           05th 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/18.0/cw_sale" 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/cw_sale.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">
 | |
|                                             Catch Weight - Sale</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/18.0/delivery_split" 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/delivery_split.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">
 | |
|                                              Delivery Split</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/18.0/website_multi_product_return_management" 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/multi_product_return_from_website.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">
 | |
|                                             Multi Product Return From Website</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/18.0/courier_management" 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/courier_management.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">
 | |
|                                             Courier Management</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/18.0/cw_stock" 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/cw_stock.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">
 | |
|                                              Catch Weight - Stock</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/18.0/purchase_product_history" 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/purchase_history_of_product.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">
 | |
|                                             Purchase History of Products</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>
 |