You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

707 lines
31 KiB

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>app 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" />
<style>
:root {
--primary-color: #F5C000;
--bg-white: #fff;
--text-color: #121212;
--text-color-light: #64728f;
}
body {
font-family: "Montserrat", sans-serif;
}
</style>
</head>
<body>
<!-- overview -->
<div class="container">
<!-- support-header -->
<div class="supports my-5 py-3" style="border-bottom: 1px solid #e7e7e7;">
<div class="row justify-content-between">
<div class="col-4">
<div class="my-3">
<img src="//apps.odoocdn.com/apps/assets/17.0/theme_boec/images/Cybrosys.png?fcdde35"
style="width:auto !important; height:40px !important">
</div>
</div>
<div class="col-6">
<div class="row" style="margin-top:10px">
<div class="my-3 d-flex align-items-center justify-content-end">
<span class="me-3"><b>Supports: </b></span>
<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>
<div class="row" style="margin-top:10px">
<div class="d-flex align-items-center justify-content-end">
<span class="me-3"><b>Availability: </b></span>
<div class="text-center col"
style="border:1px solid #017E84; font-size:0.8rem !important; color:#017E84 !important; font-weight:500 !important; padding:4px !important; margin:0 3px !important; border-radius:20px !important; min-width:120px !important">
<i class="fa fa-times" style="color:red"></i> Odoo Online
</div>
<div class="text-center col"
style="font-size:0.8rem !important; border:1px solid #714b67; color:#714b67 !important; font-weight:500 !important; padding:4px !important; margin:0 3px !important; border-radius:20px !important; min-width:120px !important">
<i class="fa fa-check" style="color:green"></i> Odoo.sh
</div>
<div class="text-center col"
style="font-size:0.8rem !important; color:#5B899E !important; border:1px solid #5B899E; font-weight:500 !important; padding:4px !important; margin:0 3px !important; border-radius:20px !important; min-width:120px !important">
<i class="fa fa-check" style="color:green"></i> On Premise
</div>
</div>
</div>
</div>
</div>
</div>
<!-- -->
<!-- banner-section -->
<div class="my-5">
<div class="">
<img src="./img/banner.jpg" class="img-fluid" style="border-radius: 16px; width: 100%;">
</div>
</div>
<!-- -->
<!--feature section -->
<div class="my-5" style="padding: 100px; background-color: #f1f5fd; border-radius: 16px;">
<div class="container">
<div class="row mb-60">
<div class="col-lg-12 d-flex justify-content-center align-items-center flex-wrap gap-3">
<div class="position-relative" ; style="
text-align: center;
font-size: 46.875px;
font-style: normal;
padding-bottom: 40px; ">
<h2 style="font-weight: 600;">Our Features</h2>
</div>
</div>
</div>
<div class="row g-4">
<div class="col-lg-4 col-md-6" style="visibility: visible;">
<div style="background-color: #fff;height: 100%;
border-radius: 12px;
padding: 35px 30px;">
<div class="content">
<img src="./img/feature-star.svg" class="img-responsive" height="46px" width="46px">
<h4 class="mt-3"><a href="#" style=" color: #121212;
font-size: 18px;
text-decoration: none;
font-weight: 700;
line-height: 1.2;"> Custom Designed Snippets for better user experience</a></h4>
<p style=" font-size: 16px;
font-weight: 400;
line-height: 1.5;
color: #212529;">Optimized Code Snippets for Enhanced User Experience.</p>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div style="background-color: #fff; height: 100%;
border-radius: 12px;
padding: 35px 30px;">
<div class="content">
<img src="./img/feature-star.svg" class="img-responsive" height="46px" width="46px">
<h4 class="mt-3"><a href="#" style=" color: #121212;
font-size: 18px;
text-decoration: none;
font-weight: 700;
line-height: 1.2;"> Hot sales, New arrival and Deal of the week
.
</a></h4>
<p style=" font-size: 16px;
font-weight: 400;
line-height: 1.5;
color: #212529;">Featured Sales, New Arrivals, and Weekly Deals.</p>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div style="background-color: #fff; height: 100%;
border-radius: 12px;
padding: 35px 30px;">
<div class="content">
<img src="./img/feature-star.svg" class="img-responsive" height="46px" width="46px">
<h4 class="mt-3"><a href="#" style=" color: #121212;
font-size: 18px;
text-decoration: none;
font-weight: 700;
line-height: 1.2;"> Contains Price Filter and Brand Filter Options by Default</a></h4>
</div>
<p style=" font-size: 16px;
font-weight: 400;
line-height: 1.5;
color: #212529;">Built-in Price and Brand Filtering Systems.</p>
</a>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div style="background-color: #fff;height: 100%;
border-radius: 12px;
padding: 35px 30px;">
<div class="content">
<img src="./img/feature-star.svg" class="img-responsive" height="46px" width="46px">
<h4 class="mt-3"><a href="#" style=" color: #121212;
font-size: 18px;
text-decoration: none;
font-weight: 700;
line-height: 1.2;"> A Clean layout and New Font Style</a></h4>
<p style=" font-size: 16px;
font-weight: 400;
line-height: 1.5;
color: #212529;">Modern, Clean Interface with Premium Typography.</p>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div style="background-color: #fff;height: 100%;
border-radius: 12px;
padding: 35px 30px;">
<div class="content">
<img src="./img/feature-star.svg" class="img-responsive" height="46px" width="46px">
<h4 class="mt-3"><a href="#" style=" color: #121212;
font-size: 18px;
text-decoration: none;
font-weight: 700;
line-height: 1.2;"> Customized shop view, custom categories view, product view, contact us page, cart, blog, blog preview...etc
</a></h4>
<p style=" font-size: 16px;
font-weight: 400;
line-height: 1.5;
color: #212529;">Shop & Category Views
Product Displays
Shopping Cart
Blog System
Contact Portal.</p>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div style="background-color: #fff;height: 100%;
border-radius: 12px;
padding: 35px 30px;">
<div class="content">
<img src="./img/feature-star.svg" class="img-responsive" height="46px" width="46px">
<h4 class="mt-3"><a href="#" style=" color: #121212;
font-size: 18px;
text-decoration: none;
font-weight: 700;
line-height: 1.2;"> Fully Responsive Theme with a Premium Design</a></h4>
<p style=" font-size: 16px;
font-weight: 400;
line-height: 1.5;
color: #212529;">Premium Responsive Design for All Devices</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- -->
<section class="container my-5">
<div class="row">
<div class="col-md-12">
<ul role="tablist" class="nav nav-tabs justify-content-center d-flex justify-content-center" data-tabs="tabs"
style="border:none; background-color:unset; margin:0 auto">
</ul>
</div>
<div class="col-md-12 tab-content ui-front"
style="border-radius:20px;border: 1px solid #D6E0FF; height:auto;padding: 20px;">
<div class="tab-pane active show fade" id="Features" role="tabpanel" aria-labelledby="features-1">
<section class="">
<section class="mt-5">
<h2 class="pb-5" style="font-weight: 700; text-align: center;">Theme Features</h2>
<div class="row" style="margin-bottom: 24px;">
<div class="col-md-8">
<div style="border-radius: 10px; padding: 32px;
background-color: #303030;
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px); height: 100%;">
<div class="info">
<span class="label" style="font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 32px;
color: #f14848;
margin-bottom: 13px;
text-transform: uppercase;">HIGHLIGHT</span>
<h3 class="text-white" style=" color: #fff;
font-size: 24px;
font-weight: 500;
line-height: 32px;
margin-bottom: 9px;">Mobile View</h3>
<p class="des" style="color: #c7c7c7;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px;
margin-bottom: 0;">User-friendly and modern looking theme makes your page more Stylish And Beautiful.
</p>
</div>
<div class="mt-5">
<img src="./img/phone-screenshots.jpg" alt="Grid item" class="img-fluid">
</div>
<a href="#" target="_blank" class="url_link" name="grid_popup"
aria-label="Url link label"><span></span></a>
</div>
</div>
<!-- -->
<div class="col-md-4">
<div style="border-radius: 10px; padding: 32px;
background-color: #303030;
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px); height: 100%;">
<div class="info">
<span class="label" style="font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 32px;
color: #f14848;
margin-bottom: 13px;
text-transform: uppercase;">HIGHLIGHT</span>
<h3 class="text-white" style=" color: #fff;
font-size: 24px;
font-weight: 500;
line-height: 32px;
margin-bottom: 9px;">Desktop View</h3>
<p class="des" style="color: #c7c7c7;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px;
margin-bottom: 0;">It is easy to customize and use. Just drag and drop the building blocks to make attractive webpages.
.</p>
</div>
<div class="mt-5">
<img src="./img/laptop-screenshots.jpg" alt="Grid item" class="img-fluid">
</div>
<a href="#" target="_blank" class="url_link" name="grid_popup"
aria-label="Url link label"><span></span></a>
</div>
</div>
</div>
<!-- -->
<!--row-2 -->
<div class="row" style="margin-bottom: 24px;">
<div class="col-md-6">
<div style="border-radius: 10px; padding: 32px;
background-color: rgba(48, 48, 48, 1);
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px); height: 100%;">
<div class="info">
<span class="label" style="font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 32px;
color: #f14848;
margin-bottom: 13px;
text-transform: uppercase;">HIGHLIGHT</span>
<h3 class="text-white" style=" color: #fff;
font-size: 24px;
font-weight: 500;
line-height: 32px;
margin-bottom: 9px;">Home Page</h3>
<p class="des" style="color: #c7c7c7;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px;
margin-bottom: 0;">It is easy to customize and use. Just drag and drop the building blocks to make attractive webpages.Customizable building blocks in home page design helps you to edit them as per needs.
</p>
</div>
<div class="mt-5">
<img src="./img/2.jpg" alt="Grid item" class="img-fluid">
</div>
<a href="#" target="_blank" class="url_link" name="grid_popup"
aria-label="Url link label"><span></span></a>
</div>
</div>
<!-- -->
<div class="col-md-6">
<div style="border-radius: 10px; padding: 32px;
background-color: rgba(48, 48, 48, 1);
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px); height: 100%;">
<div class="info">
<span class="label" style="font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 32px;
color: #f14848;
margin-bottom: 13px;
text-transform: uppercase;">HIGHLIGHT</span>
<h3 class="text-white" style=" color: #fff;
font-size: 24px;
font-weight: 500;
line-height: 32px;
margin-bottom: 9px;">Product View</h3>
<p class="des" style="color: #c7c7c7;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px;
margin-bottom: 0;">It has a fully customized Product preview with full details of the product with an attractive design.
.</p>
</div>
<div class="mt-5">
<img src="./img/6.jpg" alt="Grid item" class="img-fluid">
</div>
<a href="#" target="_blank" class="url_link" name="grid_popup"
aria-label="Url link label"><span></span></a>
</div>
</div>
</div>
<!-- -->
<!--row-3 -->
<div class="row" style="margin-bottom: 20px;">
<div class="col-md-4">
<div style="border-radius: 10px; padding: 32px;
background-color: rgba(48, 48, 48, 1);
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px); height: 100%;">
<div class="info">
<span class="label" style="font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 32px;
color: #f14848;
margin-bottom: 13px;
text-transform: uppercase;">HIGHLIGHT</span>
<h3 class="text-white" style=" color: #fff;
font-size: 24px;
font-weight: 500;
line-height: 32px;
margin-bottom: 9px;">Blog Preview</h3>
<p class="des" style="color: #c7c7c7;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px;
margin-bottom: 0;">Theme Boec have a fully customized blog preview with big cover image of the blog with share buttons.
</p>
</div>
<div class="mt-5">
<img src="./img/5.jpg" alt="Grid item" class="img-fluid">
</div>
<a href="#" target="_blank" class="url_link" name="grid_popup"
aria-label="Url link label"><span></span></a>
</div>
</div>
<!-- -->
<div class="col-md-8">
<div style="border-radius: 10px; padding: 32px;
background-color: rgba(48, 48, 48, 1);
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px); height: 100%;">
<div class="info">
<span class="label" style="font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 32px;
color: #f14848;
margin-bottom: 13px;
text-transform: uppercase;">HIGHLIGHT</span>
<h3 class="text-white" style=" color: #fff;
font-size: 24px;
font-weight: 500;
line-height: 32px;
margin-bottom: 9px;">Hot Sales and New Arrivals</h3>
<p class="des" style="color: #c7c7c7;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px;
margin-bottom: 0;">Hot sales and New arrivals are the snippets that are configured from the backend. You can easily add products to the Hot sales. New arrivals are automatically taken the newly arrived products.</p>
</div>
<div class=" mt-5" style="--aspect-ratioapt: 872/443;">
<img src="./img/boec_hot_sales.png" alt="Grid item" class="img-fluid">
</div>
<a href="#" target="_blank" class="url_link" name="grid_popup"
aria-label="Url link label"><span></span></a>
</div>
</div>
</div>
<!-- -->
</section>
</section>
</div>
</div>
</div>
</section>
<!--sections -->
<!-- section content -->
<section class="mb-5"
style="background-color: #f1f5fd; border: 1px solid #D6E0FF; border-radius: 20px; padding: 40px;">
<div class="row d-flex align-items-center">
<div class="col col-12 col-md-12 col-lg-6">
<div style="padding: 20px;">
<h4 class="" style="font-size: 46px;">
<span style="color: #212121;
font-weight: 700;
display: inline-block;
width: 100%;">Build a Modern </span><br>
<span style="color: #212121;
font-weight: 700;
display: inline-block;
width: 100%;">Adaptive Design for Modern Commerce.</span>
</h4>
<div class="mt-4">
<p style="color: #444; font-size: 16px;
font-weight: 400;
line-height: 1.5;">An elegant and contemporary eCommerce website theme that enhances your online presence. With intuitive drag & drop functionality, you can effortlessly construct your ideal layout. Theme Boec offers the complete solution you need for your online store.
.</p>
<ul class="d-flex flex-column gap-3 ms-0 ps-0 mt-4">
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Fully Responsive Framework</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Universal Screen Size Compatibility</span></li>
</ul>
</div>
</div>
</div>
<div class="col col-12 col-md-12 col-lg-6">
<div>
<div>
<img class="img-fluid" src="./img/hero.png" style="
border-radius: 20px;
">
</div>
</div>
</div>
</div>
</section>
<!-- -->
<!-- -->
<div class="my-5">
<!-- banner card -->
<!-- service-section -->
<section id="services" class="mt-5" style="border-radius: 16px;
border: 1px solid #EBEEF2;
background-color: #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; 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="./img/gear.svg" class="img-responsive" height="28px" width="28px">
</div>
<span class="mt-3" style="font-size: 18px;
color: #121212;
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; 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="./img/wrench-icon.svg" class="img-responsive" height="28px" width="28px">
</div>
<span class="mt-3" style="font-size: 18px;
color: #121212;
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; 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="./img/life-ring-icon.svg" class="img-responsive" height="28px" width="28px">
</div>
<span class="mt-3" style="font-size: 18px;
color: #121212;
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; 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="./img/arrows-repeat.svg" class="img-responsive" height="28px" width="28px">
</div>
<span class="mt-3" style="font-size: 18px;
color: #121212;
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; 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="./img/puzzle-piece-icon.svg" class="img-responsive" height="28px" width="28px">
</div>
<span class="mt-3" style="font-size: 18px;
color: #121212;
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; 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="./img/odoo-consultancy.svg" class="img-responsive" height="28px" width="28px">
</div>
<span class="mt-3" style="font-size: 18px;
color: #121212;
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; 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="./img/odoo-licencing.svg" class="img-responsive" height="28px" width="28px">
</div>
<span class="mt-3" style="font-size: 18px;
color: #121212;
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; 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="./img/hire-odoo.svg" class="img-responsive" height="28px" width="28px">
</div>
<span class="mt-3" style="font-size: 18px;
color: #121212;
font-weight: 600;">Hire Odoo Developer</span>
</div>
</a>
</div>
</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>
</html>