2729 lines
233 KiB
HTML
2729 lines
233 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Gantt View Project</title>
|
|
<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=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
|
|
<!-- Bootstrap 5 CSS cdn -->
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<style>
|
|
.card-header a img {
|
|
transform: rotate(180deg);
|
|
}
|
|
.card-header.collapsed a img {
|
|
transform: rotate(0deg);
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<main class="main-container py-md-5 py-2" style="background-color:#ffffff;">
|
|
<div class="container" style="border-radius: 20px;">
|
|
<div class="shadow main-desc-container px-lg-5 p-4 bg-white"
|
|
style="border-radius: 20px; font-family: 'Inter', sans-serif;">
|
|
<div class="ks-top-logos pb-3">
|
|
<div class="text-center mb-md-4 mb-3">
|
|
<img src="./img/top-logo/logo1.png" class="img-fluid" alt="ks-logo" height="60" loading="lazy">
|
|
</div>
|
|
<div class="d-flex align-items-center justify-content-sm-between flex-column flex-sm-row">
|
|
<div class="odoo-logos d-flex align-items-center mb-sm-0 mb-3">
|
|
<img src="./img/top-logo/logo2.png" class="img-fluid" alt="logo" height="48" loading="lazy">
|
|
</div>
|
|
<div class="odoo-logos d-flex align-items-center">
|
|
<img src="./img/top-logo/logo3.png" class="img-fluid" alt="odoo-logo" height="32"
|
|
loading="lazy">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="ks-content-1">
|
|
<div class="ks-bg-blue position-relative pt-lg-5 pt-4"
|
|
style="background-color: #004d7a; z-index: 1; padding-bottom: 111px; padding-bottom: 6vw; border-radius: 40px 40px 80px 80px;">
|
|
<img src="./img/header-bg.png" alt="bg-img"
|
|
class="w-100 h-100 position-absolute img-fluid d-none d-lg-block" loading="lazy"
|
|
style="margin-top:-46px; border-radius: 10px 10px 20px 20px;">
|
|
<div class="position-relative text-center px-3"
|
|
style="color: #FFFFFF; font-family: 'Inter', sans-serif;">
|
|
<img src="./img/header-img.png" alt="header-img" class="img-fluid mb-2">
|
|
<h6 style="font-weight: 500; font-size: 24px; line-height: 160%; text-align: center; text-indent: 2px;color: #FFFFFF; font-size: calc(0.56rem + 0.81vw);">
|
|
Plan and schedule your projects quickly with Gantt Chart!
|
|
</h6>
|
|
<p class="mx-xl-3 px-xl-5 px-0 px-md-4 mb-xl-2 mt-3"
|
|
style="font-weight: 400; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #FFFFFF;">
|
|
Ksolves Gantt View for Project provides a customized solution that helps businesses to
|
|
organize, modify and allocate their project resources while providing the overview of entire
|
|
projects on visual timeline. With this easy visualization view you can track all your
|
|
projects schedules and manage them under a fixed timelines.
|
|
</p>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="d-flex justify-content-center">
|
|
<div class="col-11 d-flex justify-content-center position-relative"
|
|
style="margin-top: -8%; z-index:10;">
|
|
<div style="background-color:#ffffff; border-radius: 10px;" class="py-xl-4 px-xl-4 p-3 shadow">
|
|
<img src="./img/gif-file/Main.gif" alt="gif" class="img-fluid p-2">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="ks-content-1b p-md-5 p-3 mt-lg-5 mt-3 mx-lg-5"
|
|
style="background-color:#01264B; border-radius: 20px;">
|
|
<h5 class="text-center d-md-none px-lg-4 pt-4"
|
|
style="color:#ffffff; font-size: 26px; font-weight: 700; line-height: 30px; font-family: 'Inter', sans-serif;">
|
|
Ksolves-Your One-Stop Solution
|
|
</h5>
|
|
<div class="text-center mb-2 d-md-block d-none">
|
|
<img src="./img/headding-img.png" alt="heading-img" loading="lazy" class="img-fluid">
|
|
</div>
|
|
<p class="text-center"
|
|
style="color: #ffffff; font-weight: 400; font-size: 16px; line-height: 26px; margin-bottom: 28px;">
|
|
We are available 24/7 for your service. Contact us today!
|
|
</p>
|
|
<div class=" mt-4 ">
|
|
<div class="row">
|
|
<div class="col-lg-6 col-12">
|
|
<div class="mt-n2 d-flex align-items-center justify-content-lg-end justify-content-center me-lg-5">
|
|
<img src="./img/contact-man-icon.png" alt=" contact-man-icon" class="img-fluid"
|
|
style="width: 140px;" loading="lazy">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6 col-12 d-flex align-items-center justify-content-lg-start justify-content-center mt-n4 mt-lg-0 ms-lg-n4">
|
|
<div class="row d-flex align-items-center justify-content-lg-start justify-content-center">
|
|
<div class="col-sm-7 px-3 px-sm-0">
|
|
<a class="d-flex align-items-center px-2 py-3" href="mailto:sales@ksolves.com"
|
|
style="background-color: #6C91F1; text-decoration: none; border-radius: 5px;font-style: normal; font-weight: 400; font-size: 14px; color: #FFFFFF; height:40px;">
|
|
<img alt="mail-icon" class="img-fluid pe-2 ps-2 me-xl-2 me-lg-0 me-2"
|
|
loading="lazy" src="./img/email.png">sales@ksolves.com</a>
|
|
</div>
|
|
<div class="col-sm-7 px-3 px-sm-0" style="margin-top: 5px;">
|
|
<a class=" d-flex align-items-center px-2 py-3" href="tel:+91-8527471031"
|
|
style="background-color: #6C91F1; text-decoration: none; border-radius: 5px;font-style: normal; font-weight: 400; font-size: 14px; color: #FFFFFF; height:40px;">
|
|
<img alt="phone" class="img-fluid pe-2 ps-2 me-xl-2 me-lg-0 me-2" loading="lazy"
|
|
src="./img/phone-2.png">+91-8527471031</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="ks-content-1c pb-4 mb-lg-2" style="margin-top:52px">
|
|
<div class="d-flex align-items-center flex-column justify-content-center">
|
|
<h5 style="font-family: 'Inter', sans-serif; font-weight: 600; font-size: 40px; line-height: 124%; text-align: center; font-size: calc(1.54rem + 1vw); letter-spacing: -0.02em; color: #323467;">
|
|
USPs
|
|
</h5>
|
|
<div class="pb-lg-2 mb-3 mt-md-4 mt-2">
|
|
<img src="./img/usp.png" alt="usp-img" class="img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="ks-content-1d">
|
|
<div class="ks-bg-blue position-relative overflow-hidden pt-lg-5 pt-4 mb-4 px-md-5 px-0"
|
|
style=" background-color: #383b6a; padding:65px 75px; border-radius: 20px;">
|
|
<img src="./img/cut-off-bg.png" alt="bg-img"
|
|
class="w-100 h-100 position-absolute img-fluid ms-md-auto ms-sm-0" loading="lazy"
|
|
style="top:-45px; margin-left: -3rem !important; border-radius: 20px;">
|
|
<div class="position-relative">
|
|
<div class="row mb-4 mb-lg-5">
|
|
<div class="col-xl-12 pe-xl-0">
|
|
<h5 class="text-center px-4 mb-1"
|
|
style="color:#8EF2FF; font-weight: 700; font-size: 40px; font-size: calc(1.315rem + 1vw); letter-spacing: -0.02em; font-family: 'Inter', sans-serif;">
|
|
Powerful. Interactive. Efficient.
|
|
</h5>
|
|
<p class="text-center m-0"
|
|
style="color: #ffffff; font-weight: 400; font-size: 38px; font-size: calc(1.2rem + 1vw);">
|
|
Gantt Chart for your business!
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="row mb-4 mb-lg-5 mx-0">
|
|
<div class="col-xl-8 pe-xl-0">
|
|
<div class="d-flex align-items-center justify-content-center">
|
|
<table>
|
|
<tbody>
|
|
<tr>
|
|
<td>
|
|
<a href="https://apps.odoo.com/apps/modules/15.0/ks_gantt_view_base/">
|
|
<img src="./img/g1.png" alt="img" loading="lazy" class="img-fluid">
|
|
</a>
|
|
</td>
|
|
<td class="px-4">
|
|
<img src="./img/plus.png" alt="img" loading="lazy" class="img-fluid">
|
|
</td>
|
|
<td>
|
|
<a href="https://apps.odoo.com/apps/modules/15.0/ks_gantt_view_project/">
|
|
<img src="./img/g2.png" alt="img" loading="lazy" class="img-fluid">
|
|
</a>
|
|
</td>
|
|
|
|
</tr>
|
|
<tr>
|
|
<td class="text-center" style="height:60px">
|
|
<img src="./img/plus.png" alt="img" loading="lazy" class="img-fluid">
|
|
</td>
|
|
<td style="height:60px" class="px-4">
|
|
|
|
</td>
|
|
<td class="text-center" style="height:60px">
|
|
<img src="./img/plus.png" alt="img" loading="lazy" class="img-fluid">
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<a href="https://apps.odoo.com/apps/modules/15.0/ks_gantt_view_mrp/">
|
|
<img src="./img/g3.png" alt="img" loading="lazy" class="img-fluid">
|
|
</a>
|
|
</td>
|
|
<td class="px-4">
|
|
<img src="./img/plus.png" alt="img" loading="lazy" class="img-fluid">
|
|
</td>
|
|
<td>
|
|
<a href="https://apps.odoo.com/apps/modules/15.0/ks_gantt_view_hr_holidays/">
|
|
<img src="./img/g4.png" alt="img" loading="lazy" class="img-fluid">
|
|
</a>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-4 mt-xl-0 mt-3 ps-xl-0">
|
|
<div class="d-flex align-items-center justify-content-center h-100">
|
|
<div style="width:180px">
|
|
<div class="d-flex align-items-center justify-content-center">
|
|
<img src="./img/equal.png" alt="img" loading="lazy" class="img-fluid">
|
|
</div>
|
|
</div>
|
|
<div class="d-flex align-items-start justify-content-center flex-column h-100">
|
|
<img src="./img/60-img.png" alt="img" class="img-fluid" loading="lazy">
|
|
<div style="background-color: #EFF0FF; padding: 2px 12px; border-radius: 2px; margin-top: 15px; margin-bottom: 17px;"
|
|
class="text-center">
|
|
<p class="mb-0"
|
|
style="font-weight: 500; font-size: 30px; line-height: 155.19%; letter-spacing: 0.08em; text-indent: 2px; color: #383B6A; font-size: calc(0.9rem + 1vw);">
|
|
CUT-OFF</p>
|
|
</div>
|
|
<p class="mb-0"
|
|
style="font-weight: 400; font-size: 18px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #FFFFFF;">
|
|
On Total Time Spent In Managing Business Processes
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row d-flex align-items-center justify-content-center">
|
|
<div class="col-lg-9 col-11">
|
|
<div class="text-center py-2"
|
|
style="background-color: #8EF2FF; border-radius: 5px; font-size: 32px; letter-spacing: -0.02em; text-indent: 2px; color: #383B6A; font-size: calc(1.5rem + 0.4vw);">
|
|
<span style="font-weight: 300;">
|
|
Don't Miss To Add The
|
|
</span>
|
|
<span style="font-weight: 500;">
|
|
Bundle In Your Cart!
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="ks-content-1e">
|
|
<div class="d-flex align-items-center justify-content-center">
|
|
<div class="col-lg-9 mt-xl-5 mt-3">
|
|
<h5 class="mb-lg-5 mb-3"
|
|
style="font-weight: 600; font-size: 24px; line-height: 160%; text-align: center; text-indent: 2px; color: #4D528C;">
|
|
Gantt View for Project is divided into two views including All Projects Gantt view and Task
|
|
Specific Gantt View.
|
|
</h5>
|
|
</div>
|
|
</div>
|
|
<div class="mt-3 mb-4 px-3 px-md-4 px-lg-0 w-100">
|
|
<div class="row mb-lg-4 mb-3">
|
|
<div class="col-md-6">
|
|
<div class="d-flex align-items-center justify-content-center px-lg-5 px-md-3 py-xl-5 px-md-3">
|
|
<h3 class="me-4" style="font-weight: 700; font-size: 96px; line-height: 160%; letter-spacing: 0.02em;
|
|
text-indent: 2px; color: #14608A;">1</h3>
|
|
<p style="font-weight: 500; font-size: 18px; line-height: 160%; letter-spacing: 0.02em; text-indent: 2px; color: #4D528C;">
|
|
In all <span style="font-weight: 700;">Projects Gantt View</span>, you can keep eye
|
|
on all the projects along with their multiple tasks in the timeline.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div style="background: #F4F4F4; border-radius: 5px; padding: 11px;">
|
|
<img src="./img/top-1.png" alt="img" loading="lazy" class="img-fluid w-100">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-6 order-md-1 order-2">
|
|
<div style="background: #F4F4F4; border-radius: 5px; padding: 11px;">
|
|
<img src="./img/top-2.png" alt="img" loading="lazy" class="img-fluid w-100">
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 order-md-2 order-1">
|
|
<div class="d-flex align-items-center justify-content-center px-lg-5 px-md-3 py-xl-5 px-md-3">
|
|
<h3 class="me-4" style="font-weight: 700; font-size: 96px; line-height: 160%; letter-spacing: 0.02em;
|
|
text-indent: 2px; color: #14608A;">2</h3>
|
|
<p style="font-weight: 500; font-size: 18px; line-height: 160%; letter-spacing: 0.02em; text-indent: 2px; color: #4D528C;">
|
|
In <span style="font-weight: 700;">Task Specific Gantt View</span>, you can choose
|
|
the specific project and view all its tasks inside the project.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<section class=" mt-4 pt-2" style="font-family: 'Inter', sans-serif;">
|
|
<div class="shadow py-3 bg-white" style="border-radius: 20px; ">
|
|
<ul class="nav nav-tabs justify-content-center bg-white" id="myTab" role="tablist"
|
|
style="border-bottom:1px solid #dee2e6;">
|
|
<li class="nav-item">
|
|
<a class="nav-link active" id="overview-tab" data-bs-toggle="tab" href="#overview" role="tab"
|
|
aria-controls="overview" aria-selected="true"
|
|
style="color: #283071;font-weight: 400; font-size: 14px;"> Overview</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" id="why-ks-tab" data-bs-toggle="tab" href="#why-ks" role="tab"
|
|
aria-controls="why-ks" aria-selected="false"
|
|
style="color: #283071;font-weight: 400; font-size: 14px;">Why Ksolves</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" id="support-tab" data-bs-toggle="tab" href="#support" role="tab"
|
|
aria-controls="s_c" aria-selected="false"
|
|
style="color: #283071;font-weight: 400; font-size: 14px;">Support</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" id="faq-tab" data-bs-toggle="tab" href="#faq" role="tab" aria-controls="faq"
|
|
aria-selected="false" style="color: #283071;font-weight: 400; font-size: 14px;"> FAQS</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" id="releases-tab" data-bs-toggle="tab" href="#releases" role="tab"
|
|
aria-controls="releases" aria-selected="false"
|
|
style="color: #283071;font-weight: 400; font-size: 14px;">Releases</a>
|
|
</li>
|
|
</ul>
|
|
<div class="px-3 px-lg-4">
|
|
<div class="tab-content" id="myTabContent">
|
|
<div class="tab-pane fade show active" id="overview" role="tabpanel"
|
|
aria-labelledby="overview-tab">
|
|
|
|
<div class="text-center mt-lg-5 mt-5 mb-4">
|
|
<p style="margin-bottom: 10px; font-weight: 500; font-size: 18px; line-height: 23px; text-align: center; letter-spacing: 0.04em; text-indent: 2px; color: #535456;">
|
|
KEY HIGHLIGHTS OF</p>
|
|
<h5 style="font-weight: 700; font-size: 42px; line-height: 127.5%; letter-spacing: -0.02em; text-indent: 2px;color: #3E3F68; margin-bottom: 10px; font-size: calc(1.63rem + 1vw);">
|
|
Gantt View Project
|
|
</h5>
|
|
<p class="col-10 mx-auto px-0 pb-4"
|
|
style="font-weight: 500; font-size: 18px; line-height: 27px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
Equipped with outstanding features to simply the project management and task
|
|
planning
|
|
</p>
|
|
</div>
|
|
|
|
<!-- part1 -->
|
|
<div class="px-4"
|
|
style="background-color:#ECF0FF; border-radius:10px; padding-top:48px; padding-bottom: 40px; margin-bottom: 48px;">
|
|
<h5 class="mb-2"
|
|
style="margin-bottom:0px; font-weight: 600; font-size: 32px; line-height: 48px; text-align: center; text-indent: 2px; color: #3E3F68; font-size: calc(1.5rem + 0.4vw);">
|
|
Action Bar
|
|
</h5>
|
|
<p class="mb-xl-5 mb-lg-4 mb-3"
|
|
style="font-weight: 400; font-size: 16px; line-height: 24px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C; margin-bottom: 22px;">
|
|
Manage your Manufacturing orders within few clicks
|
|
</p>
|
|
<!-- 1 -->
|
|
<div class="px-lg-5 px-3 pt-lg-5 pb-lg-4 py-3"
|
|
style="border-radius: 5px; margin-bottom: 38px; background-color: #ffffff;">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-12 d-flex align-items-center justify-content-center ">
|
|
<div class="text-center">
|
|
<h5 style="font-weight: 600; font-size: 28px; line-height: 42px; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Graph Overlay
|
|
</h5>
|
|
<p class="px-lg-4"
|
|
style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C; ">
|
|
Get an overview of project progress in graph! Graph Overlay
|
|
showcases the project progress by denoting two lines in the
|
|
timeline : blue and red. The blue line displays the planned
|
|
progress of the task whereas the red line denotes the actual
|
|
progress. The task progress has indicated in percentage.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 d-flex align-items-center justify-content-center mb-3">
|
|
<img style="border-radius: 5px;"
|
|
src="./img/overview/gantt-view-project/1.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 2 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 30px;">
|
|
<img src="./img/overview/gantt-view-project/2-bg.png" alt="bg-img" loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; width: 100%;">
|
|
<div style="background-color:#ffffff; border-radius:2px; width: 100%;">
|
|
<img style="border-radius: 5px;"
|
|
src="./img/overview/gantt-view-project/2.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 42px; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Duration
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
Duration button display the total number of days consumed in
|
|
accomplishing the tasks
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 3 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 28px;">
|
|
<img src="./img/overview/gantt-view-project/3-bg.png" alt="bg-img" loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div>
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 42px; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Grid
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
When you click the Grid button, the left panel gets removed
|
|
which contains project information such as task name, duration,
|
|
more. Now, you can see the graphical representation of Gantt
|
|
View(Right Panel)on the entire screen.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img style="border-radius: 5px;"
|
|
src="./img/overview/gantt-view-project/3.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 4 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 28px;">
|
|
<img src="./img/overview/gantt-view-project/4-bg.png" alt="bg-img" loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img style="border-radius: 5px;"
|
|
src="./img/overview/gantt-view-project/4.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ps-lg-0 pe-0">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3 ">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 42px; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Resource Panel
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
The Resource Panel displays the total working hours and tasks
|
|
assigned to the resources. It assists you in managing your
|
|
resources while calculating project expenses, tracking job
|
|
progress, and more.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 5 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 28px;">
|
|
<img src="./img/overview/gantt-view-project/5-bg.png" alt="bg-img" loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div>
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 42px; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Zoom To Fit
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
When you click on the Zoom To Fit feature, it automatically
|
|
adjusts the Gantt View according to your screen size for better
|
|
visibility.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img style="border-radius: 5px;"
|
|
src="./img/overview/gantt-view-project/5.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 6 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 28px;">
|
|
<img src="./img/overview/gantt-view-project/6-bg.png" alt="bg-img" loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row d-flex align-items-center justify-content-center">
|
|
<div class="col-12 ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3 d-flex align-items-center justify-content-center flex-column">
|
|
<h5 class="mt-lg-3"
|
|
style="font-weight: 600; font-size: 28px;line-height: 42px; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68; ">
|
|
Critical Path
|
|
</h5>
|
|
<div class="row d-flex align-items-center justify-content-center">
|
|
<div class="col-11 text-center">
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
Critical path is used to display the dependencies of
|
|
tasks. If a critical path is linked to any dependent
|
|
task which remains outstanding after the former task has
|
|
completed then it shows a warning by highlighting it in
|
|
red. It helps you in identifying the sequences for
|
|
performing the project tasks.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-11 col-12 d-flex align-items-center justify-content-center my-lg-3">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img style="border-radius: 5px;"
|
|
src="./img/overview/gantt-view-project/6.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 7 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 28px;">
|
|
<img src="./img/overview/gantt-view-project/7-bg.png" alt="bg-img" loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row d-flex align-items-center justify-content-center">
|
|
<div class="col-12 ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3 d-flex align-items-center justify-content-center flex-column">
|
|
<h5 class="mt-lg-3"
|
|
style="font-weight: 600; font-size: 28px;line-height: 42px; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68; ">
|
|
Deadline
|
|
</h5>
|
|
<div class="row d-flex align-items-center justify-content-center">
|
|
<div class="col-11 text-center">
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
This feature indicates the deadline date of the task
|
|
with an arrow in the GanttView. In case you exceed the
|
|
deadline of any task, it displays the overdue days in
|
|
Gantt view as well as warning signs in the left Grid..
|
|
Odoo allows you to set the task deadlines. It keeps you
|
|
updated with task priority and ensures to take informed
|
|
decisions to meet deadlines.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-11 col-12 d-flex align-items-center justify-content-center my-lg-3">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img style="border-radius: 5px;"
|
|
src="./img/overview/gantt-view-project/7.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 8 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 34px;">
|
|
<img src="./img/overview/gantt-view-project/8-bg.png" alt="bg-img" loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img style="border-radius: 5px;"
|
|
src="./img/overview/gantt-view-project/8.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 42px; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Day Off
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
Day off highlights the holidays and unproductive days in Gantt
|
|
View. It generally displays the weekoff and day off of the
|
|
assigned resources for the tasks.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 9 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 28px;">
|
|
<img src="./img/overview/gantt-view-project/9-bg.png" alt="bg-img" loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div>
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 42px; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Today
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
Today's button will highlight the graphical section that
|
|
reflects the current day in the Gantt View.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/9.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 10 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 28px;">
|
|
<img src="./img/overview/gantt-view-project/10-bg.png" alt="bg-img" loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/10.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Scaling
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
With Time scaling you can sort the Gantt View in different time
|
|
formats as per your choice like month, week, day, etc.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 11 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 28px;">
|
|
<img src="./img/overview/gantt-view-project/11-bg.png" alt="bg-img" loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div>
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 42px; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Sorting
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
The sorting feature allows you to sort your Left panel data
|
|
which reflect in Gantt View in different ways like New Or New to
|
|
Old, Task Names, or Task Duration, etc. based on your
|
|
convenience.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/11.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 12 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 10px;">
|
|
<img src="./img/overview/gantt-view-project/12-bg.png" alt="bg-img" loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/gif-file/Full_Screen.gif" alt="gif"
|
|
class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Full-Screen Mode
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
This feature allows you to view your Gantt View on the entire
|
|
screen. With this you can get a better view of the data to
|
|
manage your tasks.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- part2 -->
|
|
<div class="px-4"
|
|
style="background-color:#E5F5FF; border-radius:10px; padding-top:34px; padding-bottom: 37px; margin-bottom: 40px;">
|
|
<h6 class="text-center mb-2"
|
|
style="font-weight: 600; font-size: 32px; line-height: 48px; text-align: center; font-size: calc(1.5rem + 0.4vw); text-indent: 2px; color: #3E3F68;">
|
|
Gantt View Grid
|
|
</h6>
|
|
<div class="row d-flex align-items-center justify-content-center mb-2">
|
|
<p class="text-center col-lg-9"
|
|
style="font-weight: 400; font-size: 16px; line-height: 24px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
Track and Manage your projects with Gantt View
|
|
</p>
|
|
</div>
|
|
|
|
<!-- 1 -->
|
|
<div class=" px-3"
|
|
style="border-radius: 5px; background-color: #FFFFFF; padding-top: 35px; padding-bottom: 39px; margin-bottom: 45px;">
|
|
<!-- left grid -->
|
|
<h5 style="font-weight: 600; font-size: 28px; line-height: 42px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Left Grid View
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
The left Grid displays the project details such as Title, Duration, Start Time
|
|
of the task.
|
|
</p>
|
|
<!-- add -->
|
|
<div class="row" style="margin-bottom:35px">
|
|
<div class="col-12 col-lg-4 d-flex align-items-center justify-content-start ">
|
|
<div class="ps-4 pe-5 d-flex align-items-center justify-content-start">
|
|
<div>
|
|
<h5 style="font-weight: 500; font-size: 24px; line-height: 160%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Add (+)
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
The add button is used to create tasks by filling the required
|
|
fields in the project creation form.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-lg-8">
|
|
<div style="padding:17px; background-color:#E5F5FF; border-radius:9px">
|
|
<img src="./img/overview/gantt-view-project/add.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- sub-task -->
|
|
<div class="row" style="margin-bottom:31px">
|
|
<div class="col-12 col-lg-8">
|
|
<div style="padding:17px; background-color:#E5F5FF; border-radius:9px">
|
|
<img loading="lazy" src="./img/gif-file/Subtask.gif" alt="gif"
|
|
class="w-100 img-fluid">
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-lg-4 d-flex align-items-center justify-content-start ">
|
|
<div class="ps-4 pe-5 d-flex align-items-center justify-content-start">
|
|
<div>
|
|
<h5 style="font-weight: 500; font-size: 24px; line-height: 160%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Sub Task
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
With this feature you can create a sub task for any main task
|
|
listed in the left grid. For this you need to enable the sub
|
|
task setting in the Odoo.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- edit -->
|
|
<div class="row" style="margin-bottom:35px">
|
|
<div class="col-12 col-lg-4 d-flex align-items-center justify-content-start ">
|
|
<div class="ps-4 pe-5 d-flex align-items-center justify-content-start">
|
|
<div>
|
|
<h5 style="font-weight: 500; font-size: 24px; line-height: 160%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Edit
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
Edit button enables you to edit your created task in the left
|
|
grid.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-lg-8">
|
|
<div style="padding:17px; background-color:#E5F5FF; border-radius:9px">
|
|
<img loading="lazy" src="./img/overview/gantt-view-project/edit.png"
|
|
alt="img" class="w-100 img-fluid">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- delete -->
|
|
<div class="row" style="margin-bottom:31px">
|
|
<div class="col-12 col-lg-8">
|
|
<div style="padding:17px; background-color:#E5F5FF; border-radius:9px">
|
|
<img loading="lazy" src="./img/overview/gantt-view-project/delete.png"
|
|
alt="img" class="w-100 img-fluid">
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-lg-4 d-flex align-items-center justify-content-start ">
|
|
<div class="ps-4 pe-5 d-flex align-items-center justify-content-start">
|
|
<div>
|
|
<h5 style="font-weight: 500; font-size: 24px; line-height: 160%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Delete
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
By clicking the delete button you can delete the task in the
|
|
Left Grid.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- color -->
|
|
<div class="row d-flex align-items-center justify-content-center mt-lg-5">
|
|
<div class="col-xl-9 col-lg-10">
|
|
<h5 style="font-weight: 600; font-size: 28px; line-height: 45px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Color of Tasks
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; text-align: center;
|
|
letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
In the Left Grid, you can see the different colors are highlighted
|
|
beside each task. These colors denote the task progress such as:-
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- colored-circle boxes -->
|
|
<div class="row px-lg-4 mt-4">
|
|
<div class="col-12 col-lg-4 col-md-6 px-lg-4 mb-md-0 mb-2">
|
|
<div class="d-flex flex-column align-items-start justify-content-start px-4"
|
|
style="border-radius: 5px; border: 1px solid #C4C4C4; padding-top: 31px; padding-bottom: 45px; height: 100%;">
|
|
<div class="w-100 d-flex justify-content-center mb-3">
|
|
<div style="border-radius:100%; background-color: #21B021; width: 35px; height: 35px;"></div>
|
|
</div>
|
|
<p class="mb-lg-3"
|
|
style="font-weight: 500; font-size: 16px; line-height: 22px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
Green Color show that task has 100% completed
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-lg-4 col-md-6 px-lg-4 mb-md-2 mb-2 mb-lg-0">
|
|
<div class="d-flex flex-column align-items-start justify-content-center px-4"
|
|
style="border-radius: 5px; border: 1px solid #C4C4C4; padding-top: 31px; padding-bottom: 40px; height: 100%;">
|
|
<div class="w-100 d-flex justify-content-center mb-3">
|
|
<div style="border-radius:100%; background-color: #FF0000; width: 35px; height: 35px;"></div>
|
|
</div>
|
|
<p class="mb-0"
|
|
style="font-weight: 500; font-size: 16px; line-height: 22px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
Red color indicate 0% task completed means it is not yet started
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-lg-4 col-md-6 px-lg-4 mb-md-0 mb-2">
|
|
<div class="d-flex flex-column align-items-start justify-content-center px-4"
|
|
style="border-radius: 5px; border: 1px solid #C4C4C4; padding-top: 31px; padding-bottom: 41px; height: 100%;">
|
|
<div class="w-100 d-flex justify-content-center mb-3">
|
|
<div style="border-radius:100%; background-color: #FFFF00; width: 35px; height: 35px;"></div>
|
|
</div>
|
|
<p class="mb-lg-3 mb-xl-0 pb-xl-0 pb-lg-1"
|
|
style="font-weight: 500; font-size: 16px; line-height: 22px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
Yellow color show that task progress is between 0 to 100%
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row d-flex align-items-center justify-content-center mt-lg-5 mt-4">
|
|
<div class="col-lg-10">
|
|
<h5 style="font-weight: 600; font-size: 28px; line-height: 45px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Drag and drop of individual tasks inside same project
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; text-align: center;
|
|
letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;"
|
|
class="px-xl-5 px-lg-4">
|
|
In the left panel, you have the option to drag and drop the tasks inside
|
|
any project. Like if you want to shift any task in the project according
|
|
to its priority basis then you can easily do it with drag and drop
|
|
feature.
|
|
</p>
|
|
</div>
|
|
|
|
</div>
|
|
<div style="background-color: #F9F9F9; border-radius: 9px;" class="p-lg-4 p-3">
|
|
<img loading="lazy" src="./img/gif-file/Drag_Drop_Inside.gif" alt="gif"
|
|
class="w-100 img-fluid pt-2">
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- 2 -->
|
|
<div class="px-3"
|
|
style="border-radius: 5px; background-color: #FFFFFF; padding-top: 35px; padding-bottom: 42px; margin-bottom: 32px;">
|
|
<!-- right grid -->
|
|
<h5 style="font-weight: 600; font-size: 28px; line-height: 42px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Right Grid/Main Panel
|
|
</h5>
|
|
<p class="mb-4"
|
|
style="font-weight: 500; font-size: 16px; line-height: 26px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
It's a main panel that displays the project Gantt View. Lets learn more about it
|
|
</p>
|
|
<div class="mx-3"
|
|
style="background-color: #F9F9F9; padding-top:23px; padding-bottom: 42px; margin-bottom: 30px;">
|
|
<h5 class="mb-3"
|
|
style="font-weight: 500; font-size: 24px; line-height: 38px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #14608A;">
|
|
ToolTip
|
|
</h5>
|
|
<div class="row d-flex justify-content-center">
|
|
<div class="col-lg-9 mb-5">
|
|
<p class="mb-0 px-2"
|
|
style="font-weight: 500; font-size: 16px; line-height: 26px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
When you hover your mouse around the task in the timeline a tooltip
|
|
appears to provide the task details including Title, Duration, Start
|
|
Date, End Date of the task with progress, stage and task
|
|
constraints. You can customize the display by enabling/disabling the
|
|
information in the settings.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- tooltip 8 boxes -->
|
|
<div class="row px-4">
|
|
<div class="col-xl-3 col-lg-4 col-12 mb-lg-5 mb-3">
|
|
<div class="d-flex flex-column justify-content-start align-items-center">
|
|
<h5 style="font-weight: 600; font-size: 20px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #14608A;">
|
|
Title
|
|
</h5>
|
|
<p class="mb-xl-3"
|
|
style="font-weight: 400; font-size: 16px; line-height: 150%; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #4E4E4E;">
|
|
The Task <br class="d-md-block d-none"> Name
|
|
</p>
|
|
</div>
|
|
<img src="./img/overview/gantt-view-project/r1.png" alt="img"
|
|
class=" mt-xl-0 w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
<div class="col-xl-3 col-lg-4 col-12 mb-lg-5 mb-3">
|
|
<div class="d-flex flex-column justify-content-start align-items-center">
|
|
<h5 style="font-weight: 600; font-size: 20px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #14608A;">
|
|
Duration
|
|
</h5>
|
|
<p style="font-weight: 400; font-size: 16px; line-height: 150%; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #4E4E4E;">
|
|
Numbers of days <br class="d-xl-block d-none"> allocated for the
|
|
task
|
|
</p>
|
|
</div>
|
|
<img src="./img/overview/gantt-view-project/r2.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
<div class="col-xl-3 col-lg-4 col-12 mb-lg-5 mb-3">
|
|
<div class="d-flex flex-column justify-content-start align-items-center">
|
|
<h5 style="font-weight: 600; font-size: 20px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #14608A;">
|
|
Start Time
|
|
</h5>
|
|
<p class="mb-xl-3"
|
|
style="font-weight: 400; font-size: 16px; line-height: 150%; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #4E4E4E;">
|
|
When the task will <br class="d-lg-block d-none"> begin
|
|
</p>
|
|
</div>
|
|
<img src="./img/overview/gantt-view-project/r3.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
<div class="col-xl-3 col-lg-4 col-12 mb-lg-5 mb-3">
|
|
<div class="d-flex flex-column justify-content-start align-items-center">
|
|
<h5 style="font-weight: 600; font-size: 20px;text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #14608A;">
|
|
End Date
|
|
</h5>
|
|
<p class="mb-xl-3 "
|
|
style="font-weight: 400; font-size: 16px; line-height: 150%; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #4E4E4E;">
|
|
When the task <br class="d-lg-block d-none"> will end
|
|
</p>
|
|
</div>
|
|
<img src="./img/overview/gantt-view-project/r4.png" alt="img"
|
|
class="w-100 img-fluid mt-xl-0 mt-lg-5" loading="lazy">
|
|
</div>
|
|
<div class="col-xl-3 col-lg-4 col-12 mb-lg-5 mb-3">
|
|
<div class="d-flex flex-column justify-content-start align-items-center">
|
|
<h5 style="font-weight: 600; font-size: 20px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #14608A;">
|
|
Progress
|
|
</h5>
|
|
<p class=" mb-xl-4"
|
|
style="font-weight: 400; font-size: 16px; line-height: 150%; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #4E4E4E;">
|
|
What is the task <br class="d-xl-block d-none"> progress in
|
|
percentage form
|
|
</p>
|
|
</div>
|
|
<img src="./img/overview/gantt-view-project/r5.png" alt="img"
|
|
class="w-100 img-fluid mt-xl-3 mt-lg-5 mt-md-4" loading="lazy">
|
|
</div>
|
|
<div class="col-xl-3 col-lg-4 col-12 mb-lg-5 mb-3">
|
|
<div class="d-flex flex-column justify-content-start">
|
|
<h5 style="font-weight: 600; font-size: 20px; line-height:120%; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #14608A;">
|
|
Constraint Type
|
|
</h5>
|
|
<p style="font-weight: 400; font-size: 16px; line-height: 150%; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #4E4E4E;">
|
|
Specify the priority of tasks like start earlier, as soon as
|
|
possible,and more.
|
|
</p>
|
|
</div>
|
|
<img loading="lazy" src="./img/overview/gantt-view-project/r6.png"
|
|
alt="img" class="w-100 img-fluid">
|
|
</div>
|
|
<div class="col-xl-3 col-lg-4 col-12 mb-lg-5 mb-3">
|
|
<h5 style="font-weight: 600; font-size: 20px; line-height:120%; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #14608A;">
|
|
Constraint Date
|
|
</h5>
|
|
<p class="mb-xl-4"
|
|
style="font-weight: 400; font-size: 16px; line-height: 150%; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #4E4E4E;">
|
|
Stage- It display task <br class="d-xl-block d-none"> stage such as
|
|
testing, <br class="d-xl-block d-none"> assembly and more
|
|
</p>
|
|
<img loading="lazy" src="./img/overview/gantt-view-project/r7.png"
|
|
alt="img" class="w-100 img-fluid mt-xl-3">
|
|
</div>
|
|
<div class="col-xl-3 col-lg-4 col-12 mb-lg-5 mb-3">
|
|
<div class="d-flex flex-column justify-content-start align-items-center">
|
|
<h5 style="font-weight: 600; font-size: 20px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #14608A;">
|
|
Deadline
|
|
</h5>
|
|
<p class="mb-xl-5"
|
|
style="font-weight: 400; font-size: 16px; line-height: 150%; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #4E4E4E;">
|
|
Final date to <br class="d-xl-block d-none"> complete the task
|
|
</p>
|
|
</div>
|
|
<img loading="lazy" src="./img/overview/gantt-view-project/r8.png"
|
|
alt="img" class="w-100 img-fluid mt-xl-3 mt-lg-4 mt-md-4">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="mx-3">
|
|
<!-- bg-1 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 30px; ">
|
|
<img src="./img/overview/gantt-view-project/w1-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img loading="lazy"
|
|
src="./img/overview/gantt-view-project/w1.png"
|
|
alt="gif" class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px; line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Task Completed - Green Tick
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
The green tick marks appear beside those tasks which
|
|
have been completed 100%. It highlights that your task
|
|
has been done.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- bg-2 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 28px;">
|
|
<img src="./img/overview/gantt-view-project/w2-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div>
|
|
<h5 style="font-weight: 600; font-size: 28px; line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Link One <br class="d-none d-xl-block"> Task From <br
|
|
class="d-none d-xl-block"> Another
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
With this feature you can link one task to another. It
|
|
can be used to display the work connection between both
|
|
tasks.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/w2.png"
|
|
alt="img" class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- bg-3 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 30px; ">
|
|
<img src="./img/overview/gantt-view-project/w3-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/w3.png"
|
|
alt="gif" class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px; line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Milestone <br class="d-xl-block d-none">
|
|
of a Project
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
You can create milestones for the project which will
|
|
highlight on the timeline with a unique symbol.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- bg-4 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 30px;">
|
|
<img src="./img/overview/gantt-view-project/w4-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-12 d-flex align-items-center justify-content-start ">
|
|
<div>
|
|
<h5 class="text-center mb-4 mt-4"
|
|
style="font-weight: 600; font-size: 28px; line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Drag the timeline of a task
|
|
</h5>
|
|
<div class="row d-flex align-items-center justify-content-center">
|
|
<div class="col-lg-10">
|
|
<p class="text-center mb-lg-5 mb-4"
|
|
style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
With the drag the timeline of a task feature,
|
|
you can drag any task and schedule it for
|
|
another date by dropping it directly on the
|
|
timeline. Like if you want to shift any task's
|
|
deadline, you can adjust it on the Gantt View
|
|
and keep the project on track.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-12 d-flex align-items-center justify-content-center mb-3">
|
|
<img src="./img/gif-file/drag.gif" alt="img"
|
|
class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- bg-5 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 30px;">
|
|
<img src="./img/overview/gantt-view-project/w5-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-12 d-flex align-items-center justify-content-start ">
|
|
<div>
|
|
<h5 class="text-center mb-4 mt-4"
|
|
style="font-weight: 600; font-size: 28px; line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Quick Pop-up
|
|
</h5>
|
|
<div class="row d-flex align-items-center justify-content-center">
|
|
<div class="col-lg-10">
|
|
<p class="text-center mb-lg-5 mb-4"
|
|
style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
When you click on Project Bar in the Gantt View,
|
|
a quick pop appears that shows the Project's
|
|
Start Date, End Date and Tile with Edit and
|
|
Delete.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-12">
|
|
<div class="row">
|
|
<div class="col-lg-6 col-12 mb-lg-0 mb-3">
|
|
<div class="px-3"
|
|
style="background-color: #ffffff; border-radius:5px; padding-top:31px; padding-bottom:38px;">
|
|
<h5 class="text-center"
|
|
style="font-weight: 600; font-size: 28px; line-height: 120%; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #1D567E;">
|
|
Delete
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
It enables to delete <br
|
|
class="d-lg-block d-none"> the task
|
|
</p>
|
|
<img src="./img/overview/gantt-view-project/d1.png"
|
|
alt="img" class="w-100 img-fluid"
|
|
loading="lazy">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6 col-12">
|
|
<div class="px-3"
|
|
style="background-color: #ffffff; border-radius:5px; padding-top:31px; padding-bottom:38px;">
|
|
<h5 class="text-center"
|
|
style="font-weight: 600; font-size: 28px; line-height: 120%; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #1D567E;">
|
|
Edit
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
You can modify your project task by <br
|
|
class="d-xl-block d-none"> clicking on edit
|
|
</p>
|
|
<img src="./img/overview/gantt-view-project/d2.png"
|
|
alt="img" class="w-100 img-fluid"
|
|
loading="lazy">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- bg-6 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 15px;">
|
|
<img src="./img/overview/gantt-view-project/w6-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div>
|
|
<h5 style="font-weight: 600; font-size: 28px; line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Markers
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
Markers highlight the start date and end date of the
|
|
project on the Gantt View. You can customize its
|
|
settings to organize the project tasks in a better way.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/w6.png"
|
|
alt="img" class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 3 -->
|
|
<div class="px-3"
|
|
style="border-radius: 5px; background-color: #FFFFFF; padding-top: 35px; padding-bottom: 42px; margin-bottom: 30px;">
|
|
<h5 style="font-weight: 600; font-size: 28px; line-height: 150%; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Configuration > Stage
|
|
</h5>
|
|
<p class="mb-4"
|
|
style="font-weight: 500; font-size: 16px; line-height: 26px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
Enhance the visual appearance of your Gantt View
|
|
</p>
|
|
<!-- bg-1 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px;">
|
|
<img src="./img/overview/gantt-view-project/w7-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-12 d-flex align-items-center justify-content-start ">
|
|
<div>
|
|
<h5 class="text-center mb-4 mt-4"
|
|
style="font-weight: 600; font-size: 28px; line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Stage Color
|
|
</h5>
|
|
<div class="row d-flex align-items-center justify-content-center">
|
|
<div class="col-lg-10">
|
|
<p class="text-center mb-3"
|
|
style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
With this setting, you can set tasks color according
|
|
to the project stage. Based on color assigned to
|
|
different project stages, task color will
|
|
automatically change with its progress and display
|
|
in the Gantt View.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-12 d-flex align-items-center justify-content-center mb-3 px-4">
|
|
<div style="background-color:#FFFFFF; border-radius:2px; padding:20px 15px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/w7.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 4 -->
|
|
<div class="px-3"
|
|
style="border-radius: 5px; background-color: #FFFFFF; padding-top: 35px; padding-bottom: 42px; margin-bottom: 33px;">
|
|
<h5 style="font-weight: 600; font-size: 28px; line-height: 150%; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Task- Edit Screen Gantt View Details
|
|
</h5>
|
|
<p class="mb-4"
|
|
style="font-weight: 500; font-size: 16px; line-height: 26px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
Freedom to modify each task settings
|
|
</p>
|
|
<!-- bg-1 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 22px;">
|
|
<img src="./img/overview/gantt-view-project/z1-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Unschedule
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
This setting unschedule your task from the Gantt View.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#FFFFFF; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/z1.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- bg-2 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 22px;">
|
|
<img src="./img/overview/gantt-view-project/z2-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<div style="background-color:#FFFFFF; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/z2.png"
|
|
alt="img" class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Task Type
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
With this setting, you can create the task either as a task
|
|
or milestone for the project.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- bg-3 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 22px;">
|
|
<img src="./img/overview/gantt-view-project/z3-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Enable Task Duration
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
If you don't know the end date of the task then you enable
|
|
task duration. You just need to enter the Start Date and
|
|
Duration of the project, the end date will automatically
|
|
generate.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/z3.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- bg-4 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 28px;">
|
|
<img src="./img/overview/gantt-view-project/z4-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<div style="background-color:#ffffff; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/z4.png"
|
|
alt="img" class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Start Date
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
Here, you need to enter the start date of the project
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- bg-5 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 22px;">
|
|
<img src="./img/overview/gantt-view-project/z5-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
End Date/ Duration
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
You can either enter the end date or duration (Number of
|
|
days) assigned to the task.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/z5.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- bg-6 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 22px;">
|
|
<img src="./img/overview/gantt-view-project/z6-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-12 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 class="text-center pt-lg-4 pt-3"
|
|
style="font-weight: 600; font-size: 28px;line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Schedule Mode - Auto or Manual
|
|
</h5>
|
|
<div class="row d-flex align-items-center justify-content-center">
|
|
<div class="col-lg-10">
|
|
<p class="text-center"
|
|
style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
You have two options including manual and automatic
|
|
mode to schedule your project tasks.With auto mode,
|
|
the task will automatically schedule according to
|
|
the parent task. For this you need to create a link
|
|
between the tasks. On the other hand with manual
|
|
mode, you need to modify the task dates
|
|
individually.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-12 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#ffffff; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/z6.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- bg-7 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 22px;">
|
|
<img src="./img/overview/gantt-view-project/z7-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Constraint Type
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
In the constraint type, you can set the task priority to get
|
|
a quick view in the Timeline such as “Start No earlier
|
|
than”, “Start no late than” and more.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<div style="background-color:#ffffff; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/z7.png"
|
|
alt="img" class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- bg-8 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-bottom: 25px;">
|
|
<img src="./img/overview/gantt-view-project/z8-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<div style="background-color:#ffffff; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/z8.png"
|
|
alt="img" class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Constraint Date
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
You can set the constraint date and time of the task which
|
|
displays in the Gantt View. It works as a reminder to start
|
|
the task on that specific date.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- bg-9 -->
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px;">
|
|
<img src="./img/overview/gantt-view-project/z9-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-12 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 class="text-center pt-lg-4 pt-3"
|
|
style="font-weight: 600; font-size: 28px;line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Send Mail
|
|
</h5>
|
|
<div class="row d-flex align-items-center justify-content-center">
|
|
<div class="col-lg-10">
|
|
<p class="text-center"
|
|
style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
When the task achieves 90% completion, you can send
|
|
a mail notification regarding project progress and
|
|
timesheet to the configured users. The Send Mail
|
|
button will convert the project report into a PDF
|
|
file and deliver it to the concerned users.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-12 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#ffffff; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/z9.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 5 -->
|
|
<div class="px-3"
|
|
style="border-radius: 5px; background-color: #FFFFFF; padding-top: 35px; padding-bottom: 29px;">
|
|
<h6 class="text-center mb-2"
|
|
style="font-weight: 600; font-size: 32px; line-height: 48px; text-align: center; font-size: calc(1.5rem + 0.4vw); text-indent: 2px; color: #3E3F68;">
|
|
Project Based Configuration > Edit
|
|
</h6>
|
|
<div class="row d-flex align-items-center justify-content-center mb-2">
|
|
<p class="text-center col-lg-9"
|
|
style="font-weight: 400; font-size: 16px; line-height: 24px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
Modify your Project Interface with Gantt Settings
|
|
</p>
|
|
</div>
|
|
<div class="position-relative overflow-hidden"
|
|
style="background-color:#F8F8F8; border-radius: 5px; padding: 20px; padding-top: 40px; padding-bottom: 40px; margin-bottom: 33px;">
|
|
<img src="./img/overview/gantt-view-project/gantt-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-40px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-12 text-center">
|
|
<h5 class="mb-4"
|
|
style="font-weight: 600; font-size: 32px; line-height: 140%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Gantt Settings
|
|
</h5>
|
|
<h6 class="mb-3 pb-1"
|
|
style="font-weight: 500; font-size: 28px; line-height: 130%; letter-spacing: 0.02em; text-indent: 2px; color: #1D567E;">
|
|
Auto Mode Tasks
|
|
</h6>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 24px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
You can set a start date and end date of the task to display the
|
|
marker in the Timeline.
|
|
</p>
|
|
</div>
|
|
<div class="col-lg-6 col-12">
|
|
<div style="background-color: #ffffff; padding-top: 24px; padding-bottom: 14px;"
|
|
class="px-2">
|
|
<h5 style="font-weight: 600; font-size: 28px; line-height: 120%; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Start Date
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; text-align: center;
|
|
letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
When the project/task will begin
|
|
</p>
|
|
<img src="./img/overview/gantt-view-project/s1.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6 col-12" style="margin-bottom:78px">
|
|
<div style="background-color: #ffffff; padding-top: 24px; padding-bottom: 14px;"
|
|
class="px-2">
|
|
<h5 style="font-weight: 600; font-size: 28px; line-height: 120%; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
End Date
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; text-align: center;
|
|
letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
When the project/ task will end
|
|
</p>
|
|
<img src="./img/overview/gantt-view-project/s2.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
<div class="row d-flex justify-content-center">
|
|
<div class="col-lg-10">
|
|
<h5 class="text-center mb-4"
|
|
style="font-weight: 600; font-size: 28px; line-height: 130%; letter-spacing: 0.02em; text-indent: 2px; text-transform: capitalize; color: #3E3F68; text-align: center;">
|
|
Tooltip Settings
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 24px; text-align: center; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
By enabling/disabling tooltip settings you customize the
|
|
tooltip info display in the timeline that include Tite,
|
|
Duration, Start Date, End Date, Progress, Constraint Type,
|
|
Constraint Date, Stage and Deadline.
|
|
</p>
|
|
</div>
|
|
<div class="px-3">
|
|
<img src="./img/overview/gantt-view-project/ts.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="position-relative overflow-hidden"
|
|
style="background-color:#F8F8F8; border-radius: 5px; padding: 20px; padding-top: 52px; padding-bottom: 40px; margin-bottom: 10px;">
|
|
<img src="./img/overview/gantt-view-project/gcs-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-52px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<h5 class="text-center mb-4"
|
|
style="font-weight: 600; font-size: 32px; line-height: 140%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Gantt Chart Settings
|
|
</h5>
|
|
<div class="row" style="margin-bottom: 58px">
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 140%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Dynamic Text
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
Generally project names are too long and don't fit well in
|
|
the task bar. When you enable dynamic text, it automatically
|
|
adjusts it and displays in the Gantt View.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img style="border-radius: 5px;"
|
|
src="./img/overview/gantt-view-project/dd1.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="row" style="margin-bottom: 37px">
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img style="border-radius: 5px;"
|
|
src="./img/overview/gantt-view-project/dd2.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 140%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Dynamic Progress
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
By enabling dynamic progress you can check the project/task
|
|
progress (in percentage) directly in the timeline.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row" style="margin-bottom: 53px">
|
|
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 140%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Days Off
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
Days off highlighted the week offs or holidays in the
|
|
timeline.It keeps you updated with unproductive days of the
|
|
resources.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img style="border-radius: 5px;"
|
|
src="./img/overview/gantt-view-project/d3.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row" style="margin-bottom: 35px">
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img style="border-radius: 5px;"
|
|
src="./img/overview/gantt-view-project/d4.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 140%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Hide Holiday Day
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
By enabling this setting you can hide the display of
|
|
holidays from the timeline.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row" style="margin-bottom: 35px">
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 140%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Select <br class="d-none d-xl-block"> Days
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
In select days, you have the option to select days for
|
|
holidays or Days off to highlight it in the timeline.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img style="border-radius: 5px;"
|
|
src="./img/overview/gantt-view-project/d5.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row" style="margin-bottom: 35px">
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img style="border-radius: 5px;"
|
|
src="./img/overview/gantt-view-project/d6.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 140%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Quick Info
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
When you click on the project bar in the Gantt View, it
|
|
displays a quick box that shows Start Date, Finish Date and
|
|
Title of the project with Edit and Delete. By
|
|
enabling/disabling quick info, you can hide or display the
|
|
quick info.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
|
|
<div class="col-xl-3 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3">
|
|
<h5 style="font-weight: 600; font-size: 28px;line-height: 140%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Mail Timesheet User
|
|
</h5>
|
|
<p style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
In this column you need to enter the user email id to whom
|
|
you want to send the mail notifications for Task Timesheet
|
|
Report (once the task is 90% completed).
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-9 d-flex align-items-center justify-content-center ">
|
|
<div style="background-color:#F8F8F8; border-radius:2px; padding:14px; width: 100%;">
|
|
<img style="border-radius: 5px;"
|
|
src="./img/overview/gantt-view-project/d7.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-top: 25px; margin-bottom: 34px;">
|
|
<img src="./img/overview/gantt-view-project/e-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-12 d-flex align-items-center justify-content-start ">
|
|
<div class="pe-lg-3 pt-xl-0 pt-3" style="margin-top:40px">
|
|
<h5 class="text-center mb-4"
|
|
style="font-weight: 600; font-size: 28px;line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Export
|
|
</h5>
|
|
<div class="row d-flex align-items-center justify-content-center">
|
|
<div class="col-lg-10">
|
|
<p class="text-center"
|
|
style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
With this feature you can export your project/tasks
|
|
report in 7 different formats that include Excel,
|
|
PDF, PNG, Json, XML, Primavera P6 and iCal. It gives
|
|
you freedom to export your files in any format.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-12 d-flex align-items-center justify-content-center px-lg-4">
|
|
<div style="background-color:#ffffff; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/ee.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="position-relative overflow-hidden"
|
|
style="border-radius: 5px; padding: 20px; margin-top: 25px;">
|
|
<img src="./img/overview/gantt-view-project/i-bg.png" alt="bg-img"
|
|
loading="lazy"
|
|
style="margin-top:-20px; margin-left: -20px; object-fit: cover;"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid">
|
|
<div class="position-relative">
|
|
<div class="row">
|
|
<div class="col-xl-12 d-flex align-items-center justify-content-start ">
|
|
<div class="w-100 pt-xl-0 pt-3" style="margin-top:40px">
|
|
<h5 class="text-center mb-4"
|
|
style="font-weight: 600; font-size: 28px;line-height: 120%; letter-spacing: 0.02em; text-indent: 2px; color: #3E3F68;">
|
|
Import
|
|
</h5>
|
|
<div class="row d-flex align-items-center justify-content-center">
|
|
<div class="col-lg-10">
|
|
<p class="text-center"
|
|
style="font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; text-indent: 2px; color: #3C3C3C;">
|
|
You can also import the project/tasks reports in two
|
|
formats that include Excel and Json.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-12 d-flex align-items-center justify-content-center px-lg-4">
|
|
<div style="background-color:#ffffff; border-radius:2px; padding:14px; width: 100%;">
|
|
<img src="./img/overview/gantt-view-project/ii.png" alt="img"
|
|
class="w-100 img-fluid" loading="lazy"
|
|
style="border-radius: 5px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="tab-pane fade show pt-4 py-lg-5" id="why-ks" role="tabpanel"
|
|
aria-labelledby="why-ks-tab">
|
|
<div class="p-3 p-lg-5" style="background-color: #FAFAFA; border-radius: 30px;">
|
|
<h5 style=" font-family: 'Inter', sans-serif; font-weight: 600;font-size: 30px;line-height: 155.19%;color: #252525; text-align: center; font-family: 'Inter', sans-serif; font-size: calc(0.93rem + 1vw);">
|
|
Why
|
|
Ksolves
|
|
</h5>
|
|
<p style="font-weight: 500;font-size: 16px;line-height: 155.19%;text-align: center; margin-bottom: 30px; font-family: 'Inter', sans-serif;">
|
|
You know us as the
|
|
<strong style="color: #173E85;"> makers of the "Dashboard Ninja",</strong>
|
|
You
|
|
<br>
|
|
will remember us with Gantt View Project
|
|
</p>
|
|
<ul class="list-unstyled row m-0">
|
|
<li class="col-6 col-md-4 col-lg-3 p-2">
|
|
<img src="images/new-dscr-img/ks_1.png" loading="lazy" alt="logo-img"
|
|
class="img-fluid w-100 h-100">
|
|
</li>
|
|
<li class="col-6 col-md-4 col-lg-3 p-2">
|
|
<img src="images/new-dscr-img/ks_2.png" loading="lazy" alt="logo-img"
|
|
class="img-fluid w-100 h-100">
|
|
</li>
|
|
<li class="col-6 col-md-4 col-lg-3 p-2">
|
|
<img src="images/new-dscr-img/ks_3.png" loading="lazy" alt="logo-img"
|
|
class="img-fluid w-100 h-100">
|
|
</li>
|
|
<li class="col-6 col-md-4 col-lg-3 p-2">
|
|
<img src="images/new-dscr-img/ks_4.png" loading="lazy" alt="logo-img"
|
|
class="img-fluid w-100 h-100">
|
|
</li>
|
|
<li class="col-6 col-md-4 col-lg-3 p-2">
|
|
<img src="images/new-dscr-img/ks_5.png" loading="lazy" alt="logo-img"
|
|
class="img-fluid w-100 h-100">
|
|
</li>
|
|
<li class="col-6 col-md-4 col-lg-3 p-2">
|
|
<img src="images/new-dscr-img/ks_6.png" loading="lazy" alt="logo-img"
|
|
class="img-fluid w-100 h-100">
|
|
</li>
|
|
<li class="col-6 col-md-4 col-lg-3 p-2">
|
|
<img src="images/new-dscr-img/ks_7.png" loading="lazy" alt="logo-img"
|
|
class="img-fluid w-100 h-100">
|
|
</li>
|
|
<li class="col-6 col-md-4 col-lg-3 p-2">
|
|
<img src="images/new-dscr-img/ks_8.png" loading="lazy" alt="logo-img"
|
|
class="img-fluid w-100 h-100">
|
|
</li>
|
|
<li class="col-6 col-md-4 col-lg-3 p-2">
|
|
<img src="images/new-dscr-img/ks_9.png" loading="lazy" alt="logo-img"
|
|
class="img-fluid w-100 h-100">
|
|
</li>
|
|
<li class="col-6 col-md-4 col-lg-3 p-2">
|
|
<img src="images/new-dscr-img/ks_10.png" loading="lazy" alt="logo-img"
|
|
class="img-fluid w-100 h-100">
|
|
</li>
|
|
<li class="col-6 col-md-4 col-lg-3 p-2">
|
|
<img src="images/new-dscr-img/ks_11.png" loading="lazy" alt="logo-img"
|
|
class="img-fluid w-100 h-100">
|
|
</li>
|
|
<li class="col-6 col-md-4 col-lg-3 p-2">
|
|
<img src="images/new-dscr-img/ks_12.png" alt="logo-img" loading="lazy"
|
|
class="img-fluid w-100 h-100">
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="my-3 my-lg-5 p-0 py-lg-4">
|
|
<h5 style=" font-family: 'Inter', sans-serif; font-weight: 600;font-size: 30px;line-height: 155.19%;color: #252525; text-align: center; font-family: 'Inter', sans-serif; font-size: calc(0.93rem + 1vw);">
|
|
Client
|
|
Success
|
|
</h5>
|
|
<p style="font-weight: 500;font-size: 16px;line-height: 155.19%;text-align: center;color: #414141; font-family: 'Inter', sans-serif;">
|
|
Invest
|
|
your trust like our elite clientele did!
|
|
</p>
|
|
<ul class="list-unstyled row m-0 justify-content-center">
|
|
<li class="col-6 col-md-3 col-lg-2 p-1" style="text-align: center;">
|
|
<img src="images/new-dscr-img/ks_c_1.png" loading="lazy" alt="logo-img"
|
|
class="img-fluid">
|
|
</li>
|
|
<li class="col-6 col-md-3 col-lg-2 p-1" style="text-align: center;">
|
|
<img src="images/new-dscr-img/ks_c_2.png" loading="lazy" alt="logo-img"
|
|
class="img-fluid">
|
|
</li>
|
|
<li class="col-6 col-md-3 col-lg-2 p-1" style="text-align: center;">
|
|
<img src="images/new-dscr-img/ks_c_3.png" alt="logo-img" loading="lazy"
|
|
class="img-fluid">
|
|
</li>
|
|
<li class="col-6 col-md-3 col-lg-2 p-1" style="text-align: center;">
|
|
<img src="images/new-dscr-img/ks_c_4.png" alt="logo-img" loading="lazy"
|
|
class="img-fluid">
|
|
</li>
|
|
<li class="col-6 col-md-3 col-lg-2 p-1" style="text-align: center;">
|
|
<img src="images/new-dscr-img/ks_c_5.png" alt="logo-img" loading="lazy"
|
|
class="img-fluid">
|
|
</li>
|
|
<li class="col-6 col-md-3 col-lg-2 p-1" style="text-align: center;">
|
|
<img src="images/new-dscr-img/ks_c_6.png" alt="logo-img" loading="lazy"
|
|
class="img-fluid">
|
|
</li>
|
|
<li class="col-6 col-md-3 col-lg-2 p-1" style="text-align: center;">
|
|
<img src="images/new-dscr-img/ks_c_7.png" alt="logo-img" loading="lazy"
|
|
class="img-fluid">
|
|
</li>
|
|
<li class="col-6 col-md-3 col-lg-2 p-1" style="text-align: center;">
|
|
<img src="images/new-dscr-img/ks_c_8.png" alt="logo-img" loading="lazy"
|
|
class="img-fluid">
|
|
</li>
|
|
<li class="col-6 col-md-3 col-lg-2 p-1" style="text-align: center;">
|
|
<img src="images/new-dscr-img/ks_c_9.png" alt="logo-img" loading="lazy"
|
|
class="img-fluid">
|
|
</li>
|
|
<li class="col-6 col-md-3 col-lg-2 p-1" style="text-align: center;">
|
|
<img src="images/new-dscr-img/ks_c_10.png" alt="logo-img" loading="lazy"
|
|
class="img-fluid">
|
|
</li>
|
|
<li class="col-6 col-md-3 col-lg-2 p-1" style="text-align: center;">
|
|
<img src="images/new-dscr-img/ks_c_11.png" alt="logo-img" loading="lazy"
|
|
class="img-fluid">
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="p-3 p-lg-5" style="background-color: #FAFAFA; border-radius: 30px;">
|
|
<h1 style="font-weight: 600;font-size: 30px;line-height: 155.19%;color: #252525; text-align: center; font-size: calc(0.93rem + 1vw); font-family: 'Inter', sans-serif;">
|
|
Products That Blends Together
|
|
</h1>
|
|
<p style="font-weight: 500;font-size: 16px;line-height: 155.19%;text-align: center; margin-bottom: 30px; font-family: 'Inter', sans-serif;">
|
|
Related Products You May Be Interested In!
|
|
</p>
|
|
<div>
|
|
<div class="table-responsive">
|
|
<table class="table w-100">
|
|
<tr>
|
|
<td class="text-center" style="padding: 0.5rem;">
|
|
<a target="_blank"
|
|
href="https://apps.odoo.com/apps/modules/15.0/ks_dashboard_ninja/"
|
|
class="d-block bg-white p-4 text-center mx-auto"
|
|
style="border-radius: 10px;width: 180px;min-height: 248px; text-decoration: none;">
|
|
<img src="./img/why-ksolves/ks_dashboard_ninja.png" alt="logo"
|
|
style="border-radius: 10px;" loading="lazy">
|
|
<div style="color: #333;font-size: 16px;font-weight: 600;"
|
|
class="mt-3">Dashboard Ninja
|
|
</div>
|
|
</a>
|
|
</td>
|
|
<td class="text-center"
|
|
style="padding: 0.5rem; vertical-align: middle;font-size: 20px;color: #333;font-weight: 700;"
|
|
class="px-2">
|
|
+
|
|
</td>
|
|
<td class="text-center" style="padding: 0.5rem;">
|
|
<a target="_blank"
|
|
href="https://apps.odoo.com/apps/themes/14.0/ks_curved_backend_theme/"
|
|
class="d-block bg-white p-4 text-center mx-auto"
|
|
style="border-radius: 10px;width: 180px;min-height: 248px; text-decoration: none;">
|
|
<img src="./img/why-ksolves/ks_curved_backend_theme.png"
|
|
alt="logo" loading="lazy" style="border-radius: 10px;"
|
|
width="135" height="136">
|
|
<div style="color: #333;font-size: 16px;font-weight: 600;"
|
|
class="mt-3">Arc Backend Theme
|
|
</div>
|
|
</a>
|
|
</td>
|
|
<td class="text-center"
|
|
style=" padding: 0.5rem; vertical-align: middle;font-size: 20px;color: #333;font-weight: 700;"
|
|
class="px-2">
|
|
+
|
|
</td>
|
|
<td class="text-center" style="padding: 0.5rem;">
|
|
<a target="_blank"
|
|
href="https://apps.odoo.com/apps/modules/15.0/ks_gantt_view_base/"
|
|
class="d-block bg-white p-4 text-center mx-auto"
|
|
style="border-radius: 10px;width: 180px;min-height: 195px; text-decoration: none;">
|
|
<img src="./img/why-ksolves/ks_gantt_view_base.png" alt="logo"
|
|
loading="lazy" style="border-radius: 10px;" width="135"
|
|
height="136">
|
|
<div style="color: #333;font-size: 16px;font-weight: 600;"
|
|
class="mt-3">Odoo Gantt View Base
|
|
</div>
|
|
</a>
|
|
</td>
|
|
<td class="text-center"
|
|
style="padding: 0.5rem; vertical-align: middle;font-size: 20px;color: #333;font-weight: 700;"
|
|
class="px-2">
|
|
=
|
|
</td>
|
|
<td class="text-center" style="padding: 0.5rem;">
|
|
<div class="d-block bg-white p-4 text-center mx-auto"
|
|
style="border-radius: 10px;width: 180px;min-height: 248px;">
|
|
<img src="./img/why-ksolves/perfect_combo.png" alt="logo"
|
|
loading="lazy" style="border-radius: 10px;">
|
|
<div style="color: #333;font-size: 16px;font-weight: 600;"
|
|
class="mt-3">Perfect Combo
|
|
</div>
|
|
</div>
|
|
</td>
|
|
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="tab-pane fade show pt-4 py-lg-5" id="support" role="tabpanel"
|
|
aria-labelledby="support-tab">
|
|
<div class=" text-center">
|
|
<h3 style="font-size: 18px;line-height: 155.19%;color: #414141; margin-bottom: 36px; font-family: 'Inter', sans-serif; ">
|
|
Ksolves is 24/7 open to discuss your thoughts and queries!
|
|
</h3>
|
|
<img src="images/new-dscr-img/solution.png" loading="lazy" alt="" class="img-fluid">
|
|
<div class="text-center">
|
|
<div class="row d-flex align-items-center justify-content-center"
|
|
style="margin-top:10px">
|
|
<div class="col-lg-4 col-md-5 col-sm-9 col-11">
|
|
<a class="d-flex align-items-center justify-content-center px-2 py-3"
|
|
href="mailto:sales@ksolves.com"
|
|
style="background-color: #173E85; text-decoration: none; border-radius: 5px;font-style: normal; font-weight: 400; font-size: 14px; color: #ffffff; height:45px;">
|
|
<img alt="mail-icon" class="img-fluid pe-2 ps-2 me-xl-2 me-lg-0 me-2"
|
|
loading="lazy" src="./img/email.png">sales@ksolves.com</a>
|
|
</div>
|
|
<div class="col-lg-4 col-md-5 col-sm-9 col-11 mt-md-0 mt-2">
|
|
<a class=" d-flex align-items-center justify-content-center px-2 py-3"
|
|
href="tel:+91-8527471031"
|
|
style="background-color: #173E85; text-decoration: none; border-radius: 5px;font-style: normal; font-weight: 400; font-size: 14px; color: #ffffff; height:45px;">
|
|
<img alt="phone" class="img-fluid pe-2 ps-2 me-xl-2 me-lg-0 me-2"
|
|
loading="lazy" src="./img/phone.png">+91-8527471031</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row justify-content-center mt-3 mt-lg-5">
|
|
<div class="col-12 col-md-8">
|
|
<img src="images/new-dscr-img/ks_map_img.png" loading="lazy" alt=""
|
|
class="w-100">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
<div class="tab-pane fade show pt-4 py-lg-5" id="faq" role="tabpanel" aria-labelledby="faq-tab">
|
|
<div id="accordion6" class="accordion">
|
|
<div style="background-color:#fff">
|
|
<!-- Question 1 -->
|
|
<div class="card-header collapsed"
|
|
style="background-color:transparent; border:none; border-top:1px solid #E8E8E8"
|
|
data-bs-toggle="collapse" href="#collapseFAQOne">
|
|
<a class="d-flex align-items-center justify-content-between" style="text-decoration:none; cursor: pointer; color:inherit; font-size:18px; line-height:30px; font-weight:500; font-family:'Inter', sans-serif"
|
|
class="card-title">
|
|
What is a Gantt chart?
|
|
<img src="./images/new-dscr-img/down-arrow.svg" loading="lazy" alt=""
|
|
class="float-right pt-2">
|
|
</a>
|
|
</div>
|
|
<div id="collapseFAQOne" class="card-body collapse" data-bs-parent="#accordion6">
|
|
<p style="font-size:16px; line-height:27px; color:#414141; font-weight:normal; font-family:'Inter', sans-serif">
|
|
Using Gantt Chart, you can simply organize & manage numerous tasks as you
|
|
create & schedule projects with the assistance of a Gantt diagram.
|
|
</p>
|
|
</div>
|
|
<!-- Question 2 -->
|
|
<div style="background-color:transparent; border:none; border-top:1px solid #E8E8E8"
|
|
class="card-header collapsed" data-bs-toggle="collapse" data-bs-parent="#accordion6"
|
|
href="#collapseFAQTwo">
|
|
<a class="d-flex align-items-center justify-content-between" style="text-decoration:none; cursor: pointer; color:inherit; font-size:18px; line-height:30px; font-weight:500; font-family:'Inter', sans-serif"
|
|
class="card-title">
|
|
Can I create Project, Task and Sub-task in the gantt view itself?
|
|
<img src="./images/new-dscr-img/down-arrow.svg" loading="lazy" alt=""
|
|
class="float-right pt-2">
|
|
</a>
|
|
</div>
|
|
<div id="collapseFAQTwo" class="card-body collapse" data-bs-parent="#accordion6">
|
|
<p style="font-size:16px; line-height:27px; color:#414141; font-weight:normal; font-family:'Inter', sans-serif">
|
|
Yes, it is possible to create projects along with tasks & sub-tasks
|
|
utilizing the shortcuts like create and add buttons.
|
|
</p>
|
|
</div>
|
|
<!-- Question 3 -->
|
|
<div style="background-color:transparent; border:none; border-top:1px solid #E8E8E8"
|
|
class="card-header collapsed" data-bs-toggle="collapse" data-bs-parent="#accordion6"
|
|
href="#collapseFAQThree">
|
|
<a class="d-flex align-items-center justify-content-between" style="text-decoration:none; cursor: pointer; color:inherit; font-size:18px; line-height:30px; font-weight:500; font-family:'Inter', sans-serif"
|
|
class="card-title">
|
|
How to set up a duration for specific tasks & milestones?
|
|
<img src="./images/new-dscr-img/down-arrow.svg" loading="lazy" alt=""
|
|
class="float-right pt-2">
|
|
</a>
|
|
</div>
|
|
<div id="collapseFAQThree" class="collapse" data-bs-parent="#accordion6">
|
|
<div class="card-body">
|
|
<p style="font-size:16px; line-height:27px; color:#414141; font-weight:normal; font-family:'Inter', sans-serif">
|
|
Task Duration can be set by turning on the Enable Task Duration option
|
|
from the Task Edit section. Enter the Duration (number of days) from a
|
|
start date and the end date will be calculated accordingly. On the other
|
|
hand, to set Milestones, utilize the Task Type functionality from the
|
|
Gantt View Settings. From here you can mark a task as a general task or
|
|
a milestone of the project. If you mark the task as a milestone, it will
|
|
have a diamond-shaped display instead of a bar
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<!-- Question 4 -->
|
|
<div style="background-color:transparent; border:none; border-top:1px solid #E8E8E8"
|
|
class="card-header collapsed" data-bs-toggle="collapse" data-bs-parent="#accordion6"
|
|
href="#collapse4">
|
|
<a class="d-flex align-items-center justify-content-between" style="text-decoration:none; cursor: pointer; color:inherit; font-size:18px; line-height:30px; font-weight:500; font-family:'Inter', sans-serif"
|
|
class="card-title">
|
|
How do I export the gantt chart?
|
|
<img src="./images/new-dscr-img/down-arrow.svg" loading="lazy" alt=""
|
|
class="float-right pt-2">
|
|
</a>
|
|
</div>
|
|
<div id="collapse4" class="collapse" data-bs-parent="#accordion6">
|
|
<div class="card-body">
|
|
<p style="font-size:16px; line-height:27px; color:#414141; font-weight:normal; font-family:'Inter', sans-serif">
|
|
It's pretty simple to export the Gantt chart by clicking on the Export
|
|
button at the top left corner. Export the Gantt View in the format of
|
|
your choice such as PDF, PNG, EXcel, Json, MS Project(XML), PrimaveraP6,
|
|
iCal, etc.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<!-- Question 5 -->
|
|
<div style="background-color:transparent; border:none; border-top:1px solid #E8E8E8"
|
|
class="card-header collapsed" data-bs-toggle="collapse" data-bs-parent="#accordion6"
|
|
href="#collapse5">
|
|
<a class="d-flex align-items-center justify-content-between" style="text-decoration:none; cursor: pointer; color:inherit; font-size:18px; line-height:30px; font-weight:500; font-family:'Inter', sans-serif"
|
|
class="card-title">
|
|
Can I Link Tasks to Risks and Issues?
|
|
<img src="./images/new-dscr-img/down-arrow.svg" loading="lazy" alt=""
|
|
class="float-right pt-2">
|
|
</a>
|
|
</div>
|
|
<div id="collapse5" class="collapse" data-bs-parent="#accordion6">
|
|
<div class="card-body">
|
|
<p style="font-size:16px; line-height:27px; color:#414141; font-weight:normal; font-family:'Inter', sans-serif">
|
|
You can easily link a task to potential risks, alterations, and issues
|
|
making is quite simple for navigation in the software. The emerging
|
|
problems get highlighted that require your attention & intervention.
|
|
Critical Path lets you analyze an aberration caused due to overlapping
|
|
of related task progress.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<!-- Question 6 -->
|
|
<div style="background-color:transparent; border:none; border-top:1px solid #E8E8E8"
|
|
class="card-header collapsed" data-bs-toggle="collapse" data-bs-parent="#accordion6"
|
|
href="#collapse6">
|
|
<a class="d-flex align-items-center justify-content-between" style="text-decoration:none; cursor: pointer; color:inherit; font-size:18px; line-height:30px; font-weight:500; font-family:'Inter', sans-serif"
|
|
class="card-title">
|
|
What is the difference between zoom to fit and zoom in?
|
|
<img src="./images/new-dscr-img/down-arrow.svg" loading="lazy" alt=""
|
|
class="float-right pt-2">
|
|
</a>
|
|
</div>
|
|
<div id="collapse6" class="collapse" data-bs-parent="#accordion6">
|
|
<div class="card-body">
|
|
<p style="font-size:16px;line-height:27px;color:#414141; font-weight: normal; font-family: 'Inter', sans-serif;">
|
|
Well, they sound similar but are not the same. If we talk about Zoom To
|
|
Fit, it is used to fit the Gantt chart display on the screen for your
|
|
convenience. It simply fits the Gantt chart by adjusting the display of
|
|
a project on the grid. On the other hand, Zoom In launches a magnified
|
|
view of the Gantt View from where you can modify, brainstorm & explain
|
|
the project details utilizing the wide range of Action Bar
|
|
functionalities.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<!-- Question 7 -->
|
|
<div style="background-color: transparent;border: none;border-top: 1px solid #E8E8E8;"
|
|
class="card-header collapsed" data-bs-toggle="collapse" data-bs-parent="#accordion6"
|
|
href="#collapse7"
|
|
style="background:none; cursor: pointer;">
|
|
<a class="d-flex align-items-center justify-content-between" style="text-decoration:none; cursor: pointer; color: inherit; font-size: 18px;line-height:30px;font-weight:500; font-family: 'Inter', sans-serif;"
|
|
class="card-title">
|
|
What are the shortcuts in Gantt View?
|
|
<img src="images/new-dscr-img/down-arrow.svg" loading="lazy" alt=""
|
|
class="float-right pt-2">
|
|
</a>
|
|
</div>
|
|
<div id="collapse7" class="collapse" data-bs-parent="#accordion6">
|
|
<div class="card-body">
|
|
<p style="font-size:16px;line-height:27px;color:#414141; font-weight: normal; font-family: 'Inter', sans-serif;">
|
|
In Gantt View, for your convenience, you can use shortcuts. There are
|
|
the following combinations: 1) Tab -Press on Tab to select the entire
|
|
graphical representation of Gantt View. 2) Alt + Left/Right- Simply hold
|
|
the Alt key & the Left/Right key to move the Gantt view rightward or
|
|
leftward. 3) Space - By pressing the spacebar on the keyboard, you can
|
|
select a task. 4) Enter - Press on Enter to open the task form. 5)
|
|
Delete - The Delete key on the keyboard can be used to delete a task. 6)
|
|
Ctrl + Left/Right - Hold the control key & left/right key to expand and
|
|
collapse the Gantt View display.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<!-- Question 8 -->
|
|
<div style="background-color:transparent; border:none; border-top:1px solid #E8E8E8"
|
|
class="card-header collapsed" data-bs-toggle="collapse" data-bs-parent="#accordion6"
|
|
href="#collapse8">
|
|
<a class="d-flex align-items-center justify-content-between" style="text-decoration:none; cursor: pointer; color:inherit; font-size:18px; line-height:30px; font-weight:500; font-family:'Inter', sans-serif"
|
|
class="card-title">
|
|
What kinds of email notifications do I receive?
|
|
<img src="./images/new-dscr-img/down-arrow.svg" loading="lazy" alt=""
|
|
class="float-right pt-2">
|
|
</a>
|
|
</div>
|
|
<div id="collapse8" class="collapse" data-bs-parent="#accordion6">
|
|
<div class="card-body">
|
|
<p style="font-size:16px; line-height:27px; color:#414141; font-weight:normal; font-family:'Inter', sans-serif">
|
|
The Mail User option present inside the Project settings allows you to
|
|
assign the user Here is the list of email notifications that you can
|
|
receive: - Timesheet Email Notification It is sent to the user to whom
|
|
the Task Timesheet Report is assigned to, once the task is 90%
|
|
completed. - Reminder Email Notification When a task approaches its
|
|
deadline, an email notification is sent as the task is due in 7 days, 3
|
|
days, and 1 day. - Assignee Email Notification Whenever a user has been
|
|
assigned with a task, he/she will get an email notification regarding
|
|
the same.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="tab-pane fade show" id="releases" role="tabpanel" aria-labelledby="releases-tab">
|
|
<div class="row pt-5 m-0">
|
|
<div class="col-md-3">
|
|
<h4 style="font-size: 16px; color: #514F4F;margin: 0;line-height: 26px; font-family: 'Inter', sans-serif;">
|
|
New Release 17.0.1.0.1
|
|
</h4>
|
|
<span style="font-size: 14px; color: #7A7979;display: block; margin-bottom: 20px; font-family: 'Inter', sans-serif;">
|
|
30th July, 2024
|
|
</span>
|
|
</div>
|
|
<div class="col-md-8">
|
|
<div style="padding: 0 0 40px;">
|
|
<div style="margin:0 0 10px">
|
|
<div style="display:inline-block; padding:0px 8px; color:#514F4F; background-color:#FFD8D8; border-radius:20px">
|
|
Improvement
|
|
|
|
</div>
|
|
</div>
|
|
<div class="d-flex m-0"
|
|
style="color: #7A7979; font-family: 'Inter', sans-serif;">
|
|
<ul class="pl-3 mb-0">
|
|
<li>
|
|
When importing a project, the task link task data is also imported.
|
|
</li>
|
|
</ul>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row pt-5 m-0">
|
|
<div class="col-md-3">
|
|
<h4 style="font-size: 16px; color: #514F4F;margin: 0;line-height: 26px; font-family: 'Inter', sans-serif;">
|
|
Release 17.0.1.0.0
|
|
</h4>
|
|
<span style="font-size: 14px; color: #7A7979;display: block; margin-bottom: 20px; font-family: 'Inter', sans-serif;">
|
|
26th April, 2024
|
|
</span>
|
|
</div>
|
|
<div class="col-md-8">
|
|
<div style="padding: 0 0 40px;">
|
|
<div style="margin:0 0 10px">
|
|
<div style="display:inline-block; padding:0px 8px; color:#514F4F; background-color:#FFD8D8; border-radius:20px">
|
|
Latest Release
|
|
|
|
</div>
|
|
</div>
|
|
<div class="d-flex m-0"
|
|
style="color: #7A7979; font-family: 'Inter', sans-serif;">
|
|
<ul class="pl-3 mb-0">
|
|
<li>
|
|
Latest Version 17 release of odoo Gantt view Project.
|
|
</li>
|
|
</ul>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section>
|
|
<div class="shadow pt-lg-5 pb-4 bg-white" id="free_support" style="margin-top: 42px; border-radius: 20px;">
|
|
<div class="row d-flex align-items-center justify-content-center">
|
|
<div class="col-11 px-0 mx-auto pb-lg-5 position-relative overflow-hidden"
|
|
style="border-radius: 20px; background-color: #fffefd;">
|
|
<img src="./img/support/support-bg.png" alt="bg-img"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid" loading="lazy"
|
|
style="object-fit: cover;top: 0;left: 0;">
|
|
<div class="row position-relative pt-lg-5 px-lg-5 pb-lg-3 p-md-4 p-3 mx-auto d-flex align-items-center"
|
|
style="color: #333333;font-weight: 500;font-size: 16px;width: 95%;">
|
|
<div class="col-lg-auto col-sm-12">
|
|
<img src="./img/support/support.png" width="219" loading="lazy"/>
|
|
</div>
|
|
<div class="col ps-lg-5 ps-0 pt-lg-0 pt-3">
|
|
<h5 class="text-start"
|
|
style="margin-bottom: 15px;font-style: normal;font-weight: 600;font-size: 36px;line-height: 44px;letter-spacing: 0.02em;text-transform: uppercase;color: #FFFFFF; font-family: 'Inter', sans-serif;">
|
|
Free <span style="color:#9EFFFF; font-weight: 800;">90 Days</span> Support
|
|
</h5>
|
|
<p style="font-style: normal;font-weight: 500;font-size: 18px;line-height: 28px;text-transform: capitalize;color: #FFFFFF;margin: 0; font-family: 'Inter', sans-serif;">
|
|
Ksolves will provide FREE 90 days support for any doubt, queries, and bug fixing
|
|
(excluding data recovery) or any type of issues related to this module. This is
|
|
applicable from the date of purchase.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row d-flex align-items-center justify-content-center m-0">
|
|
<div class="col-12 p-0 pt-4 overflow-hidden text-center">
|
|
<p style="font-style: normal;font-weight: 500;font-size: 18px;line-height: 28px;letter-spacing: 0.01em;color: #535456;margin: 0;">
|
|
<span style="font-style: normal;font-weight: 600;font-size: 24px;line-height: 28px;letter-spacing: 0.01em;color: #283C63;margin: 0 10px 0 0;">Note</span>
|
|
Extensively Tested on Odoo Vanilla with Ubuntu OS</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="shadow bg-white" id="all_suggested-app"
|
|
style="margin-top: 42px; border-radius: 20px; padding-top: 41px; padding-bottom: 30px;">
|
|
<h5 class="text-center"
|
|
style="color: #2B5FB2; font-weight: 700; font-size: 32px; line-height:43px; margin-bottom: 25px; font-size: calc(1.5rem + 0.4vw); font-family: 'Inter', sans-serif;">
|
|
<span style="color:#333333; ">Ksolves Suggested Apps</span>
|
|
</h5>
|
|
<div class="row d-flex align-items-center justify-content-center">
|
|
<div class="col-11 pt-lg-3 px-lg-5 pb-lg-2 p-md-4 p-3 position-relative overflow-hidden"
|
|
style="border-radius: 10px; background-color: #fffefd;">
|
|
<div class="row position-relative" style="color: #333333; font-weight: 500; font-size: 16px; ">
|
|
|
|
<div class="col-sm-6 col-lg-4 col-xl-4 mb-3 pe-lg-0 pe-sm-1">
|
|
<a href="https://apps.odoo.com/apps/modules/15.0/ks_dashboard_ninja/" target="_blanck"
|
|
style="text-decoration:none">
|
|
<div class="d-flex align-items-center h-100 bg-white px-3 py-3"
|
|
style="border: 1px solid #EFECEC; border-radius: 8px;">
|
|
<div style="width:100px;">
|
|
<img src="./img/support/Dashboard-Ninja.png" alt="icon" loading="lazy"
|
|
width="100" height="100">
|
|
</div>
|
|
<div class="w-100 ps-3">
|
|
<p style="font-style: normal;font-weight: 500;font-size: 15px;line-height: 150%;text-indent: 2px;color: #535456;"
|
|
class="mb-0">
|
|
Dashboard Ninja
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col-sm-6 col-lg-4 col-xl-4 mb-3 pe-lg-0 pe-sm-1">
|
|
<a href="https://apps.odoo.com/apps/modules/15.0/ks_dn_advance/" target="_blanck"
|
|
style="text-decoration:none">
|
|
<div class="d-flex align-items-center h-100 bg-white px-3 py-3"
|
|
style="border: 1px solid #EFECEC; border-radius: 8px;">
|
|
<div style="width:100px;">
|
|
<img src="./img/support/Dashboard-Ninja-Advance.png" alt="icon"
|
|
loading="lazy" width="100" height="100">
|
|
</div>
|
|
<div class="w-100 ps-3">
|
|
<p style="font-style: normal;font-weight: 500;font-size: 15px;line-height: 150%;text-indent: 2px;color: #535456;"
|
|
class="mb-0">
|
|
Dashboard Ninja Advance
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col-sm-6 col-lg-4 col-xl-4 mb-3 pe-lg-0 pe-sm-1">
|
|
<a href="https://apps.odoo.com/apps/modules/15.0/ks_woocommerce/" target="_blanck"
|
|
style="text-decoration:none">
|
|
<div class="d-flex align-items-center h-100 bg-white px-3 py-3"
|
|
style="border: 1px solid #EFECEC; border-radius: 8px;">
|
|
<div style="width:100px;">
|
|
<img src="./img/support/Odoo-WooCommerce.png" alt="icon" loading="lazy"
|
|
width="100" height="100">
|
|
</div>
|
|
<div class="w-100 ps-3">
|
|
<p style="font-style: normal;font-weight: 500;font-size: 15px;line-height: 150%;text-indent: 2px;color: #535456;"
|
|
class="mb-0">
|
|
Odoo WooCommerce Connector
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col-sm-6 col-lg-4 col-xl-4 mb-3 pe-lg-0 pe-sm-1">
|
|
<a href="https://apps.odoo.com/apps/themes/14.0/ks_curved_backend_theme/"
|
|
target="_blanck" style="text-decoration:none">
|
|
<div class="d-flex align-items-center h-100 bg-white px-3 py-3"
|
|
style="border: 1px solid #EFECEC; border-radius: 8px;">
|
|
<div style="width:100px;">
|
|
<img src="./img/support/arc-backend-theme.png" alt="icon" loading="lazy"
|
|
width="100" height="100">
|
|
</div>
|
|
<div class="w-100 ps-3">
|
|
<p style="font-style: normal;font-weight: 500;font-size: 15px;line-height: 150%;text-indent: 2px;color: #535456;"
|
|
class="mb-0">
|
|
Arc Backend Theme
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col-sm-6 col-lg-4 col-xl-4 mb-3 pe-lg-0 pe-sm-1">
|
|
<a href="https://apps.odoo.com/apps/modules/15.0/ks_gantt_view_base/" target="_blanck"
|
|
style="text-decoration:none">
|
|
<div class="d-flex align-items-center h-100 bg-white px-3 py-3"
|
|
style="border: 1px solid #EFECEC; border-radius: 8px;">
|
|
<div style="width:100px;">
|
|
<img src="./img/support/odoo-base.png" alt="icon" loading="lazy" width="100"
|
|
height="100">
|
|
</div>
|
|
<div class="w-100 ps-3">
|
|
<p style="font-style: normal;font-weight: 500;font-size: 15px;line-height: 150%;text-indent: 2px;color: #535456;"
|
|
class="mb-0">
|
|
Odoo Gantt View Base
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col-sm-6 col-lg-4 col-xl-4 mb-3 pe-lg-0 pe-sm-1">
|
|
<a href="https://apps.odoo.com/apps/modules/15.0/ks_list_view_manager/" target="_blanck"
|
|
style="text-decoration:none">
|
|
<div class="d-flex align-items-center h-100 bg-white px-3 py-3"
|
|
style="border: 1px solid #EFECEC; border-radius: 8px;">
|
|
<div style="width:100px;">
|
|
<img src="./img/support/list-view-manager.png" alt="icon" loading="lazy"
|
|
width="100" height="100">
|
|
</div>
|
|
<div class="w-100 ps-3">
|
|
<p style="font-style: normal;font-weight: 500;font-size: 15px;line-height: 150%;text-indent: 2px;color: #535456;"
|
|
class="mb-0">
|
|
List View Manager
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col-sm-6 col-lg-4 col-xl-4 mb-3 pe-lg-0 pe-sm-1">
|
|
<a href="https://apps.odoo.com/apps/modules/15.0/ks_custom_report/" target="_blanck"
|
|
style="text-decoration:none">
|
|
<div class="d-flex align-items-center h-100 bg-white px-3 py-3"
|
|
style="border: 1px solid #EFECEC; border-radius: 8px;">
|
|
<div style="width:100px;">
|
|
<img src="./img/support/report.png" alt="icon" loading="lazy" width="100"
|
|
height="100">
|
|
</div>
|
|
<div class="w-100 ps-3">
|
|
<p style="font-style: normal;font-weight: 500;font-size: 15px;line-height: 150%;text-indent: 2px;color: #535456;"
|
|
class="mb-0">
|
|
ReportMate
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col-sm-6 col-lg-4 col-xl-4 mb-3 pe-lg-0 pe-sm-1">
|
|
<a href="https://apps.odoo.com/apps/modules/15.0/ks_dynamic_financial_report/"
|
|
style="text-decoration:none" target="_blanck">
|
|
<div class="d-flex align-items-center h-100 bg-white px-3 py-3"
|
|
style="border: 1px solid #EFECEC; border-radius: 8px;">
|
|
<div style="width:100px;">
|
|
<img src="./img/support/dfr.png" alt="icon" style="border-radius: 5px;"
|
|
loading="lazy" width="100" height="100">
|
|
</div>
|
|
<div class="w-100 ps-3">
|
|
<p style="font-style: normal;font-weight: 500;font-size: 15px;line-height: 150%;text-indent: 2px;color: #535456;"
|
|
class="mb-0">
|
|
Dynamic Financial Report
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col-sm-6 col-lg-4 col-xl-4 mb-3 pe-lg-0 pe-sm-1">
|
|
<a href="https://apps.odoo.com/apps/modules/15.0/ks_shopify/" target="_blanck"
|
|
style="text-decoration:none">
|
|
<div class="d-flex align-items-center h-100 bg-white px-3 py-3"
|
|
style="border: 1px solid #EFECEC; border-radius: 8px;">
|
|
<div style="width:100px;">
|
|
<img src="./img/support/shopify.png" alt="icon" loading="lazy" width="100"
|
|
height="100">
|
|
</div>
|
|
<div class="w-100 ps-3">
|
|
<p style="font-style: normal;font-weight: 500;font-size: 15px;line-height: 150%;text-indent: 2px;color: #535456;"
|
|
class="mb-0">
|
|
Odoo Shopify Connector
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="shadow bg-white p-0" id="free_support"
|
|
style="margin-top: 42px; border-radius: 20px; padding-top: 41px; padding-bottom: 41px;">
|
|
<div class="row d-flex align-items-center justify-content-center m-0">
|
|
<div class="col-12 px-0 position-relative overflow-hidden"
|
|
style="border-radius: 20px; background-color: #fffefd;">
|
|
<img src="./img/support/ks-odoo-services-bg.png" alt="bg-img"
|
|
class="h-100 w-100 position-absolute fix-bottom img-fluid" loading="lazy"
|
|
style="object-fit: cover;top: 0;left: 0;">
|
|
<div class="row position-relative pt-lg-3 px-lg-5 pb-lg-3 p-md-4 p-3 mx-auto d-flex align-items-center"
|
|
style="color: #333333;font-weight: 500;font-size: 16px;width: 100%;gap: 35px 70px;">
|
|
<div class="col text-center py-4">
|
|
<h5 class="text-center mb-4"
|
|
style="font-style: normal;font-weight: 700;font-size: 32px;line-height: 48px;letter-spacing: -0.02em;text-indent: 2px;color: #9EFFFF; font-size: calc(1.5rem + 0.4vw); font-family: 'Inter', sans-serif;">
|
|
Ksolves Odoo Services
|
|
</h5>
|
|
<img src="./img/support/services-img.png" width="685" class="img-fluid" loading="lazy"/>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</main>
|
|
<!-- Bootstrap 5 JS cdn -->
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
|
|
</body>
|
|
</html>
|