1798 lines
134 KiB
HTML
1798 lines
134 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
|
||
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
|
||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
|
||
integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
|
||
crossorigin="anonymous"></script>
|
||
</head>
|
||
<body>
|
||
<div class="container position-relative">
|
||
<!--==================== Banner start ========================== -->
|
||
<div class="card bg-dark text-white border-0 mb-5" style=" margin-left: calc(-50vw + 50%);width: 99.4vw;">
|
||
<img class="card-img" src="banner/1.png" alt="Card image">
|
||
</div>
|
||
<!--==================== Banner end ========================== -->
|
||
<!--==================== Theme Demo start ========================== -->
|
||
<section class="sh_theme_demo mb-5">
|
||
<div class="row align-items-center pb-lg-5 pb-3">
|
||
<div class="col-xxl-7 col-xl-7 col-lg-7 col-md-12 order-lg-0 order-2">
|
||
<img class="w-100" src="app_icon_and_font_icon/app-icons.gif" alt="Card image">
|
||
</div>
|
||
<div class="col-xxl-5 col-xl-5 col-lg-5 col-md-12">
|
||
<div class="sh-content text-lg-start text-center">
|
||
<h2 class="text-lg-start text-sm-center mb-3 fw-bold fs-2" style="color: #2d3150;">App
|
||
Icons Styles
|
||
</h2>
|
||
<p class="text-lg-start text-sm-center fw-normal mt-3 mb-2"
|
||
style="color: #545454;line-height: 30px;font-size: 18px;">Are you bored with standard icon?
|
||
Do you want different icon
|
||
styles? You are at right place! In this theme we have added 5
|
||
unique icon styles (line icon, dual tone icon, 3D icon, light icon & glass icon). You can
|
||
select and go for it!
|
||
</p>
|
||
<a href="#appicons" class="btn mb-3 mt-3 fw-bold fs-6 rounded-1 pt-3 pb-3 ps-4 pe-4"
|
||
style="text-decoration:none;background-color: #2d3150;color:#fff">View
|
||
More</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row align-items-center pt-5">
|
||
<div class="col-xxl-5 col-xl-7 col-lg-7 col-md-12">
|
||
<div class="sh-content text-lg-start text-center">
|
||
<h2 class="text-lg-start text-sm-center mb-3 fw-bold fs-2" style="color: #2d3150;">Font
|
||
Icons Styles
|
||
</h2>
|
||
<p class="text-lg-start text-sm-center fw-normal mt-3 mb-2"
|
||
style="color: #545454;line-height: 30px;font-size: 18px;">Do you want amazing font icon
|
||
styles? We have added 3 unique font icon styles (Regular, Light & Thin Font Icons). You can
|
||
select and go for it!
|
||
</p>
|
||
<a href="#LanguageSelector" class="btn mb-3 mt-3 fw-bold fs-6 rounded-1 pt-3 pb-3 ps-4 pe-4"
|
||
style="text-decoration:none;background-color: #2d3150;color:#fff">View
|
||
More</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-xxl-7 col-xl-5 col-lg-5 col-md-12 order-lg-0 order-2">
|
||
<img class="w-100" src="app_icon_and_font_icon/font-icons.gif" alt="Card image">
|
||
</div>
|
||
</div>
|
||
<div class="row align-items-center pt-5">
|
||
<div class="col-xxl-7 col-xl-5 col-lg-5 col-md-12 order-lg-0 order-2">
|
||
<img class="w-100" src="tiles/18_quick_create.gif" alt="Card image">
|
||
</div>
|
||
<div class="col-xxl-5 col-xl-7 col-lg-7 col-md-12">
|
||
<div class="sh-content text-lg-start text-center">
|
||
<h2 class="text-lg-start text-sm-center mb-3 fw-bold fs-2" style="color: #2d3150;">Quick create feature
|
||
</h2>
|
||
<p class="text-lg-start text-sm-center fw-normal mt-3 mb-2"
|
||
style="color: #545454;line-height: 30px;font-size: 18px;">Quick Create in backmate theme is a powerful feature that makes the process of adding new records across different modules more easier. It allows users to create important records, like leads, tasks, or invoices, from virtually anywhere within the Odoo interface. This feature enhances efficiency by reducing the need to navigate through multiple menus.
|
||
</p>
|
||
<a href="https://youtu.be/RNZCbBgwhsk" target="_blank" class="btn mb-3 mt-3 fw-bold fs-6 rounded-1 pt-3 pb-3 ps-4 pe-4"
|
||
style="text-decoration:none;background-color: #2d3150;color:#fff">View
|
||
More</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row align-items-center pt-5">
|
||
<div class="col-xxl-5 col-xl-7 col-lg-7 col-md-12">
|
||
<div class="sh-content text-lg-start text-center">
|
||
<h2 class="text-lg-start text-sm-center mb-3 fw-bold fs-2" style="color: #2d3150;">Recently Viewed Records Feature
|
||
</h2>
|
||
<p class="text-lg-start text-sm-center fw-normal mt-3 mb-2"
|
||
style="color: #545454;line-height: 30px;font-size: 18px;">We are introduce the new feature 'Recently Viewed Records'! This new feature tracks the records you accessed and makes them easily retrievable, saving you time and boosting productivity. Whether you're managing sales, accounting, or inventory, you can quickly return to important tasks without searching.
|
||
</p>
|
||
<a href="#appicons" class="btn mb-3 mt-3 fw-bold fs-6 rounded-1 pt-3 pb-3 ps-4 pe-4"
|
||
style="text-decoration:none;background-color: #2d3150;color:#fff">View
|
||
More</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-xxl-7 col-xl-5 col-lg-5 col-md-12 order-lg-0 order-2">
|
||
<img class="w-100" src="tiles/17_recently_viewed_records.gif" alt="Card image">
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<!--==================== Theme Demo end ========================== -->
|
||
<!--==================== choose start ========================== -->
|
||
<section class="position-relative mb-5" style=" margin-left: calc(-50vw + 50%);width: 99.4vw;">
|
||
<div class="sh_choose ">
|
||
<img src="features/1.png" class="w-100" />
|
||
</div>
|
||
</section>
|
||
<!--==================== choose end ========================== -->
|
||
<!--==================== sh_theme_demo start ========================== -->
|
||
<section class="sh_theme_demo mb-5">
|
||
<div class="container">
|
||
<div class="row align-items-center pb-lg-5 pb-3">
|
||
<div class="col-xxl-7 col-xl-7 col-lg-7 col-md-12 order-lg-0 order-2">
|
||
<img class="w-100" src="tiles/16_show_attachment_in_list_view.gif" alt="Card image">
|
||
</div>
|
||
<div class="col-xxl-5 col-xl-5 col-lg-5 col-md-12">
|
||
<div class="sh-content text-lg-start text-center">
|
||
<h2 class="text-lg-start text-sm-center mb-3 fw-bold fs-2" style="color: #2d3150;">
|
||
Show Attachment In List View
|
||
</h2>
|
||
<p class="text-lg-start text-sm-center fw-normal mt-3 mb-2"
|
||
style="color: #545454;line-height: 30px;font-size: 18px;">
|
||
This feature enables you to view order attachments directly within the list view. Using this feature, no need to open individual order records to view the attachments. Now you can easily review attachments that are attached with orders from the list view.
|
||
</p>
|
||
<a href="#appicons"
|
||
class="btn mb-3 mt-3 fw-bold fs-6 rounded-1 pt-3 pb-3 ps-4 pe-4"
|
||
style="text-decoration:none;background-color: #2d3150;color:#fff">Watch
|
||
Video</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row align-items-center pt-lg-5 pt-3">
|
||
<div class="col-xxl-5 col-xl-5 col-lg-5 col-md-12">
|
||
<div class="sh-content text-lg-start text-center">
|
||
<h2 class="text-lg-start text-sm-center mb-3 fw-bold fs-2" style="color: #2d3150;">Group By
|
||
List View
|
||
Expand/Collapse
|
||
</h2>
|
||
<p class="text-lg-start text-sm-center fw-normal mt-3 mb-2"
|
||
style="color: #545454;line-height: 30px;font-size: 18px;">We have designed a tree view
|
||
with an Expand/ Collapse feature. This feature enables the expand/collapse functionality
|
||
in the group by list view.
|
||
</p>
|
||
<a href="#LanguageSelector" class="btn mb-3 mt-3 fw-bold fs-6 rounded-1 pt-3 pb-3 ps-4 pe-4"
|
||
style="text-decoration:none;background-color: #2d3150;color:#fff">Watch
|
||
Video</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-xxl-7 col-xl-7 col-lg-7 col-md-12 order-lg-0 order-2">
|
||
<img class="w-100" src="tiles/2_Group_By_List_View_Expand_Collapse.gif" alt="Card image">
|
||
</div>
|
||
</div>
|
||
<div class="card text-white border-0 pt-5 mb-5" style=" margin-left: calc(-50vw + 50%);width: 99.4vw;">
|
||
<img class="card-img" src="tiles/3_Multi_Tab.gif" alt="Card image">
|
||
</div>
|
||
<div class="row align-items-center pb-lg-5 pb-3">
|
||
<div class="col-xxl-7 col-xl-7 col-lg-7 col-md-12 order-lg-0 order-2">
|
||
<img class="w-100" src="tiles/4_todo.gif" alt="Card image">
|
||
</div>
|
||
<div class="col-xxl-5 col-xl-5 col-lg-5 col-md-12">
|
||
<div class="sh-content text-lg-start text-center">
|
||
<h2 class="text-lg-start text-sm-center mb-3 fw-bold fs-2" style="color: #2d3150;">
|
||
To Do List
|
||
</h2>
|
||
<p class="text-lg-start text-sm-center fw-normal mt-3 mb-2"
|
||
style="color: #545454;line-height: 30px;font-size: 18px;">The "To Do" feature helps to
|
||
make a list of pending work so you can easily manage all tasks. Once you create you can
|
||
edit and remove that created "To Do". When
|
||
your "To Do" is done you can tick it so that move to the last and if you untick then it
|
||
comes at first in the list.
|
||
</p>
|
||
<a href="#multitab" class="btn mb-3 mt-3 fw-bold fs-6 rounded-1 pt-3 pb-3 ps-4 pe-4"
|
||
style="text-decoration:none;background-color: #2d3150;color:#fff">Watch
|
||
Video</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row align-items-center pt-lg-5 pt-3">
|
||
<div class="col-xxl-5 col-xl-5 col-lg-5 col-md-12">
|
||
<div class="sh-content text-lg-start text-center">
|
||
<h2 class="text-lg-start text-sm-center mb-3 fw-bold fs-2" style="color: #2d3150;">Bookmark
|
||
</h2>
|
||
<p class="text-lg-start text-sm-center fw-normal mt-3 mb-2"
|
||
style="color: #545454;line-height: 30px;font-size: 18px;">Introducing our bookmark
|
||
feature – your personalized gateway to effortless organization and quick access. Save
|
||
your favorite content with a simple click, creating a curated collection that reflects
|
||
your interests.
|
||
</p>
|
||
<a href="#multitab" class="btn mb-3 mt-3 fw-bold fs-6 rounded-1 pt-3 pb-3 ps-4 pe-4"
|
||
style="text-decoration:none;background-color: #2d3150;color:#fff">Watch
|
||
Video</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-xxl-7 col-xl-7 col-lg-7 col-md-12">
|
||
<img class="w-100" src="tiles/5_bookmark.gif" alt="Card image">
|
||
</div>
|
||
</div>
|
||
<div class="card text-white border-0 pt-5 mb-5" style=" margin-left: calc(-50vw + 50%);width: 99.4vw;">
|
||
<img class="card-img" src="tiles/6_Checkbox_and_Radio_button.png" alt="Card image">
|
||
</div>
|
||
<div class="row align-items-center pb-lg-5 pb-3">
|
||
<div class="col-xxl-7 col-xl-7 col-lg-7 col-md-12 order-lg-0 order-2">
|
||
<img class="w-100" src="tiles/7_Zoom_In_Out.gif" alt="Card image">
|
||
</div>
|
||
<div class="col-xxl-5 col-xl-5 col-lg-5 col-md-12">
|
||
<h2 class="text-lg-start text-sm-center mb-3 fw-bold fs-2" style="color: #2d3150;">Zoom In/Zoom
|
||
Out
|
||
</h2>
|
||
<p class="text-lg-start text-sm-center fw-normal mt-3 mb-2"
|
||
style="color: #545454;line-height: 30px;font-size: 18px;">We have added one beautiful
|
||
feature Zoom In/Zoom out.
|
||
Using this feature you can zoom in / zoom out the main view of odoo. Like form view, tree
|
||
view, kanban view quickly.
|
||
</p>
|
||
<a href="#multitab" class="btn mb-3 mt-3 fw-bold fs-6 rounded-1 pt-3 pb-3 ps-4 pe-4"
|
||
style="text-decoration:none;background-color: #2d3150;color:#fff">Watch
|
||
Video</a>
|
||
</div>
|
||
</div>
|
||
<div class="row align-items-center pt-lg-5 pt-3">
|
||
<div class="col-xxl-5 col-xl-5 col-lg-5 col-md-12">
|
||
<div class="sh-content text-lg-start text-center">
|
||
<h2 class="text-lg-start text-sm-center mb-3 fw-bold fs-2" style="color: #2d3150;">Language
|
||
Selector
|
||
</h2>
|
||
<p class="text-lg-start text-sm-center fw-normal mt-3 mb-2"
|
||
style="color: #545454;line-height: 30px;font-size: 18px;">Odoo have one beautiful
|
||
feature that is multi language. But some time it is hard to change the language in one
|
||
click. Using this feature you can change the language in single click. (Ensure that the
|
||
languages you wish to use are enabled.)
|
||
</p>
|
||
<a href="#LanguageSelector" class="btn mb-3 mt-3 fw-bold fs-6 rounded-1 pt-3 pb-3 ps-4 pe-4"
|
||
style="text-decoration:none;background-color: #2d3150;color:#fff">Watch
|
||
Video</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-xxl-7 col-xl-7 col-lg-7 col-md-12">
|
||
<img class="w-100" src="tiles/8_Language_Selector.gif" alt="Card image">
|
||
</div>
|
||
</div>
|
||
<div class="card text-white border-0 pt-5 mb-5" style=" margin-left: calc(-50vw + 50%);width: 99.4vw;">
|
||
<img class="card-img" src="tiles/9_breadcrumbs_form_element_tab_style.png" alt="Card image">
|
||
</div>
|
||
<div class="row align-items-center pb-lg-5 pb-3">
|
||
<div class="col-xxl-7 col-xl-7 col-lg-7 col-md-12 order-lg-0 order-2">
|
||
<img class="w-100" src="tiles/10_Web_push_Notification.gif" alt="Card image">
|
||
</div>
|
||
<div class="col-xxl-5 col-xl-5 col-lg-5 col-md-12">
|
||
<div class="sh-content text-lg-start text-center">
|
||
<h2 class="text-lg-start text-sm-center mb-3 fw-bold fs-2" style="color: #2d3150;">
|
||
Web Push Notification
|
||
</h2>
|
||
<p class="text-lg-start text-sm-center fw-normal mt-3 mb-2"
|
||
style="color: #545454;line-height: 30px;font-size: 18px;">Here in this theme, you have
|
||
another amazing utility is 'Web Push Notification'. This feature allows you to send push
|
||
notifications to your users with the help of Firebase.
|
||
</p>
|
||
<a href="#LanguageSelector" class="btn mb-3 mt-3 fw-bold fs-6 rounded-1 pt-3 pb-3 ps-4 pe-4"
|
||
style="text-decoration:none;background-color: #2d3150;color:#fff">Watch
|
||
Video</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row align-items-center pt-lg-5 pt-3">
|
||
<div class="col-xxl-5 col-xl-5 col-lg-5 col-md-12">
|
||
<div class="sh-content text-lg-start text-center">
|
||
<h2 class="text-lg-start text-sm-center mb-3 fw-bold fs-2" style="color: #2d3150;">
|
||
Template Styles
|
||
</h2>
|
||
<p class="text-lg-start text-sm-center fw-normal mt-3 mb-2"
|
||
style="color: #545454;line-height: 30px;font-size: 18px;">Our aim is to offer
|
||
flexibility and adaptability to suit various needs. You can effortlessly customize
|
||
settings and configurations in theme to meet the specific requirements. Cheers!
|
||
</p>
|
||
<a href="#TemplateStyles" class="btn mb-3 mt-3 fw-bold fs-6 rounded-1 pt-3 pb-3 ps-4 pe-4"
|
||
style="text-decoration:none;background-color: #2d3150;color:#fff">Watch
|
||
Video</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-xxl-7 col-xl-7 col-lg-7 col-md-12">
|
||
<img class="w-100" src="tiles/11_Template_Style.gif" alt="Card image">
|
||
</div>
|
||
</div>
|
||
<div class="card text-white border-0 pt-5 mb-5" style=" margin-left: calc(-50vw + 50%);width: 99.4vw;">
|
||
<img class="card-img" src="tiles/12_Button&SeparatorStyle.png" alt="Card image">
|
||
</div>
|
||
<div class="row align-items-center pb-lg-5 pb-3">
|
||
<div class="col-xxl-7 col-xl-7 col-lg-7 col-md-12 order-lg-0 order-2">
|
||
<img class="w-100" src="tiles/13_Login_Style.gif" alt="Card image">
|
||
</div>
|
||
<div class="col-xxl-5 col-xl-5 col-lg-5 col-md-12">
|
||
<div class="sh-content text-lg-start text-center">
|
||
<h2 class="text-lg-start text-sm-center mb-3 fw-bold fs-2" style="color: #2d3150;">Login
|
||
Styles
|
||
</h2>
|
||
<p class="text-lg-start text-sm-center fw-normal mt-3 mb-2"
|
||
style="color: #545454;line-height: 30px;font-size: 18px;">Here in this theme, we provide
|
||
4 different well-crafted login styles. Also,
|
||
you can set the display company icon/logo on the login screen.
|
||
</p>
|
||
<a href="#TemplateStyles" class="btn mb-3 mt-3 fw-bold fs-6 rounded-1 pt-3 pb-3 ps-4 pe-4"
|
||
style="text-decoration:none;background-color: #2d3150;color:#fff">View
|
||
More</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row align-items-center pt-lg-5 pt-3">
|
||
<div class="col-xxl-5 col-xl-5 col-lg-5 col-md-12">
|
||
<div class="sh-content text-lg-start text-center">
|
||
<h2 class="text-lg-start text-sm-center mb-3 fw-bold fs-2" style="color: #2d3150;">
|
||
Calculator
|
||
</h2>
|
||
<p class="text-lg-start text-sm-center fw-normal mt-3 mb-2"
|
||
style="color: #545454;line-height: 30px;font-size: 18px;">Here in this theme, you have
|
||
amazing utility is calculator. Easy to enable/disable this utility as per users.
|
||
</p>
|
||
<a href="#TemplateStyles" class="btn mb-3 mt-3 fw-bold fs-6 rounded-1 pt-3 pb-3 ps-4 pe-4"
|
||
style="text-decoration:none;background-color: #2d3150;color:#fff">Watch
|
||
Video</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-xxl-7 col-xl-7 col-lg-7 col-md-12">
|
||
<img class="w-100" src="tiles/14_Calculator.gif" alt="Card image">
|
||
</div>
|
||
</div>
|
||
<div class="card text-white border-0 pb-lg-5 pb-3 pt-5" style=" margin-left: calc(-50vw + 50%);width: 99.4vw;">
|
||
<img class="card-img" src="tiles/15.png" alt="Card image">
|
||
</div>
|
||
<div class="row align-items-center">
|
||
<div class="col-xxl-7 col-xl-7 col-lg-7 col-md-12 order-lg-0 order-2">
|
||
<img class="w-100" src="tiles/1_open_record_in_new_tab _feature.gif" alt="Card image">
|
||
</div>
|
||
<div class="col-xxl-5 col-xl-5 col-lg-5 col-md-12">
|
||
<div class="sh-content text-lg-start text-center">
|
||
<h2 class="text-lg-start text-sm-center mb-3 fw-bold fs-2" style="color: #2d3150;">Open
|
||
Record In New Tab
|
||
</h2>
|
||
<p class="text-lg-start text-sm-center fw-normal mt-3 mb-2"
|
||
style="color: #545454;line-height: 30px;font-size: 18px;">This functionality allows you
|
||
to simultaneously view multiple orders in a new tab. With this feature, there's no
|
||
requirement to open each order separately to access order details. Instead, you can
|
||
conveniently review the selected orders details all at once directly from the orders
|
||
list view.
|
||
</p>
|
||
<a href="#Kanbastyle"
|
||
class="btn mb-3 mt-3 fw-bold fs-6 rounded-1 pt-3 pb-3 ps-4 pe-4"
|
||
style="text-decoration:none;background-color: #2d3150;color:#fff">Watch
|
||
Video</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<!--==================== sh_theme_demo end ========================== -->
|
||
<!--====================Tab Section start ========================== -->
|
||
<div class="position-relative ">
|
||
<div class="sh_heading position-relative pt-5 pb-5">
|
||
<section id="sh_tab" style="padding-top: 50px;">
|
||
<div class="container">
|
||
<!--====Tab start ===== -->
|
||
<ul class="nav nav-tabs justify-content-center shadow-sm" role="tablist"
|
||
style="justify-content: center;padding: 10px 10px;background-color: #e1f5f4;margin: 0px auto;border-radius: 5px;">
|
||
<li class="nav-item"
|
||
style="border-radius: 20px; color: #fff;font-size: 16px;width: fit-content;margin: 0px auto;border-radius: 5px; background-color:transparent; border-radius:10px; ">
|
||
<a class="nav-link active" data-bs-toggle="tab" href="#Screenshot"
|
||
style="color:#111c43;border-radius: 5px;border: 0px;border-radius: 5px;border: 0px;font-weight: 600;">Configuration</a>
|
||
</li>
|
||
<li class="nav-item"
|
||
style="border-radius: 20px; color: #fff;font-size: 16px;width: fit-content;margin: 0px auto;border-radius: 5px; background-color:transparent; border-radius:10px; ">
|
||
<a class="nav-link" data-bs-toggle="tab" href="#FAQ"
|
||
style="color:#111c43;border-radius: 5px;border: 0px;font-weight: 600;">FAQs</a>
|
||
</li>
|
||
<li class="nav-item"
|
||
style="border-radius: 20px; color: #fff;font-size: 16px;width: fit-content;margin: 0px auto;border-radius: 5px; background-color:transparent; border-radius:10px; ">
|
||
<a class="nav-link" data-bs-toggle="tab" href="#Release"
|
||
style="color:#111c43;border-radius: 5px;border: 0px;font-weight: 600;">Releases</a>
|
||
</li>
|
||
<li class="nav-item"
|
||
style="background-color: rgba(25, 118, 210, 0.75); border-radius: 20px; color: #fff;font-size: 16px;width: fit-content;margin: 0px auto;border-radius: 5px; background-color:transparent; border-radius:10px; ">
|
||
<a class="nav-link" data-bs-toggle="tab" href="#Support"
|
||
style="color:#111c43;border-radius: 5px;border: 0px;font-weight: 600;">Support</a>
|
||
</li>
|
||
</ul>
|
||
<!--====Tab end ===== -->
|
||
<div class="tab-content" style="margin-top: 30px;">
|
||
<!-- =============== Customization Start ==================== -->
|
||
<div id="Screenshot" class="container tab-pane active p-0">
|
||
<div class="sh_customization ms-0 w-100"
|
||
style="padding: 50px 20px;border-radius: 10px;margin-bottom: 50px;background-color: #e1f5f4">
|
||
<div class="row mt-3">
|
||
<div class="col-xl-12 p-0">
|
||
<div class="d-inline-flex w-100 nav nav-pills mb-3 justify-content-center bg-transparent d-flex"
|
||
id="pills-tab" role="tablist">
|
||
<a aria-controls="appicons"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3 active"
|
||
data-bs-toggle="tab" href="#appicons" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="true">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius:5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Sidebar style with Different App Icons
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="quickcreate"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3"
|
||
data-bs-toggle="tab" href="#quickcreate" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="false">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius:5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Quick Create <img class="position-absolute top-2 start-1 translate-middle mt-3" src="new2.png" alt="new_tag_ribbon" style="height:35px">
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="recentlyviewedrecords"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3"
|
||
data-bs-toggle="tab" href="#recentlyviewedrecords" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="false">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius:5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Recently Viewed Records <img class="position-absolute top-2 start-1 translate-middle mt-3" src="new2.png" alt="new_tag_ribbon" style="height:35px">
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="Attachment"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3"
|
||
data-bs-toggle="tab" href="#Attachment" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="false">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius:5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Show Attachment In List View
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
|
||
</div>
|
||
</div>
|
||
<div class="col-xl-12 p-0">
|
||
<div class="shadow-lg tab-content" id="pills-tabContent" style="border-radius: 20px">
|
||
<div class="tab-pane fade bg-white show text-center active"
|
||
id="appicons" role="tabpanel" aria-labelledby="appicons-tab"
|
||
tabindex="0" style="border-radius: 20px;padding-top: 15px ">
|
||
<strong>In the Backmate Enterprise Theme, the sidebar feature offers customisable background colors and allows users to set images. Additionally, it provides five different icon styles: line, light , dual-tone, and 3D icons, glass , along with options to configure animations for side open and close actions, including collapses and expansions.</strong>
|
||
<div id="demo2" class="carousel slide bg-white"
|
||
data-bs-ride="carousel"
|
||
style="padding:10px;border-radius:20px;">
|
||
<div class="carousel-inner">
|
||
<div class="carousel-item active">
|
||
<img src="ss/app_icon/1.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/2.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/3.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/4.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/5.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/collapse_1.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/collapse_2.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/collapse_3.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/collapse_4.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/collapse_5.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/collapse_6.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/bg-image_collapse1.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/bg-image_collapse2.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/bg-image_collapse3.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/bg-image_collapse4.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/bg-image_collapse5.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/bg-image_collapse6.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/bg-image_expand1.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/bg-image_expand2.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/bg-image_expand3.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/bg-image_expand4.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/bg-image_expand5.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/app_icon/bg-image_expand6.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
</div>
|
||
<a class="carousel-control-prev" href="#demo2"
|
||
data-bs-slide="prev">
|
||
<span class="carousel-control-prev-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
<a class="carousel-control-next" href="#demo2"
|
||
data-bs-slide="next">
|
||
<span class="carousel-control-next-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="tab-pane fade bg-white show text-center"
|
||
id="quickcreate" role="tabpanel" aria-labelledby="quickcreate-tab"
|
||
tabindex="0" style="border-radius: 20px">
|
||
<div id="demo_recently_viewed" class="carousel slide bg-white"
|
||
data-bs-ride="carousel"
|
||
style="padding:10px;border-radius:20px;">
|
||
<div class="carousel-inner">
|
||
<div class="carousel-item active">
|
||
<img src="ss/quick_create/1.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/quick_create/2.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/quick_create/3.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/quick_create/4.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/quick_create/5.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/quick_create/6.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/quick_create/7.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
</div>
|
||
<a class="carousel-control-prev" href="#demo_recently_viewed"
|
||
data-bs-slide="prev">
|
||
<span class="carousel-control-prev-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
<a class="carousel-control-next" href="#demo_recently_viewed"
|
||
data-bs-slide="next">
|
||
<span class="carousel-control-next-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="tab-pane fade bg-white show text-center"
|
||
id="recentlyviewedrecords" role="tabpanel" aria-labelledby="recentlyviewedrecords-tab"
|
||
tabindex="0" style="border-radius: 20px">
|
||
<div id="demo_recently_viewed" class="carousel slide bg-white"
|
||
data-bs-ride="carousel"
|
||
style="padding:10px;border-radius:20px;">
|
||
<div class="carousel-inner">
|
||
<div class="carousel-item active">
|
||
<img src="ss/recently_viewed_record/1.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/recently_viewed_record/2.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/recently_viewed_record/3.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/recently_viewed_record/4.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<video class="w-100" autoplay loop muted
|
||
style="border-radius: 10px;">
|
||
<source src="video/recently_viewed_records.mp4"
|
||
type="video/mp4" />
|
||
</video>
|
||
</div>
|
||
</div>
|
||
<a class="carousel-control-prev" href="#demo_recently_viewed"
|
||
data-bs-slide="prev">
|
||
<span class="carousel-control-prev-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
<a class="carousel-control-next" href="#demo_recently_viewed"
|
||
data-bs-slide="next">
|
||
<span class="carousel-control-next-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="tab-pane fade bg-white" id="Attachment"
|
||
role="tabpanel" aria-labelledby="Attachment" tabindex="0"
|
||
style="padding: 10px;border-radius: 20px ">
|
||
<video class="w-100" autoplay loop muted
|
||
style="border-radius: 20px;">
|
||
<source src="video/show_attachment_in_list_view.mp4"
|
||
type="video/mp4" />
|
||
</video> </div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="sh_customization ms-0 w-100"
|
||
style="padding: 50px 20px;border-radius: 10px;margin-bottom: 50px;background-color: #e1f5f4">
|
||
<div class="row mt-3">
|
||
<div class=" col-xl-12 d-flex p-0">
|
||
<div class="d-inline-flex w-100 nav nav-pills mb-3 justify-content-center bg-transparent d-flex"
|
||
id="pills-tab" role="tablist">
|
||
<a aria-controls="multitab"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3 active"
|
||
data-bs-toggle="tab" href="#multitab" role="tab"
|
||
style="height:55px;border-radius: 10px;" aria-selected="true">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px;border-radius:5px;padding:15px;width: 100%;">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Multi tab
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="ToDoList"
|
||
class="d-inline-flex flex-row mr-3 nav-link p-0 me-2 mb-3"
|
||
data-bs-toggle="tab" href="#ToDoList" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="false">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius:5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
To Do List
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="Bookmark"
|
||
class="d-flex flex-row mr-3 nav-link p-0 me-2 mb-3"
|
||
data-bs-toggle="tab" href="#Bookmark" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="false">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius:5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Bookmark
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="ZoomInZoomOut"
|
||
class="d-flex flex-row nav-link p-0 me-2 mb-3" data-bs-toggle="tab"
|
||
href="#ZoomInZoomOut" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="false">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius:5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Zoom In/Zoom Out
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="globalsearchtab"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3"
|
||
data-bs-toggle="tab" href="#globalsearchtab" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="false">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius:5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Global Search
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-xl-12 p-0">
|
||
<div class="shadow-lg tab-content" id="pills-tabContent" style="border-radius: 20px">
|
||
|
||
<div class="tab-pane fade bg-white show text-center active" id="multitab"
|
||
role="tabpanel" aria-labelledby="multitab" tabindex="0"
|
||
style="padding: 10px;border-radius: 20px ">
|
||
<strong>When you press the Shift key along with the menu key, it adds item in multiple tabs.</strong>
|
||
<img class="card-img" src="video/MultiTab.gif" alt="Card image" style="border-radius: 20px;padding-top: 10px;">
|
||
</div>
|
||
<div class="tab-pane fade bg-white text-center" id="ToDoList"
|
||
role="tabpanel" aria-labelledby="ToDoList-tab" tabindex="0"
|
||
style="padding: 10px;border-radius: 20px ">
|
||
<img class="w-100" src="video/todo.gif" alt="Card image" style="border-radius: 20px;">
|
||
</div>
|
||
<div class="tab-pane fade bg-white text-center" id="Bookmark"
|
||
role="tabpanel" aria-labelledby="Bookmark-tab" tabindex="0"
|
||
style="padding: 10px;border-radius: 20px ">
|
||
<strong>When you click once, the bookmark drop-down will open, and when you double-click, the menu will be added as a bookmark.</strong>
|
||
<img class="w-100" src="video/bookmark.gif" alt="Card image" style="border-radius: 20px;padding-top: 10px;">
|
||
</div>
|
||
<div class="tab-pane fade bg-white text-center" id="ZoomInZoomOut"
|
||
role="tabpanel" aria-labelledby="ZoomInZoomOut-tab" tabindex="0"
|
||
style="padding: 10px;border-radius: 20px ">
|
||
<img class="w-100" src="video/ZoomView.gif" alt="Card image" style="border-radius: 20px;">
|
||
</div>
|
||
<div class="tab-pane fade bg-white" id="globalsearchtab"
|
||
role="tabpanel" aria-labelledby="globalsearchtab" tabindex="0"
|
||
style="padding: 10px;border-radius: 20px ">
|
||
<img class="w-100" src="video/globalsearch.gif" alt="Card image" style="border-radius: 20px;">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="sh_customization ms-0 w-100"
|
||
style="padding: 50px 20px;border-radius: 10px;margin-bottom: 50px;background-color: #e1f5f4">
|
||
<div class="row mt-3">
|
||
<div class="col-xl-12 p-0">
|
||
<div class="d-inline-flex w-100 nav nav-pills mb-3 justify-content-center bg-transparent d-flex"
|
||
id="pills-tab" role="tablist">
|
||
<a aria-controls="LanguageSelector"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3 active"
|
||
data-bs-toggle="tab" href="#LanguageSelector" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="true">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius:5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Language Selector
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="WebPushNotification"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3"
|
||
data-bs-toggle="tab" href="#WebPushNotification" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="false">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius:5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Web Push Notification
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="expandcollapse"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3"
|
||
data-bs-toggle="tab" href="#expandcollapse" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="false">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius:5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Group By List View Expand/Collapse
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="RefreshPage"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3"
|
||
data-bs-toggle="tab" href="#RefreshPage" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="false">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius:5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Refresh Page
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="fonticons"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3"
|
||
data-bs-toggle="tab" href="#fonticons" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="false">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius:5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Font Icons
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-xl-12 p-0">
|
||
<div class="shadow-lg tab-content" id="pills-tabContent" style="border-radius: 20px">
|
||
<div class="tab-pane bg-white fade text-center active show"
|
||
id="LanguageSelector" role="tabpanel"
|
||
aria-labelledby="LanguageSelector-tab" tabindex="0"
|
||
style="padding: 10px;border-radius: 20px ">
|
||
<img src="video/Language.gif" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="tab-pane bg-white fade text-center"
|
||
id="WebPushNotification" role="tabpanel"
|
||
aria-labelledby="WebPushNotification-tab" tabindex="0"
|
||
style="padding: 10px;border-radius: 20px ">
|
||
<img src="video/backmate_adv_web_push_notifications.gif" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="tab-pane fade bg-white" id="expandcollapse" role="tabpanel"
|
||
aria-labelledby="expandcollapse-tab" tabindex="0"
|
||
style="padding: 10px;border-radius: 20px ">
|
||
<img src="video/GroupbyListViewExpand-Collapse.gif" class="d-block w-100"
|
||
alt="..." style="border-radius: 20px;">
|
||
</div>
|
||
<div class="tab-pane fade bg-white" id="RefreshPage" role="tabpanel"
|
||
aria-labelledby="RefreshPage-tab" tabindex="0"
|
||
style="padding: 10px;border-radius: 20px ">
|
||
<video class="w-100" autoplay loop muted
|
||
style="border-radius: 20px;">
|
||
<source src="video/Refresh_page.mp4"
|
||
type="video/mp4" />
|
||
</video>
|
||
</div>
|
||
<div class="tab-pane fade bg-white" id="fonticons" role="tabpanel"
|
||
aria-labelledby="fonticons-tab" tabindex="0"
|
||
style="padding: 10px;border-radius: 20px ">
|
||
<img class="w-100" src="video/new-font-icons.gif" alt="Card image" style="border-radius: 20px;">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="sh_customization ms-0 w-100"
|
||
style="padding: 50px 20px;border-radius: 10px;margin-bottom: 50px;background-color: #e1f5f4">
|
||
<div class="row mt-3">
|
||
<div class="col-xl-12 p-0">
|
||
<div class="d-inline-flex w-100 nav nav-pills mb-3 justify-content-center bg-transparent d-flex"
|
||
id="pills-tab" role="tablist">
|
||
<a aria-controls="TemplateStyles"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3 active"
|
||
data-bs-toggle="tab" href="#TemplateStyles" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="true">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius: 5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Template Styles
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="nightmode"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3"
|
||
data-bs-toggle="tab" href="#nightmode" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="true">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius: 5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Night Mode
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="calculator"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3"
|
||
data-bs-toggle="tab" href="#calculator" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="false">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius: 5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Calculator
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="LoginStyles"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3"
|
||
data-bs-toggle="tab" href="#LoginStyles" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="false">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius: 5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Login Styles
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="listviewstyle"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3"
|
||
data-bs-toggle="tab" href="#listviewstyle" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="false">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius: 5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Predefined Listview Style
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-xl-12 p-0">
|
||
<div class="shadow-lg tab-content" id="pills-tabContent" style="border-radius: 20px">
|
||
<div class="tab-pane fade bg-white show text-center active"
|
||
id="TemplateStyles" role="tabpanel" aria-labelledby="TemplateStyles-tab"
|
||
tabindex="0" style="border-radius: 20px">
|
||
<div id="demo3" class="carousel slide bg-white"
|
||
data-bs-ride="carousel"
|
||
style="padding:10px;border-radius:20px;">
|
||
<div class="carousel-inner">
|
||
<div class="carousel-item active">
|
||
<img src="ss/theme_style/list.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/theme_style/kanban_view.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/theme_style/form.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/theme_style/calander.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/theme_style/activity.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/theme_style/pivot.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
</div>
|
||
<a class="carousel-control-prev" href="#demo3"
|
||
data-bs-slide="prev">
|
||
<span class="carousel-control-prev-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
<a class="carousel-control-next" href="#demo3"
|
||
data-bs-slide="next">
|
||
<span class="carousel-control-next-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="tab-pane fade bg-white show text-center"
|
||
id="nightmode" role="tabpanel" aria-labelledby="nightmode"
|
||
tabindex="0" style="border-radius: 20px">
|
||
<div id="night_mode" class="carousel slide bg-white"
|
||
data-bs-ride="carousel"
|
||
style="padding:10px;border-radius:20px;">
|
||
<div class="carousel-inner">
|
||
<div class="carousel-item active">
|
||
<img src="ss/nightmode/kanban_view.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/nightmode/listview.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/nightmode/formview.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/nightmode/calanderview.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/nightmode/pivotview.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/nightmode/graphview.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/nightmode/activityview.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
</div>
|
||
<a class="carousel-control-prev" href="#night_mode"
|
||
data-bs-slide="prev">
|
||
<span class="carousel-control-prev-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
<a class="carousel-control-next" href="#night_mode"
|
||
data-bs-slide="next">
|
||
<span class="carousel-control-next-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="tab-pane fade bg-white text-center "
|
||
id="calculator" role="tabpanel"
|
||
aria-labelledby="calculator-tab" tabindex="0"
|
||
style="border-radius: 20px">
|
||
<div id="demo4" class="carousel slide bg-white"
|
||
data-bs-ride="carousel"
|
||
style="padding:10px;border-radius:20px;">
|
||
<div class="carousel-inner">
|
||
<div class="carousel-item active">
|
||
<img src="video/calculater.gif" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/calculater/1.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/calculater/2.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/calculater/3.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/calculater/4.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
</div>
|
||
<a class="carousel-control-prev" href="#demo4"
|
||
data-bs-slide="prev">
|
||
<span class="carousel-control-prev-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
<a class="carousel-control-next" href="#demo4"
|
||
data-bs-slide="next">
|
||
<span class="carousel-control-next-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="tab-pane fade bg-white text-center"
|
||
id="LoginStyles" role="tabpanel"
|
||
aria-labelledby="LoginStyles-tab" tabindex="0"
|
||
style="border-radius: 20px">
|
||
<div id="demo5" class="carousel slide bg-white"
|
||
data-bs-ride="carousel"
|
||
style="padding:10px;border-radius:20px;">
|
||
<div class="carousel-inner">
|
||
<div class="carousel-item active">
|
||
<img src="ss/login_style/1.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/login_style/2.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/login_style/3.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/login_style/4.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/login_style/5.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
</div>
|
||
<a class="carousel-control-prev" href="#demo5"
|
||
data-bs-slide="prev">
|
||
<span class="carousel-control-prev-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
<a class="carousel-control-next" href="#demo5"
|
||
data-bs-slide="next">
|
||
<span class="carousel-control-next-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="tab-pane fade bg-white text-center"
|
||
id="listviewstyle" role="tabpanel"
|
||
aria-labelledby="listviewstyle-tab" tabindex="0"
|
||
style="border-radius: 20px">
|
||
<div id="demo6" class="carousel slide bg-white"
|
||
data-bs-ride="carousel"
|
||
style="padding:10px;border-radius:20px;">
|
||
<div class="carousel-inner">
|
||
<div class="carousel-item active">
|
||
<img src="ss/listview_style/1.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/listview_style/2.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/listview_style/3.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/listview_style/4.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/listview_style/5.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
</div>
|
||
<a class="carousel-control-prev" href="#demo6"
|
||
data-bs-slide="prev">
|
||
<span class="carousel-control-prev-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
<a class="carousel-control-next" href="#demo6"
|
||
data-bs-slide="next">
|
||
<span class="carousel-control-next-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="sh_customization ms-0 w-100"
|
||
style="padding: 50px 20px;border-radius: 10px;margin-bottom: 50px;background-color:#e1f5f4">
|
||
<div class="row mt-3">
|
||
<div class="col-xl-12 p-0">
|
||
<div class="d-inline-flex w-100 nav nav-pills mb-3 justify-content-center bg-transparent d-flex"
|
||
id="pills-tab" role="tablist">
|
||
<a aria-controls="Kanbastyle"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3 active"
|
||
data-bs-toggle="tab" href="#Kanbastyle" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="true">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius: 5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Kanban Styles
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="openrecordinnewtab"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3"
|
||
data-bs-toggle="tab" href="#openrecordinnewtab" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="false">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius:5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Open Record In New Tab
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="ListViewCustomisation"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3"
|
||
data-bs-toggle="tab" href="#ListViewCustomisation" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="true">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius: 5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
List View Customisation
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="DisableAutoEditmode"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3"
|
||
data-bs-toggle="tab" href="#DisableAutoEditmode" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="true">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius: 5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
Disable Auto Edit mode
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<a aria-controls="rtl"
|
||
class="d-inline-flex nav-link p-0 me-2 mb-3 mr-3"
|
||
data-bs-toggle="tab" href="#rtl" role="tab"
|
||
style="height:55px; border-radius:15px" aria-selected="true">
|
||
<div class="media bg-white align-items-center shadow-sm"
|
||
style="height:50px; border-radius: 5px; padding:15px">
|
||
<div class="media-body pl-2 pr-2 position-relative">
|
||
<h5 class="d-flex align-items-center m-0 text-left"
|
||
style="text-align:left; background-color:transparent; color:#072146; font-size:16px">
|
||
RTL
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-xl-12 p-0">
|
||
<div class="shadow-lg tab-content" id="pills-tabContent" style="border-radius: 20px">
|
||
<div class="tab-pane fade bg-white show text-center active"
|
||
id="Kanbastyle" role="tabpanel"
|
||
aria-labelledby="Kanbastyle-tab" tabindex="0"
|
||
style="border-radius: 20px">
|
||
<div id="demo7" class="shadow-lg carousel slide bg-white"
|
||
data-bs-ride="carousel"
|
||
style="padding:10px;border-radius:20px;">
|
||
<div class="carousel-inner">
|
||
<div class="carousel-item active">
|
||
<img src="ss/kanban/1.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/kanban/2.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/kanban/3.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/kanban/4.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
</div>
|
||
<a class="carousel-control-prev" href="#demo7"
|
||
data-bs-slide="prev">
|
||
<span class="carousel-control-prev-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
<a class="carousel-control-next" href="#demo7"
|
||
data-bs-slide="next">
|
||
<span class="carousel-control-next-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="tab-pane fade bg-white" id="openrecordinnewtab"
|
||
role="tabpanel" aria-labelledby="openrecordinnewtab" tabindex="0"
|
||
style="padding: 10px;border-radius: 20px ">
|
||
<img class="w-100" src="video/OpenRecordinNew.gif" alt="Card image" style="border-radius: 20px;">
|
||
</div>
|
||
<div class="tab-pane fade bg-white" id="ListViewCustomisation" role="tabpanel"
|
||
aria-labelledby="ListViewCustomisation-tab" tabindex="0"
|
||
style="padding: 10px;border-radius: 20px ">
|
||
<img class="w-100" src="video/list_view.gif" alt="Card image" style="border-radius: 10px;">
|
||
</div>
|
||
<div class="tab-pane fade bg-white" id="DisableAutoEditmode" role="tabpanel"
|
||
aria-labelledby="DisableAutoEditmode-tab" tabindex="0"
|
||
style="padding: 10px;border-radius: 20px ">
|
||
<img class="w-100" src="video/auto_edit.gif" alt="Card image" style="border-radius: 10px;">
|
||
</div>
|
||
<div class="tab-pane fade bg-white text-center"
|
||
id="rtl" role="tabpanel"
|
||
aria-labelledby="rtl-tab" tabindex="0"
|
||
style="border-radius: 20px">
|
||
<div id="demo8" class="shadow-lg carousel slide bg-white"
|
||
data-bs-ride="carousel"
|
||
style="padding:10px;border-radius:20px;">
|
||
<div class="carousel-inner">
|
||
<div class="carousel-item active">
|
||
<img src="ss/rtl/1.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/rtl/2.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/rtl/3.png" class="d-block w-100"
|
||
alt="..." style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/rtl/4.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/rtl/5.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/rtl/6.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="ss/rtl/7.png"
|
||
class="d-block w-100" alt="..."
|
||
style="border-radius: 10px;">
|
||
</div>
|
||
</div>
|
||
<a class="carousel-control-prev" href="#demo8"
|
||
data-bs-slide="prev">
|
||
<span class="carousel-control-prev-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
<a class="carousel-control-next" href="#demo8"
|
||
data-bs-slide="next">
|
||
<span class="carousel-control-next-icon"
|
||
style="background-color: black;border-radius: 5px;padding: 15px;background-size: 50%; "></span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<!-- =============== Customization end ==================== -->
|
||
<!-- =============== Faq Start ==================== -->
|
||
<div id="FAQ" class="tab-pane fade">
|
||
<!-- <strong style="color: #960000;font-size: 18px;">Note :-- The odoo standard night mode feature with the " Backmate Backend Theme Advance - Enterprise" theme is currently experiencing issues and our team is working to fix it promptly. Thank you for your patience.</strong> -->
|
||
<br/><br/> <strong style="color: #960000;font-size: 18px;">Note :-- Be heedful of, This theme is made by keeping in mind only odoo standard addons. If any third party module disturb the theme flow, we are not responsible for that.</strong>
|
||
<div class="accordion" id="accordionPanelsStayOpenExample" style="margin-top: 20px;">
|
||
<div class="accordion-item mb-4"
|
||
style="border-radius: 10px;box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;">
|
||
<h2 class="accordion-header" id="panelsStayOpen-headingOne">
|
||
<a class="accordion-button text-decoration-none" type="button"
|
||
data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseOne"
|
||
aria-expanded="true" aria-controls="panelsStayOpen-collapseOne"
|
||
style="font-weight: 600;border-top: 1px solid rgba(0,0,0,.125);border-radius: 10px;background-color: #e1f5f4;color: black;">
|
||
Is Firebase Push Notifications is compatible with Mac OS or Mobile view?
|
||
</a>
|
||
</h2>
|
||
<div id="panelsStayOpen-collapseOne" class="accordion-collapse collapse show"
|
||
aria-labelledby="panelsStayOpen-headingOne">
|
||
<div class="accordion-body">
|
||
<p>No, It's not compatible with Mac OS or Mobile view.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="accordion-item mb-4"
|
||
style="border-radius: 10px;box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;">
|
||
<h2 class="accordion-header" id="panelsStayOpen-headingTwo">
|
||
<a class="accordion-button collapsed text-decoration-none" type="button"
|
||
data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseTwo"
|
||
aria-expanded="false" aria-controls="panelsStayOpen-collapseTwo"
|
||
style="font-weight: 600;border-top: 1px solid rgba(0,0,0,.125);border-radius: 10px;background-color: #e1f5f4;color: black;">
|
||
Is this login styles is compatible with website (frontend)?
|
||
</a>
|
||
</h2>
|
||
<div id="panelsStayOpen-collapseTwo" class="accordion-collapse collapse"
|
||
aria-labelledby="panelsStayOpen-headingTwo">
|
||
<div class="accordion-body">
|
||
<p> Yes, We have made separate module to get compatibility with website (Frontend). You can purchase using below link.<a href="https://apps.odoo.com/apps/modules/17.0/sh_backmate_adv_enterprise_website_login/" style="color:#1976d2; text-decoration:none">Backmate Backend Theme Advance Enterprise - Compatibility With Frontend (Website)
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="accordion-item mb-4"
|
||
style="border-radius: 10px;box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;">
|
||
<h2 class="accordion-header" id="panelsStayOpen-heading4">
|
||
<a class="accordion-button collapsed text-decoration-none" type="button"
|
||
data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapse4"
|
||
aria-expanded="false" aria-controls="panelsStayOpen-collapse4"
|
||
style="font-weight: 600;border-top: 1px solid rgba(0,0,0,.125);border-radius: 10px;background-color: #e1f5f4;color: black;">
|
||
Is this theme compatible with Odoo Community as well as Enterprise?
|
||
</a>
|
||
</h2>
|
||
<div id="panelsStayOpen-collapse4" class="accordion-collapse collapse"
|
||
aria-labelledby="panelsStayOpen-heading4">
|
||
<div class="accordion-body">
|
||
<p>This theme works perfectly with Odoo Enterprise & odoo.sh only.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="accordion-item mb-4"
|
||
style="border-radius: 10px;box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;">
|
||
<h2 class="accordion-header" id="panelsStayOpen-heading12">
|
||
<a class="accordion-button collapsed text-decoration-none" type="button"
|
||
data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapse12"
|
||
aria-expanded="false" aria-controls="panelsStayOpen-collapse12"
|
||
style="font-weight: 600;border-top: 1px solid rgba(0,0,0,.125);border-radius: 10px;background-color: #e1f5f4;color: black;">
|
||
Is this application compatible with odoo.com(odoo saas)?
|
||
</a>
|
||
</h2>
|
||
<div id="panelsStayOpen-collapse12" class="accordion-collapse collapse"
|
||
aria-labelledby="panelsStayOpen-heading12">
|
||
<div class="accordion-body">
|
||
<p>No, this application is not compatible with odoo.com(odoo saas/Odoo Online).
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="accordion-item mb-4"
|
||
style="border-radius: 10px;box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;">
|
||
<h2 class="accordion-header" id="panelsStayOpen-heading5">
|
||
<a class="accordion-button collapsed text-decoration-none" type="button"
|
||
data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapse5"
|
||
aria-expanded="false" aria-controls="panelsStayOpen-collapse5"
|
||
style="font-weight: 600;border-top: 1px solid rgba(0,0,0,.125);border-radius: 10px;background-color: #e1f5f4;color: black;">
|
||
Is this theme one click installation setup.
|
||
</a>
|
||
</h2>
|
||
<div id="panelsStayOpen-collapse5" class="accordion-collapse collapse"
|
||
aria-labelledby="panelsStayOpen-heading5">
|
||
<div class="accordion-body">
|
||
<p>Yes, you can install this theme with single click.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="accordion-item mb-4"
|
||
style="border-radius: 10px;box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;">
|
||
<h2 class="accordion-header" id="panelsStayOpen-heading7">
|
||
<a class="accordion-button collapsed text-decoration-none" type="button"
|
||
data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapse7"
|
||
aria-expanded="false" aria-controls="panelsStayOpen-collapse7"
|
||
style="font-weight: 600;border-top: 1px solid rgba(0,0,0,.125);border-radius: 10px;background-color: #e1f5f4;color: black;">
|
||
I want some customization in this theme. How can I request it?
|
||
</a>
|
||
</h2>
|
||
<div id="panelsStayOpen-collapse7" class="accordion-collapse collapse"
|
||
aria-labelledby="panelsStayOpen-heading7">
|
||
<div class="accordion-body">
|
||
<p>Please Contact Us at <a href="mailto:sales@softhealer.com"
|
||
style="color:#0f40c4; text-decoration:none">sales@softhealer.com</a>
|
||
to
|
||
request customization.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="accordion-item mb-4"
|
||
style="border-radius: 10px;box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;">
|
||
<h2 class="accordion-header" id="panelsStayOpen-heading8">
|
||
<a class="accordion-button collapsed text-decoration-none" type="button"
|
||
data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapse8"
|
||
aria-expanded="false" aria-controls="panelsStayOpen-collapse8"
|
||
style="font-weight: 600;border-top: 1px solid rgba(0,0,0,.125);border-radius: 10px;background-color: #e1f5f4;color: black;">
|
||
Do I get free support?
|
||
</a>
|
||
</h2>
|
||
<div id="panelsStayOpen-collapse8" class="accordion-collapse collapse"
|
||
aria-labelledby="panelsStayOpen-heading8">
|
||
<div class="accordion-body">
|
||
<p>Yes, we provide free support for 90 days.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="accordion-item mb-4"
|
||
style="border-radius: 10px;box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;">
|
||
<h2 class="accordion-header" id="panelsStayOpen-heading8">
|
||
<a class="accordion-button collapsed text-decoration-none" type="button"
|
||
data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapse9"
|
||
aria-expanded="false" aria-controls="panelsStayOpen-collapse9"
|
||
style="font-weight: 600;border-top: 1px solid rgba(0,0,0,.125);border-radius: 10px;background-color: #e1f5f4;color: black;">
|
||
Do I get free updates?
|
||
</a>
|
||
</h2>
|
||
<div id="panelsStayOpen-collapse9" class="accordion-collapse collapse"
|
||
aria-labelledby="panelsStayOpen-heading8">
|
||
<div class="accordion-body">
|
||
<p>Yes, you will get free update for lifetime.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="accordion-item mb-4"
|
||
style="border-radius: 10px;box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;">
|
||
<h2 class="accordion-header" id="panelsStayOpen-heading10">
|
||
<a class="accordion-button collapsed text-decoration-none" type="button"
|
||
data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapse10"
|
||
aria-expanded="false" aria-controls="panelsStayOpen-collapse10"
|
||
style="font-weight: 600;border-top: 1px solid rgba(0,0,0,.125);border-radius: 10px;background-color: #e1f5f4;color: black;">
|
||
What If I purchase Module In Wrong Version Can I exchange Module With
|
||
Other Versions?
|
||
</a>
|
||
</h2>
|
||
<div id="panelsStayOpen-collapse10" class="accordion-collapse collapse"
|
||
aria-labelledby="panelsStayOpen-heading10">
|
||
<div class="accordion-body">
|
||
<p>No, We do not provide any kind of exchange.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- =============== Faq End ==================== -->
|
||
<!-- =============== Faq end ==================== -->
|
||
<!-- =============== Release Start ==================== -->
|
||
<div id="Release" class="tab-pane fade">
|
||
<div class="sh_content shadow align-items-baseline"
|
||
style="border-radius:10px; padding:20px; margin-bottom:20px">
|
||
<h4
|
||
style="font-size:16px; margin:0; color:#212121; text-decoration:none; font-weight:600; letter-spacing:1px; display:block">
|
||
<span class="fa fa-hand-o-right"
|
||
style="color:#be8a60; font-weight:600; font-size:18px; padding-right:10px"></span>
|
||
<span style="color: #202942;font-size: 18px;">Version 17.0.4</span> | <span
|
||
style="color:#d13b04">Released on : 12<sup>th</sup>
|
||
August
|
||
2024</span>
|
||
</h4>
|
||
<ul
|
||
style="font-size:16px; padding-left:20px; color:#555; margin:0; padding-top:20px">
|
||
<li style="font-weight: 600;color: #202942cf;"><span class="badge bg-success me-2">New </span> Quick Create Feature.</li>
|
||
</ul>
|
||
</div>
|
||
<div class="sh_content shadow align-items-baseline"
|
||
style="border-radius:10px; padding:20px; margin-bottom:20px">
|
||
<h4
|
||
style="font-size:16px; margin:0; color:#212121; text-decoration:none; font-weight:600; letter-spacing:1px; display:block">
|
||
<span class="fa fa-hand-o-right"
|
||
style="color:#be8a60; font-weight:600; font-size:18px; padding-right:10px"></span>
|
||
<span style="color: #202942;font-size: 18px;">Version 17.0.3</span> | <span
|
||
style="color:#d13b04">Released on : 15<sup>th</sup>
|
||
July
|
||
2024</span>
|
||
</h4>
|
||
<ul
|
||
style="font-size:16px; padding-left:20px; color:#555; margin:0; padding-top:20px">
|
||
<li style="font-weight: 600;color: #202942cf;"><span class="badge bg-success me-2">New </span> Recently Viewed Records Feature.</li>
|
||
</ul>
|
||
</div>
|
||
<div class="sh_content shadow align-items-baseline"
|
||
style="border-radius:10px; padding:20px; margin-bottom:20px">
|
||
<h4
|
||
style="font-size:16px; margin:0; color:#212121; text-decoration:none; font-weight:600; letter-spacing:1px; display:block">
|
||
<span class="fa fa-hand-o-right"
|
||
style="color:#be8a60; font-weight:600; font-size:18px; padding-right:10px"></span>
|
||
<span style="color: #202942;font-size: 18px;">Version 17.0.2</span> | <span
|
||
style="color:#d13b04">Released on : 9<sup>th</sup>
|
||
May
|
||
2024</span>
|
||
</h4>
|
||
<ul
|
||
style="font-size:16px; padding-left:20px; color:#555; margin:0; padding-top:20px">
|
||
<li style="font-weight: 600;color: #202942cf;"><span class="badge bg-success me-2">New </span> Show Attachment In List View.</li>
|
||
</ul>
|
||
</div>
|
||
<div class="sh_content shadow align-items-baseline"
|
||
style="border-radius:10px; padding:20px; margin-bottom:20px">
|
||
<h4
|
||
style="font-size:16px; margin:0; color:#212121; text-decoration:none; font-weight:600; letter-spacing:1px; display:block">
|
||
<span class="fa fa-hand-o-right"
|
||
style="color:#be8a60; font-weight:600; font-size:18px; padding-right:10px"></span>
|
||
<span style="color: #202942;font-size: 18px;">Version 17.0.1</span> | <span
|
||
style="color:#d13b04">Released on : 8<sup>th</sup>
|
||
March
|
||
2024</span>
|
||
</h4>
|
||
<ul
|
||
style="font-size:16px; padding-left:20px; color:#555; margin:0; padding-top:20px">
|
||
<li style="font-weight: 600;color: #202942cf;">Initial Release</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<!-- =============== Release end ==================== -->
|
||
<!-- =============== Support strat ==================== -->
|
||
<div id="Support" class="tab-pane fade ">
|
||
<div class="row">
|
||
<div class="col-md-12">
|
||
<div class="sh_content shadow align-items-baseline"
|
||
style="border-radius:10px; padding:20px; margin-bottom:20px">
|
||
<h4><a href="mailto:support@softhealer.com"
|
||
style="text-decoration:none; color:#212121; font-size:18px; font-weight:600; letter-spacing:1px"><span
|
||
class="fa fa-envelope"
|
||
style="color:#be8a60; padding-right:10px; font-size:20px"></span>
|
||
If you
|
||
need Support please raise your ticket at <b
|
||
style="color:#0f40c4">support@softhealer.com</b></a>
|
||
</h4>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- =============== Support end ==================== -->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</div>
|
||
</div>
|
||
<!--====================Tab Section end ========================== -->
|
||
<div class="position-relative">
|
||
<!-- You May also Like -->
|
||
<section id="sh_like_module" style="margin: 50px 0;">
|
||
<div class="container">
|
||
<div class="sh_center text-center">
|
||
<h4 style="margin: 0;font-size: 42px;color: #202942;text-align: center;padding-bottom: 15px;">
|
||
You May Also
|
||
Like
|
||
</h4>
|
||
</div>
|
||
<div class="row mt-5 justify-content-center" style="margin-top: 1rem;">
|
||
<div class="col-md-4">
|
||
<div class="sh_content shadow-lg align-items-baseline bg-white"
|
||
style="border-radius: 10px;text-align: center;">
|
||
<div class="sh_img" style="padding: 10px;">
|
||
<a href="https://apps.odoo.com/apps/themes/16.0/sh_backmate_theme/">
|
||
<img src="Also_Like/sh_backmate_theme.png"
|
||
style="width: 100%;object-fit: contain;border-radius: 10px;"></img>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="sh_content shadow-lg align-items-baseline bg-white"
|
||
style="border-radius: 10px;text-align: center;">
|
||
<div class="sh_img" style="padding: 10px;">
|
||
<a href="https://apps.odoo.com/apps/themes/16.0/sh_backmate_theme_adv/">
|
||
<img src="Also_Like/sh_backmate_theme_adv.png"
|
||
style="width: 100%;object-fit: contain;border-radius: 10px;"></img>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="sh_content shadow-lg align-items-baseline bg-white"
|
||
style="border-radius: 10px;text-align: center;">
|
||
<div class="sh_img" style="padding: 10px;">
|
||
<a href="https://apps.odoo.com/apps/themes/16.0/sh_backmate_theme_enterprise/">
|
||
<img src="Also_Like/sh_backmate_theme_enterprise.png"
|
||
style="width: 100%;object-fit: contain;border-radius: 10px;"></img>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4" style="margin-top: 1rem;">
|
||
<div class="sh_content shadow-lg align-items-baseline bg-white"
|
||
style="border-radius: 10px;text-align: center;">
|
||
<div class="sh_img" style="padding: 10px;">
|
||
<a href="https://apps.odoo.com/apps/themes/16.0/sh_corpomate_theme/">
|
||
<img src="Also_Like/sh_corpomate_theme.gif"
|
||
style="width: 100%;object-fit: contain;border-radius: 10px;"></img>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4" style="margin-top: 1rem;">
|
||
<div class="sh_content shadow-lg align-items-baseline bg-white"
|
||
style="border-radius: 10px;text-align: center;">
|
||
<div class="sh_img" style="padding: 10px;">
|
||
<a href="https://apps.odoo.com/apps/themes/15.0/sh_onemate_theme/">
|
||
<img src="Also_Like/sh_onemate_theme.gif"
|
||
style="width: 100%;object-fit: contain;border-radius: 10px;"></img>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4" style="margin-top: 1rem;">
|
||
<div class="sh_content shadow-lg align-items-baseline bg-white"
|
||
style="border-radius: 10px;text-align: center;">
|
||
<div class="sh_img" style="padding: 10px;">
|
||
<a href="https://apps.odoo.com/apps/themes/16.0/sh_survmate_theme/">
|
||
<img src="Also_Like/sh_survmate_theme.gif"
|
||
style="width: 100%;object-fit: contain;border-radius: 10px;"></img>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<section id="sh_module_version">
|
||
<div class="container">
|
||
<div class="sh_center" style='margin: 2rem 0;'>
|
||
<div class="row">
|
||
<div class="col-md-12 col-sm-12 text-center">
|
||
<a href="https://apps.odoo.com/apps/themes/browse?author=softhealer"
|
||
class="btn mb-3 mt-3 me-3"
|
||
style="display: inline-block;
|
||
font-size: 18px;padding: 10px 20px;border-radius: 4px;text-decoration: none;background-color: #2d3150;color: #fff;">Our Themes</a>
|
||
<a href="https://apps.odoo.com/apps/modules/browse?author=softhealer"
|
||
class="btn mb-3 mt-3 me-3"
|
||
style="display: inline-block;
|
||
font-size: 18px;padding: 10px 20px;border-radius: 4px;text-decoration: none;background-color: #2d3150;color: #fff;">Our
|
||
Apps</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</div>
|
||
</body>
|
||
</html> |