5070 lines
233 KiB
HTML
5070 lines
233 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<!-- Required Meta Tags Always Come First -->
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
|
|
<!-- Title -->
|
|
<title>Kanban | Front - Admin & Dashboard Template</title>
|
|
|
|
<!-- Favicon -->
|
|
<link rel="shortcut icon" href="./favicon.ico">
|
|
|
|
<!-- Font -->
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap" rel="stylesheet">
|
|
|
|
<!-- CSS Implementing Plugins -->
|
|
<!-- bundlecss:vendor [.] -->
|
|
<link rel="stylesheet" href="./node_modules/bootstrap-icons/font/bootstrap-icons.css">
|
|
|
|
<link rel="stylesheet" href="./node_modules/tom-select/dist/css/tom-select.bootstrap5.css">
|
|
<link rel="stylesheet" href="./node_modules/daterangepicker/daterangepicker.css">
|
|
|
|
<!-- CSS Front Template -->
|
|
<!-- bundlecss:theme [.] ?v=1.0 -->
|
|
|
|
|
|
|
|
<link rel="preload" href="./assets/css/theme.css" data-hs-appearance="default" as="style">
|
|
<link rel="preload" href="./assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
|
|
|
|
<style data-hs-appearance-onload-styles>
|
|
* {
|
|
transition: unset !important;
|
|
}
|
|
|
|
body {
|
|
opacity: 0;
|
|
}
|
|
</style>
|
|
|
|
|
|
|
|
<script>
|
|
window.hs_config = {"autopath":"@@autopath","deleteLine":"hs-builder:delete","deleteLine:build":"hs-builder:build-delete","deleteLine:dist":"hs-builder:dist-delete","previewMode":false,"startPath":"/index.html","vars":{"themeFont":"https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap","version":"?v=1.0"},"layoutBuilder":{"extend":{"switcherSupport":true},"header":{"layoutMode":"default","containerMode":"container-fluid"},"sidebarLayout":"default"},"themeAppearance":{"layoutSkin":"default","sidebarSkin":"default","styles":{"colors":{"primary":"#377dff","transparent":"transparent","white":"#fff","dark":"132144","gray":{"100":"#f9fafc","900":"#1e2022"}},"font":"Inter"}},"languageDirection":{"lang":"en"},"skipFilesFromBundle":{"dist":["assets/js/hs.theme-appearance.js","assets/js/hs.theme-appearance-charts.js"],"build":["assets/css/theme.css","assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside-mini-cache.js","assets/js/demo.js","assets/css/theme-dark.css","assets/css/docs.css","assets/vendor/icon-set/style.css","assets/js/hs.theme-appearance.js","assets/js/hs.theme-appearance-charts.js","node_modules/chartjs-plugin-datalabels/dist/chartjs-plugin-datalabels.min.js"]},"minifyCSSFiles":["assets/css/theme.css","assets/css/theme-dark.css"],"copyDependencies":{"dist":{"*assets/js/theme-custom.js":""},"build":{"*assets/js/theme-custom.js":"","node_modules/bootstrap-icons/font/*fonts/**":"assets/css"}},"buildFolder":"","replacePathsToCDN":{},"directoryNames":{"src":"./src","dist":"./dist","build":"./build"},"fileNames":{"dist":{"js":"theme.min.js","css":"theme.min.css"},"build":{"css":"theme.min.css","js":"theme.min.js","vendorCSS":"vendor.min.css","vendorJS":"vendor.min.js"}},"fileTypes":"jpg|png|svg|mp4|webm|ogv|json"}
|
|
window.hs_config.gulpRGBA = (p1) => {
|
|
const options = p1.split(',')
|
|
const hex = options[0].toString()
|
|
const transparent = options[1].toString()
|
|
|
|
var c;
|
|
if(/^#([A-Fa-f0-9]{3}){1,2}$/.test(hex)){
|
|
c= hex.substring(1).split('');
|
|
if(c.length== 3){
|
|
c= [c[0], c[0], c[1], c[1], c[2], c[2]];
|
|
}
|
|
c= '0x'+c.join('');
|
|
return 'rgba('+[(c>>16)&255, (c>>8)&255, c&255].join(',')+',' + transparent + ')';
|
|
}
|
|
throw new Error('Bad Hex');
|
|
}
|
|
window.hs_config.gulpDarken = (p1) => {
|
|
const options = p1.split(',')
|
|
|
|
let col = options[0].toString()
|
|
let amt = -parseInt(options[1])
|
|
var usePound = false
|
|
|
|
if (col[0] == "#") {
|
|
col = col.slice(1)
|
|
usePound = true
|
|
}
|
|
var num = parseInt(col, 16)
|
|
var r = (num >> 16) + amt
|
|
if (r > 255) {
|
|
r = 255
|
|
} else if (r < 0) {
|
|
r = 0
|
|
}
|
|
var b = ((num >> 8) & 0x00FF) + amt
|
|
if (b > 255) {
|
|
b = 255
|
|
} else if (b < 0) {
|
|
b = 0
|
|
}
|
|
var g = (num & 0x0000FF) + amt
|
|
if (g > 255) {
|
|
g = 255
|
|
} else if (g < 0) {
|
|
g = 0
|
|
}
|
|
return (usePound ? "#" : "") + (g | (b << 8) | (r << 16)).toString(16)
|
|
}
|
|
window.hs_config.gulpLighten = (p1) => {
|
|
const options = p1.split(',')
|
|
|
|
let col = options[0].toString()
|
|
let amt = parseInt(options[1])
|
|
var usePound = false
|
|
|
|
if (col[0] == "#") {
|
|
col = col.slice(1)
|
|
usePound = true
|
|
}
|
|
var num = parseInt(col, 16)
|
|
var r = (num >> 16) + amt
|
|
if (r > 255) {
|
|
r = 255
|
|
} else if (r < 0) {
|
|
r = 0
|
|
}
|
|
var b = ((num >> 8) & 0x00FF) + amt
|
|
if (b > 255) {
|
|
b = 255
|
|
} else if (b < 0) {
|
|
b = 0
|
|
}
|
|
var g = (num & 0x0000FF) + amt
|
|
if (g > 255) {
|
|
g = 255
|
|
} else if (g < 0) {
|
|
g = 0
|
|
}
|
|
return (usePound ? "#" : "") + (g | (b << 8) | (r << 16)).toString(16)
|
|
}
|
|
</script>
|
|
</head>
|
|
|
|
<body class="has-navbar-vertical-aside navbar-vertical-aside-show-xl footer-offset">
|
|
|
|
<script src="./assets/js/hs.theme-appearance.js"></script>
|
|
|
|
|
|
|
|
<script src="./assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside-mini-cache.js"></script>
|
|
|
|
|
|
<!-- ========== HEADER ========== -->
|
|
|
|
<header id="header" class="navbar navbar-expand-lg navbar-fixed navbar-height navbar-container navbar-bordered bg-white">
|
|
<div class="navbar-nav-wrap">
|
|
<!-- Logo -->
|
|
<a class="navbar-brand" href="./index.html" aria-label="Front">
|
|
<img class="navbar-brand-logo" src="./assets/svg/logos/logo.svg" alt="Logo" data-hs-theme-appearance="default">
|
|
<img class="navbar-brand-logo" src="./assets/svg/logos-light/logo.svg" alt="Logo" data-hs-theme-appearance="dark">
|
|
<img class="navbar-brand-logo-mini" src="./assets/svg/logos/logo-short.svg" alt="Logo" data-hs-theme-appearance="default">
|
|
<img class="navbar-brand-logo-mini" src="./assets/svg/logos-light/logo-short.svg" alt="Logo" data-hs-theme-appearance="dark">
|
|
</a>
|
|
<!-- End Logo -->
|
|
|
|
<div class="navbar-nav-wrap-content-start">
|
|
<!-- Navbar Vertical Toggle -->
|
|
<button type="button" class="js-navbar-vertical-aside-toggle-invoker navbar-aside-toggler">
|
|
<i class="bi-arrow-bar-left navbar-toggler-short-align" data-bs-template='<div class="tooltip d-none d-md-block" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>' data-bs-toggle="tooltip" data-bs-placement="right" title="Collapse"></i>
|
|
<i class="bi-arrow-bar-right navbar-toggler-full-align" data-bs-template='<div class="tooltip d-none d-md-block" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>' data-bs-toggle="tooltip" data-bs-placement="right" title="Expand"></i>
|
|
</button>
|
|
|
|
<!-- End Navbar Vertical Toggle -->
|
|
|
|
<!-- Search Form -->
|
|
<div class="dropdown ms-2">
|
|
<!-- Input Group -->
|
|
<div class="d-none d-lg-block">
|
|
<div class="input-group input-group-merge input-group-borderless input-group-hover-light navbar-input-group">
|
|
<div class="input-group-prepend input-group-text">
|
|
<i class="bi-search"></i>
|
|
</div>
|
|
|
|
<input type="search" class="js-form-search form-control" placeholder="Search in front" aria-label="Search in front"
|
|
data-hs-form-search-options='{
|
|
"clearIcon": "#clearSearchResultsIcon",
|
|
"dropMenuElement": "#searchDropdownMenu",
|
|
"dropMenuOffset": 20,
|
|
"toggleIconOnFocus": true,
|
|
"activeClass": "focus"
|
|
}'>
|
|
<a class="input-group-append input-group-text" href="javascript:;">
|
|
<i id="clearSearchResultsIcon" class="bi-x-lg" style="display: none;"></i>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<button class="js-form-search js-form-search-mobile-toggle btn btn-ghost-secondary btn-icon rounded-circle d-lg-none" type="button"
|
|
data-hs-form-search-options='{
|
|
"clearIcon": "#clearSearchResultsIcon",
|
|
"dropMenuElement": "#searchDropdownMenu",
|
|
"dropMenuOffset": 20,
|
|
"toggleIconOnFocus": true,
|
|
"activeClass": "focus"
|
|
}'>
|
|
<i class="bi-search"></i>
|
|
</button>
|
|
<!-- End Input Group -->
|
|
|
|
<!-- Card Search Content -->
|
|
<div id="searchDropdownMenu" class="hs-form-search-menu-content dropdown-menu dropdown-menu-form-search navbar-dropdown-menu-borderless">
|
|
<!-- Body -->
|
|
<div class="card-body-height">
|
|
<div class="d-lg-none">
|
|
<div class="input-group input-group-merge navbar-input-group mb-5">
|
|
<div class="input-group-prepend input-group-text">
|
|
<i class="bi-search"></i>
|
|
</div>
|
|
|
|
<input type="search" class="form-control" placeholder="Search in front" aria-label="Search in front">
|
|
<a class="input-group-append input-group-text" href="javascript:;">
|
|
<i class="bi-x-lg"></i>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<span class="dropdown-header">Recent searches</span>
|
|
|
|
<div class="dropdown-item bg-transparent text-wrap">
|
|
<a class="btn btn-soft-dark btn-xs rounded-pill" href="./index.html">
|
|
Gulp <i class="bi-search ms-1"></i>
|
|
</a>
|
|
<a class="btn btn-soft-dark btn-xs rounded-pill" href="./index.html">
|
|
Notification panel <i class="bi-search ms-1"></i>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<span class="dropdown-header">Tutorials</span>
|
|
|
|
<a class="dropdown-item" href="./index.html">
|
|
<div class="d-flex align-items-center">
|
|
<div class="flex-shrink-0">
|
|
<span class="icon icon-soft-dark icon-xs icon-circle">
|
|
<i class="bi-sliders"></i>
|
|
</span>
|
|
</div>
|
|
|
|
<div class="flex-grow-1 text-truncate ms-2">
|
|
<span>How to set up Gulp?</span>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
|
|
<a class="dropdown-item" href="./index.html">
|
|
<div class="d-flex align-items-center">
|
|
<div class="flex-shrink-0">
|
|
<span class="icon icon-soft-dark icon-xs icon-circle">
|
|
<i class="bi-paint-bucket"></i>
|
|
</span>
|
|
</div>
|
|
|
|
<div class="flex-grow-1 text-truncate ms-2">
|
|
<span>How to change theme color?</span>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<span class="dropdown-header">Members</span>
|
|
|
|
<a class="dropdown-item" href="./index.html">
|
|
<div class="d-flex align-items-center">
|
|
<div class="flex-shrink-0">
|
|
<img class="avatar avatar-xs avatar-circle" src="./assets/img/160x160/img10.jpg" alt="Image Description">
|
|
</div>
|
|
<div class="flex-grow-1 text-truncate ms-2">
|
|
<span>Amanda Harvey <i class="tio-verified text-primary" data-toggle="tooltip" data-placement="top" title="Top endorsed"></i></span>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
|
|
<a class="dropdown-item" href="./index.html">
|
|
<div class="d-flex align-items-center">
|
|
<div class="flex-shrink-0">
|
|
<img class="avatar avatar-xs avatar-circle" src="./assets/img/160x160/img3.jpg" alt="Image Description">
|
|
</div>
|
|
<div class="flex-grow-1 text-truncate ms-2">
|
|
<span>David Harrison</span>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
|
|
<a class="dropdown-item" href="./index.html">
|
|
<div class="d-flex align-items-center">
|
|
<div class="flex-shrink-0">
|
|
<div class="avatar avatar-xs avatar-soft-info avatar-circle">
|
|
<span class="avatar-initials">A</span>
|
|
</div>
|
|
</div>
|
|
<div class="flex-grow-1 text-truncate ms-2">
|
|
<span>Anne Richard</span>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<!-- End Body -->
|
|
|
|
<!-- Footer -->
|
|
<a class="card-footer text-center" href="./index.html">
|
|
See all results <i class="bi-chevron-right small"></i>
|
|
</a>
|
|
<!-- End Footer -->
|
|
</div>
|
|
<!-- End Card Search Content -->
|
|
|
|
</div>
|
|
|
|
<!-- End Search Form -->
|
|
</div>
|
|
|
|
<div class="navbar-nav-wrap-content-end">
|
|
<!-- Navbar -->
|
|
<ul class="navbar-nav">
|
|
<li class="nav-item d-none d-sm-inline-block">
|
|
<!-- Notification -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon rounded-circle" id="navbarNotificationsDropdown" data-bs-toggle="dropdown" aria-expanded="false" data-bs-auto-close="outside" data-bs-dropdown-animation>
|
|
<i class="bi-bell"></i>
|
|
<span class="btn-status btn-sm-status btn-status-danger"></span>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end dropdown-card navbar-dropdown-menu navbar-dropdown-menu-borderless" aria-labelledby="navbarNotificationsDropdown" style="width: 25rem;">
|
|
<!-- Header -->
|
|
<div class="card-header card-header-content-between">
|
|
<h4 class="card-title mb-0">Notifications</h4>
|
|
|
|
<!-- Unfold -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-icon btn-sm btn-ghost-secondary rounded-circle" id="navbarNotificationsDropdownSettings" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end navbar-dropdown-menu navbar-dropdown-menu-borderless" aria-labelledby="navbarNotificationsDropdownSettings">
|
|
<span class="dropdown-header">Settings</span>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive all
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-check2-all dropdown-item-icon"></i> Mark all as read
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-toggle-off dropdown-item-icon"></i> Disable notifications
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-gift dropdown-item-icon"></i> What's new?
|
|
</a>
|
|
<div class="dropdown-divider"></div>
|
|
<span class="dropdown-header">Feedback</span>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-chat-left-dots dropdown-item-icon"></i> Report
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Unfold -->
|
|
</div>
|
|
<!-- End Header -->
|
|
|
|
<!-- Nav -->
|
|
<ul class="nav nav-tabs nav-justified" id="notificationTab" role="tablist">
|
|
<li class="nav-item">
|
|
<a class="nav-link active" href="#notificationNavOne" id="notificationNavOne-tab" data-bs-toggle="tab" data-bs-target="#notificationNavOne" role="tab" aria-controls="notificationNavOne" aria-selected="true">Messages (3)</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="#notificationNavTwo" id="notificationNavTwo-tab" data-bs-toggle="tab" data-bs-target="#notificationNavTwo" role="tab" aria-controls="notificationNavTwo" aria-selected="false">Archived</a>
|
|
</li>
|
|
</ul>
|
|
<!-- End Nav -->
|
|
|
|
<!-- Body -->
|
|
<div class="card-body-height">
|
|
<!-- Tab Content -->
|
|
<div class="tab-content" id="notificationTabContent">
|
|
<div class="tab-pane fade show active" id="notificationNavOne" role="tabpanel" aria-labelledby="notificationNavOne-tab">
|
|
<!-- List Group -->
|
|
<ul class="list-group list-group-flush navbar-card-list-group">
|
|
<!-- Item -->
|
|
<li class="list-group-item form-check-select">
|
|
<div class="row">
|
|
<div class="col-auto">
|
|
<div class="d-flex align-items-center">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" value="" id="notificationCheck1" checked>
|
|
<label class="form-check-label" for="notificationCheck1"></label>
|
|
<span class="form-check-stretched-bg"></span>
|
|
</div>
|
|
<img class="avatar avatar-sm avatar-circle" src="./assets/img/160x160/img3.jpg" alt="Image Description">
|
|
</div>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col ms-n2">
|
|
<h5 class="mb-1">Brian Warner</h5>
|
|
<p class="text-body fs-5">changed an issue from "In Progress" to <span class="badge bg-success">Review</span></p>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<small class="col-auto text-muted text-cap">2hr</small>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<a class="stretched-link" href="#"></a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li class="list-group-item form-check-select">
|
|
<div class="row">
|
|
<div class="col-auto">
|
|
<div class="d-flex align-items-center">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" value="" id="notificationCheck2" checked>
|
|
<label class="form-check-label" for="notificationCheck2"></label>
|
|
<span class="form-check-stretched-bg"></span>
|
|
</div>
|
|
<div class="avatar avatar-sm avatar-soft-dark avatar-circle">
|
|
<span class="avatar-initials">K</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col ms-n2">
|
|
<h5 class="mb-1">Klara Hampton</h5>
|
|
<p class="text-body fs-5">mentioned you in a comment</p>
|
|
<blockquote class="blockquote blockquote-sm">
|
|
Nice work, love! You really nailed it. Keep it up!
|
|
</blockquote>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<small class="col-auto text-muted text-cap">10hr</small>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<a class="stretched-link" href="#"></a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li class="list-group-item form-check-select">
|
|
<div class="row">
|
|
<div class="col-auto">
|
|
<div class="d-flex align-items-center">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" value="" id="notificationCheck3" checked>
|
|
<label class="form-check-label" for="notificationCheck3"></label>
|
|
<span class="form-check-stretched-bg"></span>
|
|
</div>
|
|
<div class="avatar avatar-sm avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img10.jpg" alt="Image Description">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col ms-n2">
|
|
<h5 class="mb-1">Ruby Walter</h5>
|
|
<p class="text-body fs-5">joined the Slack group HS Team</p>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<small class="col-auto text-muted text-cap">3dy</small>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<a class="stretched-link" href="#"></a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li class="list-group-item form-check-select">
|
|
<div class="row">
|
|
<div class="col-auto">
|
|
<div class="d-flex align-items-center">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" value="" id="notificationCheck4">
|
|
<label class="form-check-label" for="notificationCheck4"></label>
|
|
<span class="form-check-stretched-bg"></span>
|
|
</div>
|
|
<div class="avatar avatar-sm avatar-circle">
|
|
<img class="avatar-img" src="./assets/svg/brands/google-icon.svg" alt="Image Description">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col ms-n2">
|
|
<h5 class="mb-1">from Google</h5>
|
|
<p class="text-body fs-5">Start using forms to capture the information of prospects visiting your Google website</p>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<small class="col-auto text-muted text-cap">17dy</small>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<a class="stretched-link" href="#"></a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li class="list-group-item form-check-select">
|
|
<div class="row">
|
|
<div class="col-auto">
|
|
<div class="d-flex align-items-center">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" value="" id="notificationCheck5">
|
|
<label class="form-check-label" for="notificationCheck5"></label>
|
|
<span class="form-check-stretched-bg"></span>
|
|
</div>
|
|
<div class="avatar avatar-sm avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img7.jpg" alt="Image Description">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col ms-n2">
|
|
<h5 class="mb-1">Sara Villar</h5>
|
|
<p class="text-body fs-5">completed <i class="bi-journal-bookmark-fill text-primary"></i> FD-7 task</p>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<small class="col-auto text-muted text-cap">2mn</small>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<a class="stretched-link" href="#"></a>
|
|
</li>
|
|
<!-- End Item -->
|
|
</ul>
|
|
<!-- End List Group -->
|
|
</div>
|
|
|
|
<div class="tab-pane fade" id="notificationNavTwo" role="tabpanel" aria-labelledby="notificationNavTwo-tab">
|
|
<!-- List Group -->
|
|
<ul class="list-group list-group-flush navbar-card-list-group">
|
|
<!-- Item -->
|
|
<li class="list-group-item form-check-select">
|
|
<div class="row">
|
|
<div class="col-auto">
|
|
<div class="d-flex align-items-center">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" value="" id="notificationCheck6">
|
|
<label class="form-check-label" for="notificationCheck6"></label>
|
|
<span class="form-check-stretched-bg"></span>
|
|
</div>
|
|
<div class="avatar avatar-sm avatar-soft-dark avatar-circle">
|
|
<span class="avatar-initials">A</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col ms-n2">
|
|
<h5 class="mb-1">Anne Richard</h5>
|
|
<p class="text-body fs-5">accepted your invitation to join Notion</p>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<small class="col-auto text-muted text-cap">1dy</small>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<a class="stretched-link" href="#"></a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li class="list-group-item form-check-select">
|
|
<div class="row">
|
|
<div class="col-auto">
|
|
<div class="d-flex align-items-center">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" value="" id="notificationCheck7">
|
|
<label class="form-check-label" for="notificationCheck7"></label>
|
|
<span class="form-check-stretched-bg"></span>
|
|
</div>
|
|
<div class="avatar avatar-sm avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img5.jpg" alt="Image Description">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col ms-n2">
|
|
<h5 class="mb-1">Finch Hoot</h5>
|
|
<p class="text-body fs-5">left Slack group HS projects</p>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<small class="col-auto text-muted text-cap">1dy</small>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<a class="stretched-link" href="#"></a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li class="list-group-item form-check-select">
|
|
<div class="row">
|
|
<div class="col-auto">
|
|
<div class="d-flex align-items-center">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" value="" id="notificationCheck8">
|
|
<label class="form-check-label" for="notificationCheck8"></label>
|
|
<span class="form-check-stretched-bg"></span>
|
|
</div>
|
|
<div class="avatar avatar-sm avatar-dark avatar-circle">
|
|
<span class="avatar-initials">HS</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col ms-n2">
|
|
<h5 class="mb-1">Htmlstream</h5>
|
|
<p class="text-body fs-5">you earned a "Top endorsed" <i class="bi-patch-check-fill text-primary"></i> badge</p>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<small class="col-auto text-muted text-cap">6dy</small>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<a class="stretched-link" href="#"></a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li class="list-group-item form-check-select">
|
|
<div class="row">
|
|
<div class="col-auto">
|
|
<div class="d-flex align-items-center">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" value="" id="notificationCheck9">
|
|
<label class="form-check-label" for="notificationCheck9"></label>
|
|
<span class="form-check-stretched-bg"></span>
|
|
</div>
|
|
<div class="avatar avatar-sm avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img8.jpg" alt="Image Description">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col ms-n2">
|
|
<h5 class="mb-1">Linda Bates</h5>
|
|
<p class="text-body fs-5">Accepted your connection</p>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<small class="col-auto text-muted text-cap">17dy</small>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<a class="stretched-link" href="#"></a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li class="list-group-item form-check-select">
|
|
<div class="row">
|
|
<div class="col-auto">
|
|
<div class="d-flex align-items-center">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="checkbox" value="" id="notificationCheck10">
|
|
<label class="form-check-label" for="notificationCheck10"></label>
|
|
<span class="form-check-stretched-bg"></span>
|
|
</div>
|
|
<div class="avatar avatar-sm avatar-soft-dark avatar-circle">
|
|
<span class="avatar-initials">L</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col ms-n2">
|
|
<h5 class="mb-1">Lewis Clarke</h5>
|
|
<p class="text-body fs-5">completed <i class="bi-journal-bookmark-fill text-primary"></i> FD-134 task</p>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<small class="col-auto text-muted text-cap">2mts</small>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<a class="stretched-link" href="#"></a>
|
|
</li>
|
|
<!-- End Item -->
|
|
</ul>
|
|
<!-- End List Group -->
|
|
</div>
|
|
</div>
|
|
<!-- End Tab Content -->
|
|
</div>
|
|
<!-- End Body -->
|
|
|
|
<!-- Card Footer -->
|
|
<a class="card-footer text-center" href="#">
|
|
View all notifications <i class="bi-chevron-right"></i>
|
|
</a>
|
|
<!-- End Card Footer -->
|
|
</div>
|
|
</div>
|
|
<!-- End Notification -->
|
|
</li>
|
|
|
|
<li class="nav-item d-none d-sm-inline-block">
|
|
<!-- Apps -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-icon btn-ghost-secondary rounded-circle" id="navbarAppsDropdown" data-bs-toggle="dropdown" aria-expanded="false" data-bs-dropdown-animation>
|
|
<i class="bi-app-indicator"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end dropdown-card navbar-dropdown-menu navbar-dropdown-menu-borderless" aria-labelledby="navbarAppsDropdown" style="width: 25rem;">
|
|
<!-- Header -->
|
|
<div class="card-header">
|
|
<h4 class="card-title">Web apps & services</h4>
|
|
</div>
|
|
<!-- End Header -->
|
|
|
|
<!-- Body -->
|
|
<div class="card-body card-body-height">
|
|
<a class="dropdown-item" href="#">
|
|
<div class="d-flex align-items-center">
|
|
<div class="flex-shrink-0">
|
|
<img class="avatar avatar-xs avatar-4x3" src="./assets/svg/brands/atlassian-icon.svg" alt="Image Description">
|
|
</div>
|
|
<div class="flex-grow-1 text-truncate ms-3">
|
|
<h5 class="mb-0">Atlassian</h5>
|
|
<p class="card-text text-body">Security and control across Cloud</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
|
|
<a class="dropdown-item" href="#">
|
|
<div class="d-flex align-items-center">
|
|
<div class="flex-shrink-0">
|
|
<img class="avatar avatar-xs avatar-4x3" src="./assets/svg/brands/slack-icon.svg" alt="Image Description">
|
|
</div>
|
|
<div class="flex-grow-1 text-truncate ms-3">
|
|
<h5 class="mb-0">Slack <span class="badge bg-primary rounded-pill text-uppercase ms-1">Try</span></h5>
|
|
<p class="card-text text-body">Email collaboration software</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
|
|
<a class="dropdown-item" href="#">
|
|
<div class="d-flex align-items-center">
|
|
<div class="flex-shrink-0">
|
|
<img class="avatar avatar-xs avatar-4x3" src="./assets/svg/brands/google-webdev-icon.svg" alt="Image Description">
|
|
</div>
|
|
<div class="flex-grow-1 text-truncate ms-3">
|
|
<h5 class="mb-0">Google webdev</h5>
|
|
<p class="card-text text-body">Work involved in developing a website</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
|
|
<a class="dropdown-item" href="#">
|
|
<div class="d-flex align-items-center">
|
|
<div class="flex-shrink-0">
|
|
<img class="avatar avatar-xs avatar-4x3" src="./assets/svg/brands/frontapp-icon.svg" alt="Image Description">
|
|
</div>
|
|
<div class="flex-grow-1 text-truncate ms-3">
|
|
<h5 class="mb-0">Frontapp</h5>
|
|
<p class="card-text text-body">The inbox for teams</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
|
|
<a class="dropdown-item" href="#">
|
|
<div class="d-flex align-items-center">
|
|
<div class="flex-shrink-0">
|
|
<img class="avatar avatar-xs avatar-4x3" src="./assets/svg/illustrations/review-rating-shield.svg" alt="Image Description">
|
|
</div>
|
|
<div class="flex-grow-1 text-truncate ms-3">
|
|
<h5 class="mb-0">HS Support</h5>
|
|
<p class="card-text text-body">Customer service and support</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
|
|
<a class="dropdown-item" href="#">
|
|
<div class="d-flex align-items-center">
|
|
<div class="flex-shrink-0">
|
|
<div class="avatar avatar-sm avatar-soft-dark">
|
|
<span class="avatar-initials"><i class="bi-grid"></i></span>
|
|
</div>
|
|
</div>
|
|
<div class="flex-grow-1 text-truncate ms-3">
|
|
<h5 class="mb-0">More Front products</h5>
|
|
<p class="card-text text-body">Check out more HS products</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<!-- End Body -->
|
|
|
|
<!-- Footer -->
|
|
<a class="card-footer text-center" href="#">
|
|
View all apps <i class="bi-chevron-right"></i>
|
|
</a>
|
|
<!-- End Footer -->
|
|
</div>
|
|
</div>
|
|
<!-- End Apps -->
|
|
</li>
|
|
|
|
<li class="nav-item d-none d-sm-inline-block">
|
|
<!-- Activity -->
|
|
<button class="btn btn-ghost-secondary btn-icon rounded-circle" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasActivityStream" aria-controls="offcanvasActivityStream">
|
|
<i class="bi-x-diamond"></i>
|
|
</button>
|
|
<!-- Activity -->
|
|
</li>
|
|
|
|
<li class="nav-item">
|
|
<!-- Account -->
|
|
<div class="dropdown">
|
|
<a class="navbar-dropdown-account-wrapper" href="javascript:;" id="accountNavbarDropdown" data-bs-toggle="dropdown" aria-expanded="false" data-bs-auto-close="outside" data-bs-dropdown-animation>
|
|
<div class="avatar avatar-sm avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img6.jpg" alt="Image Description">
|
|
<span class="avatar-status avatar-sm-status avatar-status-success"></span>
|
|
</div>
|
|
</a>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end navbar-dropdown-menu navbar-dropdown-menu-borderless navbar-dropdown-account" aria-labelledby="accountNavbarDropdown" style="width: 16rem;">
|
|
<div class="dropdown-item-text">
|
|
<div class="d-flex align-items-center">
|
|
<div class="avatar avatar-sm avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img6.jpg" alt="Image Description">
|
|
</div>
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="mb-0">Mark Williams</h5>
|
|
<p class="card-text text-body">mark@site.com</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<a class="navbar-dropdown-submenu-item dropdown-item dropdown-toggle" href="javascript:;" id="navSubmenuPagesAccountDropdown1" data-bs-toggle="dropdown" aria-expanded="false">Set status</a>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end navbar-dropdown-menu navbar-dropdown-menu-borderless navbar-dropdown-sub-menu" aria-labelledby="navSubmenuPagesAccountDropdown1">
|
|
<a class="dropdown-item" href="#">
|
|
<span class="legend-indicator bg-success me-1"></span> Available
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<span class="legend-indicator bg-danger me-1"></span> Busy
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<span class="legend-indicator bg-warning me-1"></span> Away
|
|
</a>
|
|
<div class="dropdown-divider"></div>
|
|
<a class="dropdown-item" href="#"> Reset status
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
|
|
<a class="dropdown-item" href="#">Profile & account</a>
|
|
<a class="dropdown-item" href="#">Settings</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item" href="#">
|
|
<div class="d-flex align-items-center">
|
|
<div class="flex-shrink-0">
|
|
<div class="avatar avatar-sm avatar-dark avatar-circle">
|
|
<span class="avatar-initials">HS</span>
|
|
</div>
|
|
</div>
|
|
<div class="flex-grow-1 ms-2">
|
|
<h5 class="mb-0">Htmlstream <span class="badge bg-primary rounded-pill text-uppercase ms-1">PRO</span></h5>
|
|
<span class="card-text">hs.example.com</span>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<a class="navbar-dropdown-submenu-item dropdown-item dropdown-toggle" href="javascript:;" id="navSubmenuPagesAccountDropdown2" data-bs-toggle="dropdown" aria-expanded="false">Customization</a>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end navbar-dropdown-menu navbar-dropdown-menu-borderless navbar-dropdown-sub-menu" aria-labelledby="navSubmenuPagesAccountDropdown2">
|
|
<a class="dropdown-item" href="#">
|
|
Invite people
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
Analytics
|
|
<i class="bi-box-arrow-in-up-right"></i>
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
Customize Front
|
|
<i class="bi-box-arrow-in-up-right"></i>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
|
|
<a class="dropdown-item" href="#">Manage team</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item" href="#">Sign out</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Account -->
|
|
</li>
|
|
</ul>
|
|
<!-- End Navbar -->
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- ========== END HEADER ========== -->
|
|
|
|
<!-- ========== MAIN CONTENT ========== -->
|
|
<!-- Navbar Vertical -->
|
|
|
|
<aside class="js-navbar-vertical-aside navbar navbar-vertical-aside navbar-vertical navbar-vertical-fixed navbar-expand-xl navbar-bordered bg-white ">
|
|
<div class="navbar-vertical-container">
|
|
<div class="navbar-vertical-footer-offset">
|
|
<!-- Logo -->
|
|
|
|
|
|
<a class="navbar-brand" href="./index.html" aria-label="Front">
|
|
<img class="navbar-brand-logo" src="./assets/svg/logos/logo.svg" alt="Logo" data-hs-theme-appearance="default">
|
|
<img class="navbar-brand-logo" src="./assets/svg/logos-light/logo.svg" alt="Logo" data-hs-theme-appearance="dark">
|
|
<img class="navbar-brand-logo-mini" src="./assets/svg/logos/logo-short.svg" alt="Logo" data-hs-theme-appearance="default">
|
|
<img class="navbar-brand-logo-mini" src="./assets/svg/logos-light/logo-short.svg" alt="Logo" data-hs-theme-appearance="dark">
|
|
</a>
|
|
|
|
<!-- End Logo -->
|
|
|
|
<!-- Navbar Vertical Toggle -->
|
|
<button type="button" class="js-navbar-vertical-aside-toggle-invoker navbar-aside-toggler">
|
|
<i class="bi-arrow-bar-left navbar-toggler-short-align" data-bs-template='<div class="tooltip d-none d-md-block" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>' data-bs-toggle="tooltip" data-bs-placement="right" title="Collapse"></i>
|
|
<i class="bi-arrow-bar-right navbar-toggler-full-align" data-bs-template='<div class="tooltip d-none d-md-block" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>' data-bs-toggle="tooltip" data-bs-placement="right" title="Expand"></i>
|
|
</button>
|
|
|
|
<!-- End Navbar Vertical Toggle -->
|
|
|
|
<!-- Content -->
|
|
<div class="navbar-vertical-content">
|
|
<div id="navbarVerticalMenu" class="nav nav-pills nav-vertical card-navbar-nav">
|
|
<!-- Collapse -->
|
|
<div class="nav-item">
|
|
<a class="nav-link dropdown-toggle " href="#navbarVerticalMenuDashboards" role="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalMenuDashboards" aria-expanded="false" aria-controls="navbarVerticalMenuDashboards">
|
|
<i class="bi-house-door nav-icon"></i>
|
|
<span class="nav-link-title">Dashboards</span>
|
|
</a>
|
|
|
|
<div id="navbarVerticalMenuDashboards" class="nav-collapse collapse " data-bs-parent="#navbarVerticalMenu">
|
|
<a class="nav-link " href="./index.html">Default</a>
|
|
<a class="nav-link " href="./dashboard-alternative.html">Alternative</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
|
|
<span class="dropdown-header mt-4">Pages</span>
|
|
<small class="bi-three-dots nav-subtitle-replacer"></small>
|
|
|
|
<!-- Collapse -->
|
|
<div class="navbar-nav nav-compact">
|
|
|
|
</div>
|
|
<div id="navbarVerticalMenuPagesMenu">
|
|
<!-- Collapse -->
|
|
<div class="nav-item">
|
|
<a class="nav-link dropdown-toggle " href="#navbarVerticalMenuPagesUsersMenu" role="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalMenuPagesUsersMenu" aria-expanded="false" aria-controls="navbarVerticalMenuPagesUsersMenu">
|
|
<i class="bi-people nav-icon"></i>
|
|
<span class="nav-link-title">Users</span>
|
|
</a>
|
|
|
|
<div id="navbarVerticalMenuPagesUsersMenu" class="nav-collapse collapse " data-bs-parent="#navbarVerticalMenuPagesMenu">
|
|
<a class="nav-link " href="./users.html">Overview</a>
|
|
<a class="nav-link " href="./users-leaderboard.html">Leaderboard</a>
|
|
<a class="nav-link " href="./users-add-user.html">Add User <span class="badge bg-info rounded-pill ms-1">Hot</span></a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
|
|
<!-- Collapse -->
|
|
<div class="nav-item">
|
|
<a class="nav-link dropdown-toggle " href="#navbarVerticalMenuPagesUserProfileMenu" role="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalMenuPagesUserProfileMenu" aria-expanded="false" aria-controls="navbarVerticalMenuPagesUserProfileMenu">
|
|
<i class="bi-person nav-icon"></i>
|
|
<span class="nav-link-title">User Profile <span class="badge bg-primary rounded-pill ms-1">5</span></span>
|
|
</a>
|
|
|
|
<div id="navbarVerticalMenuPagesUserProfileMenu" class="nav-collapse collapse " data-bs-parent="#navbarVerticalMenuPagesMenu">
|
|
<a class="nav-link " href="./user-profile.html">Profile</a>
|
|
<a class="nav-link " href="./user-profile-teams.html">Teams</a>
|
|
<a class="nav-link " href="./user-profile-projects.html">Projects</a>
|
|
<a class="nav-link " href="./user-profile-connections.html">Connections</a>
|
|
<a class="nav-link " href="./user-profile-my-profile.html">My Profile</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
|
|
<!-- Collapse -->
|
|
<div class="nav-item">
|
|
<a class="nav-link dropdown-toggle " href="#navbarVerticalMenuPagesAccountMenu" role="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalMenuPagesAccountMenu" aria-expanded="false" aria-controls="navbarVerticalMenuPagesAccountMenu">
|
|
<i class="bi-person-badge nav-icon"></i>
|
|
<span class="nav-link-title">Account</span>
|
|
</a>
|
|
|
|
<div id="navbarVerticalMenuPagesAccountMenu" class="nav-collapse collapse " data-bs-parent="#navbarVerticalMenuPagesMenu">
|
|
<a class="nav-link " href="./account-settings.html">Settings</a>
|
|
<a class="nav-link " href="./account-billing.html">Billing</a>
|
|
<a class="nav-link " href="./account-invoice.html">Invoice</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
|
|
<!-- Collapse -->
|
|
<div class="nav-item">
|
|
<a class="nav-link dropdown-toggle " href="#navbarVerticalMenuPagesEcommerceMenu" role="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalMenuPagesEcommerceMenu" aria-expanded="false" aria-controls="navbarVerticalMenuPagesEcommerceMenu">
|
|
<i class="bi-basket nav-icon"></i>
|
|
<span class="nav-link-title">E-commerce</span>
|
|
</a>
|
|
|
|
<div id="navbarVerticalMenuPagesEcommerceMenu" class="nav-collapse collapse " data-bs-parent="#navbarVerticalMenuPagesMenu">
|
|
<a class="nav-link " href="./ecommerce.html">Overview</a>
|
|
|
|
<div id="navbarVerticalMenuPagesMenuEcommerce">
|
|
<!-- Collapse -->
|
|
<div class="nav-item">
|
|
<a class="nav-link dropdown-toggle" href="#navbarVerticalMenuPagesEcommerceProductsMenu" role="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalMenuPagesEcommerceProductsMenu" aria-expanded="false" aria-controls="navbarVerticalMenuPagesEcommerceProductsMenu">
|
|
Products
|
|
</a>
|
|
|
|
<div id="navbarVerticalMenuPagesEcommerceProductsMenu" class="nav-collapse collapse " data-bs-parent="#navbarVerticalMenuPagesMenuEcommerce">
|
|
<a class="nav-link " href="./ecommerce-products.html">Products</a>
|
|
<a class="nav-link " href="./ecommerce-product-details.html">Product Details</a>
|
|
<a class="nav-link " href="./ecommerce-add-product.html">Add Product</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
|
|
<!-- Collapse -->
|
|
<div class="nav-item">
|
|
<a class="nav-link dropdown-toggle" href="#navbarVerticalMenuPagesEcommerceOrdersMenu" role="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalMenuPagesEcommerceOrdersMenu" aria-expanded="false" aria-controls="navbarVerticalMenuPagesEcommerceOrdersMenu">
|
|
Orders
|
|
</a>
|
|
|
|
<div id="navbarVerticalMenuPagesEcommerceOrdersMenu" class="nav-collapse collapse " data-bs-parent="#navbarVerticalMenuPagesMenuEcommerce">
|
|
<a class="nav-link " href="./ecommerce-orders.html">Orders</a>
|
|
<a class="nav-link " href="./ecommerce-order-details.html">Order Details</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
|
|
<!-- Collapse -->
|
|
<div class="nav-item">
|
|
<a class="nav-link dropdown-toggle" href="#navbarVerticalMenuPagesEcommerceCustomersMenu" role="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalMenuPagesEcommerceCustomersMenu" aria-expanded="false" aria-controls="navbarVerticalMenuPagesEcommerceCustomersMenu">
|
|
Customers
|
|
</a>
|
|
|
|
<div id="navbarVerticalMenuPagesEcommerceCustomersMenu" class="nav-collapse collapse " data-bs-parent="#navbarVerticalMenuPagesMenuEcommerce">
|
|
<a class="nav-link " href="./ecommerce-customers.html">Customers</a>
|
|
<a class="nav-link " href="./ecommerce-customer-details.html">Customer Details</a>
|
|
<a class="nav-link " href="./ecommerce-add-customers.html">Add Customers</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
</div>
|
|
|
|
<a class="nav-link " href="./ecommerce-referrals.html">Referrals</a>
|
|
<a class="nav-link " href="./ecommerce-manage-reviews.html">Manage Reviews</a>
|
|
<a class="nav-link " href="./ecommerce-checkout.html">Checkout</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
|
|
<!-- Collapse -->
|
|
<div class="nav-item">
|
|
<a class="nav-link dropdown-toggle " href="#navbarVerticalMenuPagesProjectsMenu" role="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalMenuPagesProjectsMenu" aria-expanded="false" aria-controls="navbarVerticalMenuPagesProjectsMenu">
|
|
<i class="bi-stickies nav-icon"></i>
|
|
<span class="nav-link-title">Projects</span>
|
|
</a>
|
|
|
|
<div id="navbarVerticalMenuPagesProjectsMenu" class="nav-collapse collapse " data-bs-parent="#navbarVerticalMenuPagesMenu">
|
|
<a class="nav-link " href="./projects.html">Overview</a>
|
|
<a class="nav-link " href="./projects-timeline.html">Timeline</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
|
|
<!-- Collapse -->
|
|
<div class="nav-item">
|
|
<a class="nav-link dropdown-toggle " href="#navbarVerticalMenuPagesProjectMenu" role="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalMenuPagesProjectMenu" aria-expanded="false" aria-controls="navbarVerticalMenuPagesProjectMenu">
|
|
<i class="bi-briefcase nav-icon"></i>
|
|
<span class="nav-link-title">Project</span>
|
|
</a>
|
|
|
|
<div id="navbarVerticalMenuPagesProjectMenu" class="nav-collapse collapse " data-bs-parent="#navbarVerticalMenuPagesMenu">
|
|
<a class="nav-link " href="./project.html">Overview</a>
|
|
<a class="nav-link " href="./project-files.html">Files</a>
|
|
<a class="nav-link " href="./project-activity.html">Activity</a>
|
|
<a class="nav-link " href="./project-teams.html">Teams</a>
|
|
<a class="nav-link " href="./project-settings.html">Settings</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
|
|
<!-- Collapse -->
|
|
<div class="nav-item">
|
|
<a class="nav-link dropdown-toggle collapsed" href="#" role="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalMenuAuthentication" aria-expanded="false" aria-controls="navbarVerticalMenuAuthentication">
|
|
<i class="bi-shield-lock nav-icon"></i>
|
|
<span class="nav-link-title">Authentication</span>
|
|
</a>
|
|
|
|
<div id="navbarVerticalMenuAuthentication" class="nav-collapse collapse " data-bs-parent="#navbarVerticalMenu">
|
|
<div id="navbarVerticalMenuAuthenticationMenu">
|
|
<!-- Collapse -->
|
|
<div class="nav-item">
|
|
<a class="nav-link dropdown-toggle " href="#navbarVerticalMenuAuthenticationLoginMenu" role="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalMenuAuthenticationLoginMenu" aria-expanded="false" aria-controls="navbarVerticalMenuAuthenticationLoginMenu">
|
|
Log In
|
|
</a>
|
|
|
|
<div id="navbarVerticalMenuAuthenticationLoginMenu" class="nav-collapse collapse " data-bs-parent="#navbarVerticalMenuAuthenticationMenu">
|
|
<a class="nav-link " href="./authentication-login-basic.html">Basic</a>
|
|
<a class="nav-link " href="./authentication-login-cover.html">Cover</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
|
|
<!-- Collapse -->
|
|
<div class="nav-item">
|
|
<a class="nav-link dropdown-toggle " href="#navbarVerticalMenuAuthenticationSignupMenu" role="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalMenuAuthenticationSignupMenu" aria-expanded="false" aria-controls="navbarVerticalMenuAuthenticationSignupMenu">
|
|
Sign Up
|
|
</a>
|
|
|
|
<div id="navbarVerticalMenuAuthenticationSignupMenu" class="nav-collapse collapse " data-bs-parent="#navbarVerticalMenuAuthenticationMenu">
|
|
<a class="nav-link " href="./authentication-signup-basic.html">Basic</a>
|
|
<a class="nav-link " href="./authentication-signup-cover.html">Cover</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
|
|
<!-- Collapse -->
|
|
<div class="nav-item">
|
|
<a class="nav-link dropdown-toggle " href="#navbarVerticalMenuAuthenticationResetPasswordMenu" role="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalMenuAuthenticationResetPasswordMenu" aria-expanded="false" aria-controls="navbarVerticalMenuAuthenticationResetPasswordMenu">
|
|
Reset Password
|
|
</a>
|
|
|
|
<div id="navbarVerticalMenuAuthenticationResetPasswordMenu" class="nav-collapse collapse " data-bs-parent="#navbarVerticalMenuAuthenticationMenu">
|
|
<a class="nav-link " href="./authentication-reset-password-basic.html">Basic</a>
|
|
<a class="nav-link " href="./authentication-reset-password-cover.html">Cover</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
|
|
<!-- Collapse -->
|
|
<div class="nav-item">
|
|
<a class="nav-link dropdown-toggle " href="#navbarVerticalMenuAuthenticationEmailVerificationMenu" role="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalMenuAuthenticationEmailVerificationMenu" aria-expanded="false" aria-controls="navbarVerticalMenuAuthenticationEmailVerificationMenu">
|
|
Email Verification
|
|
</a>
|
|
|
|
<div id="navbarVerticalMenuAuthenticationEmailVerificationMenu" class="nav-collapse collapse " data-bs-parent="#navbarVerticalMenuAuthenticationMenu">
|
|
<a class="nav-link " href="./authentication-email-verification-basic.html">Basic</a>
|
|
<a class="nav-link " href="./authentication-email-verification-cover.html">Cover</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
|
|
<!-- Collapse -->
|
|
<div class="nav-item">
|
|
<a class="nav-link dropdown-toggle " href="#navbarVerticalMenuAuthentication2StepVerificationMenu" role="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalMenuAuthentication2StepVerificationMenu" aria-expanded="false" aria-controls="navbarVerticalMenuAuthentication2StepVerificationMenu">
|
|
2-step Verification
|
|
</a>
|
|
|
|
<div id="navbarVerticalMenuAuthentication2StepVerificationMenu" class="nav-collapse collapse " data-bs-parent="#navbarVerticalMenuAuthenticationMenu">
|
|
<a class="nav-link " href="./authentication-2-step-verification-basic.html">Basic</a>
|
|
<a class="nav-link " href="./authentication-2-step-verification-cover.html">Cover</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
|
|
<a class="nav-link" href="javascript:;" data-bs-toggle="modal" data-bs-target="#welcomeMessageModal">Welcome Message</a>
|
|
<a class="nav-link " href="./error-404.html">Error 404</a>
|
|
<a class="nav-link " href="./error-500.html">Error 500</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
|
|
<div class="nav-item">
|
|
<a class="nav-link " href="./api-keys.html" data-placement="left">
|
|
<i class="bi-key nav-icon"></i>
|
|
<span class="nav-link-title">API Keys</span>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="nav-item">
|
|
<a class="nav-link " href="./welcome-page.html" data-placement="left">
|
|
<i class="bi-eye nav-icon"></i>
|
|
<span class="nav-link-title">Welcome Page</span>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="nav-item">
|
|
<a class="nav-link " href="./landing.html" data-placement="left">
|
|
<i class="bi-box-seam nav-icon"></i>
|
|
<span class="nav-link-title">Landing Page <span class="badge bg-info rounded-pill ms-1">New</span></span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
|
|
<span class="dropdown-header mt-4">Apps</span>
|
|
<small class="bi-three-dots nav-subtitle-replacer"></small>
|
|
|
|
<div class="nav-item">
|
|
<a class="nav-link active" href="./apps-kanban.html" data-placement="left">
|
|
<i class="bi-kanban nav-icon"></i>
|
|
<span class="nav-link-title">Kanban</span>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="nav-item">
|
|
<a class="nav-link " href="./apps-calendar.html" data-placement="left">
|
|
<i class="bi-calendar-week nav-icon"></i>
|
|
<span class="nav-link-title">Calendar</span>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="nav-item">
|
|
<a class="nav-link " href="./apps-invoice-generator.html" data-placement="left">
|
|
<i class="bi-receipt nav-icon"></i>
|
|
<span class="nav-link-title">Invoice Generator</span>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="nav-item">
|
|
<a class="nav-link " href="./apps-file-manager.html" data-placement="left">
|
|
<i class="bi-folder2-open nav-icon"></i>
|
|
<span class="nav-link-title">File Manager</span>
|
|
</a>
|
|
</div>
|
|
|
|
<span class="dropdown-header mt-4">Layouts</span>
|
|
<small class="bi-three-dots nav-subtitle-replacer"></small>
|
|
|
|
<div class="nav-item">
|
|
<a class="nav-link " href="./layouts/index.html" data-placement="left">
|
|
<i class="bi-grid-1x2 nav-icon"></i>
|
|
<span class="nav-link-title">Layouts</span>
|
|
</a>
|
|
</div>
|
|
|
|
<span class="dropdown-header mt-4">Documentation</span>
|
|
<small class="bi-three-dots nav-subtitle-replacer"></small>
|
|
|
|
<div class="nav-item">
|
|
<a class="nav-link " href="./documentation/index.html" data-placement="left">
|
|
<i class="bi-book nav-icon"></i>
|
|
<span class="nav-link-title">Documentation <span class="badge bg-primary rounded-pill ms-1">v2.0</span></span>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="nav-item">
|
|
<a class="nav-link " href="./documentation/typography.html" data-placement="left">
|
|
<i class="bi-layers nav-icon"></i>
|
|
<span class="nav-link-title">Components</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<!-- End Content -->
|
|
|
|
<!-- Footer -->
|
|
<div class="navbar-vertical-footer">
|
|
<ul class="navbar-vertical-footer-list">
|
|
<li class="navbar-vertical-footer-list-item">
|
|
<!-- Style Switcher -->
|
|
<div class="dropdown dropup">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon rounded-circle" id="selectThemeDropdown" data-bs-toggle="dropdown" aria-expanded="false" data-bs-dropdown-animation>
|
|
|
|
</button>
|
|
|
|
<div class="dropdown-menu navbar-dropdown-menu navbar-dropdown-menu-borderless" aria-labelledby="selectThemeDropdown">
|
|
<a class="dropdown-item" href="#" data-icon="bi-moon-stars" data-value="auto">
|
|
<i class="bi-moon-stars me-2"></i>
|
|
<span class="text-truncate" title="Auto (system default)">Auto (system default)</span>
|
|
</a>
|
|
<a class="dropdown-item" href="#" data-icon="bi-brightness-high" data-value="default">
|
|
<i class="bi-brightness-high me-2"></i>
|
|
<span class="text-truncate" title="Default (light mode)">Default (light mode)</span>
|
|
</a>
|
|
<a class="dropdown-item active" href="#" data-icon="bi-moon" data-value="dark">
|
|
<i class="bi-moon me-2"></i>
|
|
<span class="text-truncate" title="Dark">Dark</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- End Style Switcher -->
|
|
</li>
|
|
|
|
<li class="navbar-vertical-footer-list-item">
|
|
<!-- Other Links -->
|
|
<div class="dropdown dropup">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon rounded-circle" id="otherLinksDropdown" data-bs-toggle="dropdown" aria-expanded="false" data-bs-dropdown-animation>
|
|
<i class="bi-info-circle"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu navbar-dropdown-menu-borderless" aria-labelledby="otherLinksDropdown">
|
|
<span class="dropdown-header">Help</span>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-journals dropdown-item-icon"></i>
|
|
<span class="text-truncate" title="Resources & tutorials">Resources & tutorials</span>
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-command dropdown-item-icon"></i>
|
|
<span class="text-truncate" title="Keyboard shortcuts">Keyboard shortcuts</span>
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-alt dropdown-item-icon"></i>
|
|
<span class="text-truncate" title="Connect other apps">Connect other apps</span>
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-gift dropdown-item-icon"></i>
|
|
<span class="text-truncate" title="What's new?">What's new?</span>
|
|
</a>
|
|
<div class="dropdown-divider"></div>
|
|
<span class="dropdown-header">Contacts</span>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-chat-left-dots dropdown-item-icon"></i>
|
|
<span class="text-truncate" title="Contact support">Contact support</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Other Links -->
|
|
</li>
|
|
|
|
<li class="navbar-vertical-footer-list-item">
|
|
<!-- Language -->
|
|
<div class="dropdown dropup">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon rounded-circle" id="selectLanguageDropdown" data-bs-toggle="dropdown" aria-expanded="false" data-bs-dropdown-animation>
|
|
<img class="avatar avatar-xss avatar-circle" src="./node_modules/flag-icon-css/flags/1x1/us.svg" alt="United States Flag">
|
|
</button>
|
|
|
|
<div class="dropdown-menu navbar-dropdown-menu-borderless" aria-labelledby="selectLanguageDropdown">
|
|
<span class="dropdown-header">Select language</span>
|
|
<a class="dropdown-item" href="#">
|
|
<img class="avatar avatar-xss avatar-circle me-2" src="./node_modules/flag-icon-css/flags/1x1/us.svg" alt="Flag">
|
|
<span class="text-truncate" title="English">English (US)</span>
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<img class="avatar avatar-xss avatar-circle me-2" src="./node_modules/flag-icon-css/flags/1x1/gb.svg" alt="Flag">
|
|
<span class="text-truncate" title="English">English (UK)</span>
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<img class="avatar avatar-xss avatar-circle me-2" src="./node_modules/flag-icon-css/flags/1x1/de.svg" alt="Flag">
|
|
<span class="text-truncate" title="Deutsch">Deutsch</span>
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<img class="avatar avatar-xss avatar-circle me-2" src="./node_modules/flag-icon-css/flags/1x1/dk.svg" alt="Flag">
|
|
<span class="text-truncate" title="Dansk">Dansk</span>
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<img class="avatar avatar-xss avatar-circle me-2" src="./node_modules/flag-icon-css/flags/1x1/it.svg" alt="Flag">
|
|
<span class="text-truncate" title="Italiano">Italiano</span>
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<img class="avatar avatar-xss avatar-circle me-2" src="./node_modules/flag-icon-css/flags/1x1/cn.svg" alt="Flag">
|
|
<span class="text-truncate" title="中文 (繁體)">中文 (繁體)</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- End Language -->
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<!-- End Footer -->
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
|
|
|
|
|
|
|
|
|
|
<main id="content" role="main" class="main">
|
|
<!-- Content -->
|
|
<div class="content container-fluid">
|
|
<!-- Page Header -->
|
|
<div class="page-header">
|
|
<div class="row align-items-end">
|
|
<div class="col-sm mb-2 mb-sm-0">
|
|
<nav aria-label="breadcrumb">
|
|
<ol class="breadcrumb breadcrumb-no-gutter">
|
|
<li class="breadcrumb-item"><a class="breadcrumb-link" href="javascript:;">Apps</a></li>
|
|
<li class="breadcrumb-item active" aria-current="page">Kanban</li>
|
|
</ol>
|
|
</nav>
|
|
|
|
<h1 class="page-header-title">Kanban</h1>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-lg-auto">
|
|
<span class="text-cap small">Team members:</span>
|
|
|
|
<div class="d-flex">
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-circle me-3">
|
|
<a class="avatar" href="./user-profile.html" data-bs-toggle="tooltip" data-bs-placement="top" title="Amanda Harvey">
|
|
<img class="avatar-img" src="./assets/img/160x160/img10.jpg" alt="Image Description">
|
|
</a>
|
|
<a class="avatar" href="./user-profile.html" data-bs-toggle="tooltip" data-bs-placement="top" title="Linda Bates">
|
|
<img class="avatar-img" src="./assets/img/160x160/img9.jpg" alt="Image Description">
|
|
</a>
|
|
<a class="avatar avatar-soft-info" href="./user-profile.html" data-bs-toggle="tooltip" data-bs-placement="top" title="#digitalmarketing">
|
|
<span class="avatar-initials">
|
|
<i class="bi-people-fill"></i>
|
|
</span>
|
|
</a>
|
|
<a class="avatar" href="./user-profile.html" data-bs-toggle="tooltip" data-bs-placement="top" title="David Harrison">
|
|
<img class="avatar-img" src="./assets/img/160x160/img3.jpg" alt="Image Description">
|
|
</a>
|
|
<a class="avatar avatar-soft-dark" href="./user-profile.html" data-bs-toggle="tooltip" data-bs-placement="top" title="Antony Taylor">
|
|
<span class="avatar-initials">A</span>
|
|
</a>
|
|
|
|
<a class="avatar avatar-light avatar-circle" href="javascript:;" data-bs-toggle="modal" data-bs-target="#shareWithPeopleModal">
|
|
<span class="avatar-initials">+2</span>
|
|
</a>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
|
|
<a class="btn btn-primary btn-icon rounded-circle" href="javascript:;" data-bs-toggle="modal" data-bs-target="#shareWithPeopleModal">
|
|
<i class="bi-share-fill"></i>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
</div>
|
|
<!-- End Page Header -->
|
|
</div>
|
|
<!-- End Content -->
|
|
|
|
<!-- Content -->
|
|
<div class="content container-fluid my-n9">
|
|
<div class="row mb-5">
|
|
<div class="col-12 col-sm-auto mb-3">
|
|
<!-- Input Group -->
|
|
<div class="input-group input-group-merge">
|
|
<div class="input-group-prepend input-group-text">
|
|
<i class="bi-search"></i>
|
|
</div>
|
|
<input type="search" class="form-control" placeholder="Search projects" aria-label="Search projects">
|
|
</div>
|
|
<!-- End Input Group -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3">
|
|
<!-- Daterangepicker -->
|
|
<button id="js-daterangepicker-predefined" class="btn btn-ghost-secondary dropdown-toggle">
|
|
<i class="bi-calendar-week"></i>
|
|
<span class="js-daterangepicker-predefined-preview ms-2"></span>
|
|
</button>
|
|
<!-- End Daterangepicker -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 ms-auto">
|
|
<!-- Nav -->
|
|
<ul class="nav nav-segment" id="connectionsTab" role="tablist">
|
|
<li class="nav-item">
|
|
<a class="nav-link active" id="grid-tab" data-bs-toggle="tab" href="#grid" role="tab" aria-controls="grid" aria-selected="true" title="Column view">
|
|
<i class="bi-grid"></i>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" id="list-tab" data-bs-toggle="tab" href="#list" role="tab" aria-controls="list" aria-selected="false" title="List view">
|
|
<i class="bi-view-list"></i>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<!-- End Nav -->
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
<!-- End Content -->
|
|
|
|
<!-- Tab Content -->
|
|
<div class="tab-content" id="connectionsTabContent">
|
|
<div class="tab-pane fade show active" id="grid" role="tabpanel" aria-labelledby="grid-tab">
|
|
<!-- Content -->
|
|
<div class="content container-fluid kanban-board">
|
|
<!-- Kanban Row -->
|
|
<ul class="row list-unstyled kanban-board-row">
|
|
<li class="js-add-field col-12"
|
|
data-hs-add-field-options='{
|
|
"template": "#createProjectGridTemplateToDo",
|
|
"container": "#createProjectGridContainerToDo",
|
|
"defaultCreated": 0
|
|
}'>
|
|
<!-- Title -->
|
|
<div class="js-sortable-disabled d-flex justify-content-between align-items-center mb-3">
|
|
<h6 class="text-cap mb-0">To do</h6>
|
|
|
|
<a class="js-create-field btn btn-white btn-icon btn-xs" href="javascript:;" data-bs-toggle="tooltip" data-bs-placement="left" title="Add project">
|
|
<i class="bi-plus"></i>
|
|
</a>
|
|
</div>
|
|
<!-- End Title -->
|
|
|
|
<div class="js-sortable">
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom sortablejs-custom-rotate sortablejs-custom-handle" data-href="#">
|
|
<div class="card mb-3">
|
|
<div class="card-body">
|
|
<div class="d-flex mb-5">
|
|
<div class="me-2">
|
|
<h4 class="text-wrap">Front mobile app launch</h4>
|
|
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img6.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img7.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-soft-dark avatar-circle">
|
|
<span class="avatar-initials">I</span>
|
|
</span>
|
|
<span class="fs-6 ms-2">3 Assignees</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
</div>
|
|
|
|
<div class="ms-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsGridDropdown1" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsGridDropdown1">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-3">
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">20</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Completed</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progressbar" style="width: 0%" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom sortablejs-custom-rotate sortablejs-custom-handle" data-href="#">
|
|
<div class="card mb-3">
|
|
<div class="card-body">
|
|
<div class="d-flex mb-5">
|
|
<div class="me-2">
|
|
<h4 class="text-wrap">Increase page loading speed</h4>
|
|
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img3.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img6.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="fs-6 ms-2">2 Assignees</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
</div>
|
|
|
|
<div class="ms-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsGridDropdown2" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsGridDropdown2">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-3">
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">3</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Completed</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progressbar" style="width: 0%" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom sortablejs-custom-rotate sortablejs-custom-handle" data-href="#">
|
|
<div class="card mb-3">
|
|
<div class="card-body">
|
|
<div class="d-flex mb-5">
|
|
<div class="me-2">
|
|
<h4 class="text-wrap">Implement a calendar plugin</h4>
|
|
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img5.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="fs-6 ms-2">1 Assignee</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
</div>
|
|
|
|
<div class="ms-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsGridDropdown3" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsGridDropdown3">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-3">
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">9</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Completed</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progressbar" style="width: 0%" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
</div>
|
|
|
|
<!-- Container For Input Field -->
|
|
<div id="createProjectGridContainerToDo"></div>
|
|
|
|
<!-- Card -->
|
|
<div class="d-grid">
|
|
<a class="js-sortable-disabled js-create-field btn btn-white btn-dashed-outline" href="javascript:;">
|
|
<i class="bi-plus"></i> Add project
|
|
</a>
|
|
</div>
|
|
<!-- End Card -->
|
|
|
|
<!-- Add Create Project Template -->
|
|
<form id="createProjectGridTemplateToDo" style="display: none;">
|
|
<div class="js-sortable-link sortablejs-custom sortablejs-custom-rotate sortablejs-custom-handle" data-href="#">
|
|
<div class="card mb-3">
|
|
<div class="card-body">
|
|
<div class="mb-4">
|
|
<textarea class="form-control" placeholder="What needs to be done?" data-name="body" aria-label="What needs to be done?"></textarea>
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-end gap-3">
|
|
<a class="js-delete-field btn btn-white btn-sm" href="javascript:;">Cancel</a>
|
|
<a class="btn btn-primary btn-sm" href="javascript:;">Create</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<!-- End Add Create Project Template -->
|
|
</li>
|
|
|
|
<li class="js-add-field col-12"
|
|
data-hs-add-field-options='{
|
|
"template": "#createProjectGridTemplateInProgress",
|
|
"container": "#createProjectGridContainerInProgress",
|
|
"defaultCreated": 0
|
|
}'>
|
|
<!-- Title -->
|
|
<div class="js-sortable-disabled d-flex justify-content-between align-items-center mb-3">
|
|
<h6 class="text-cap mb-0">In progress</h6>
|
|
|
|
<a class="js-create-field btn btn-white btn-icon btn-xs" href="javascript:;" data-bs-toggle="tooltip" data-bs-placement="left" title="Add project">
|
|
<i class="bi-plus"></i>
|
|
</a>
|
|
</div>
|
|
<!-- End Title -->
|
|
|
|
<div class="js-sortable">
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom sortablejs-custom-rotate sortablejs-custom-handle" data-href="#">
|
|
<div class="card mb-3">
|
|
<div class="card-body">
|
|
<div class="d-flex mb-5">
|
|
<div class="me-2">
|
|
<h4 class="text-wrap">Display tasks in account page</h4>
|
|
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img7.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img5.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img8.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="fs-6 ms-2">3 Assignees</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
</div>
|
|
|
|
<div class="ms-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsGridDropdown4" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsGridDropdown4">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-3">
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">7</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">12</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">3</span>
|
|
<span class="d-block fs-6">Days left</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar bg-warning" role="progressbar" style="width: 72%" aria-valuenow="72" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom sortablejs-custom-rotate sortablejs-custom-handle" data-href="#">
|
|
<div class="card mb-3">
|
|
<div class="card-body">
|
|
<div class="d-flex mb-5">
|
|
<div class="me-2">
|
|
<h4 class="text-wrap">Update Slack integration to use the new bot token</h4>
|
|
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img5.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-soft-danger avatar-circle">
|
|
<span class="avatar-initials">P</span>
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img3.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="fs-6 ms-2">3 Assignees</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
</div>
|
|
|
|
<div class="ms-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsGridDropdown5" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsGridDropdown5">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-3">
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">40</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">20</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">45</span>
|
|
<span class="d-block fs-6">Days left</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar bg-danger" role="progressbar" style="width: 22%" aria-valuenow="22" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
</div>
|
|
|
|
<!-- Container For Input Field -->
|
|
<div id="createProjectGridContainerInProgress"></div>
|
|
|
|
<!-- Card -->
|
|
<div class="d-grid">
|
|
<a class="js-sortable-disabled js-create-field btn btn-white btn-dashed-outline" href="javascript:;">
|
|
<i class="bi-plus"></i> Add project
|
|
</a>
|
|
</div>
|
|
<!-- End Card -->
|
|
|
|
<!-- Add Create Project Template -->
|
|
<form id="createProjectGridTemplateInProgress" style="display: none;">
|
|
<div class="js-sortable-link sortablejs-custom sortablejs-custom-rotate sortablejs-custom-handle" data-href="#">
|
|
<div class="card mb-3">
|
|
<div class="card-body">
|
|
<div class="mb-4">
|
|
<textarea class="form-control" placeholder="What needs to be done?" data-name="body" aria-label="What needs to be done?"></textarea>
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-end gap-3">
|
|
<a class="js-delete-field btn btn-white btn-sm" href="javascript:;">Cancel</a>
|
|
<a class="btn btn-primary btn-sm" href="javascript:;">Create</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<!-- End Add Create Project Template -->
|
|
</li>
|
|
|
|
<li class="js-add-field col-12"
|
|
data-hs-add-field-options='{
|
|
"template": "#createProjectGridTemplateReview",
|
|
"container": "#createProjectGridContainerReview",
|
|
"defaultCreated": 0
|
|
}'>
|
|
<!-- Title -->
|
|
<div class="js-sortable-disabled d-flex justify-content-between align-items-center mb-3">
|
|
<h6 class="text-cap mb-0">Review</h6>
|
|
|
|
<a class="js-create-field btn btn-white btn-icon btn-xs" href="javascript:;" data-bs-toggle="tooltip" data-bs-placement="left" title="Add project">
|
|
<i class="bi-plus"></i>
|
|
</a>
|
|
</div>
|
|
<!-- End Title -->
|
|
|
|
<div class="js-sortable">
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom sortablejs-custom-rotate sortablejs-custom-handle" data-href="#">
|
|
<div class="card mb-3">
|
|
<div class="card-body">
|
|
<div class="d-flex mb-5">
|
|
<div class="me-2">
|
|
<h4 class="text-wrap">Design banner for social networks</h4>
|
|
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-soft-info avatar-circle">
|
|
<span class="avatar-initials">L</span>
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img9.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="fs-6 ms-2">2 Assignees</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
</div>
|
|
|
|
<div class="ms-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsGridDropdown6" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsGridDropdown6">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-3">
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">7</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">7</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">2</span>
|
|
<span class="d-block fs-6">Days left</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar bg-success" role="progressbar" style="width: 99%" aria-valuenow="99" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
</div>
|
|
|
|
<!-- Container For Input Field -->
|
|
<div id="createProjectGridContainerReview"></div>
|
|
|
|
<!-- Card -->
|
|
<div class="d-grid">
|
|
<a class="js-sortable-disabled js-create-field btn btn-white btn-dashed-outline" href="javascript:;">
|
|
<i class="bi-plus"></i> Add project
|
|
</a>
|
|
</div>
|
|
<!-- End Card -->
|
|
|
|
<!-- Add Create Project Template -->
|
|
<form id="createProjectGridTemplateReview" style="display: none;">
|
|
<div class="js-sortable-link sortablejs-custom sortablejs-custom-rotate sortablejs-custom-handle" data-href="#">
|
|
<div class="card mb-3">
|
|
<div class="card-body">
|
|
<div class="mb-4">
|
|
<textarea class="form-control" placeholder="What needs to be done?" data-name="body" aria-label="What needs to be done?"></textarea>
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-end gap-3">
|
|
<a class="js-delete-field btn btn-white btn-sm" href="javascript:;">Cancel</a>
|
|
<a class="btn btn-primary btn-sm" href="javascript:;">Create</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<!-- End Add Create Project Template -->
|
|
</li>
|
|
|
|
<li class="js-add-field col-12"
|
|
data-hs-add-field-options='{
|
|
"template": "#createProjectGridTemplateDone",
|
|
"container": "#createProjectGridContainerDone",
|
|
"defaultCreated": 0
|
|
}'>
|
|
<!-- Title -->
|
|
<div class="js-sortable-disabled d-flex justify-content-between align-items-center mb-3">
|
|
<h6 class="text-cap mb-0">Done</h6>
|
|
|
|
<a class="js-create-field btn btn-white btn-icon btn-xs" href="javascript:;" data-bs-toggle="tooltip" data-bs-placement="left" title="Add project">
|
|
<i class="bi-plus"></i>
|
|
</a>
|
|
</div>
|
|
<!-- End Title -->
|
|
|
|
<div class="js-sortable">
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom sortablejs-custom-rotate sortablejs-custom-handle" data-href="#">
|
|
<div class="card mb-3">
|
|
<div class="card-body">
|
|
<div class="d-flex mb-5">
|
|
<div class="me-2">
|
|
<h4 class="text-wrap">Create product roadmap</h4>
|
|
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img5.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="fs-6 ms-2">1 Assignee</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
</div>
|
|
|
|
<div class="ms-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsGridDropdown7" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsGridDropdown7">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-3">
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">1</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">1</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Completed</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom sortablejs-custom-rotate sortablejs-custom-handle" data-href="#">
|
|
<div class="card mb-3">
|
|
<div class="card-body">
|
|
<div class="d-flex mb-5">
|
|
<div class="me-2">
|
|
<h4 class="text-wrap">Mobile: notifications for subscribe pages and goals</h4>
|
|
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img5.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img7.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img3.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="fs-6 ms-2">3 Assignees</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
</div>
|
|
|
|
<div class="ms-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsGridDropdown8" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsGridDropdown8">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-3">
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">5</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">7</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Completed</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom sortablejs-custom-rotate sortablejs-custom-handle" data-href="#">
|
|
<div class="card mb-3">
|
|
<div class="card-body">
|
|
<div class="d-flex mb-5">
|
|
<div class="me-2">
|
|
<h4 class="text-wrap">Allow commenting from the report view</h4>
|
|
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img9.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img4.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-soft-info avatar-circle">
|
|
<span class="avatar-initials">V</span>
|
|
</span>
|
|
<span class="fs-6 ms-2">3 Assignees</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
</div>
|
|
|
|
<div class="ms-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsGridDropdown9" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsGridDropdown9">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-3">
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">3</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">6</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Completed</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom sortablejs-custom-rotate sortablejs-custom-handle" data-href="#">
|
|
<div class="card mb-3">
|
|
<div class="card-body">
|
|
<div class="d-flex mb-5">
|
|
<div class="me-2">
|
|
<h4 class="text-wrap">Public API</h4>
|
|
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img4.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img5.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img6.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="fs-6 ms-2">3 Assignees</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
</div>
|
|
|
|
<div class="ms-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsGridDropdown10" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsGridDropdown10">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-3">
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">75</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">4</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-4">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Completed</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
</div>
|
|
|
|
<!-- Container For Input Field -->
|
|
<div id="createProjectGridContainerDone"></div>
|
|
|
|
<!-- Card -->
|
|
<div class="d-grid">
|
|
<a class="js-sortable-disabled js-create-field btn btn-white btn-dashed-outline" href="javascript:;">
|
|
<i class="bi-plus"></i> Add project
|
|
</a>
|
|
</div>
|
|
<!-- End Card -->
|
|
|
|
<!-- Add Create Project Template -->
|
|
<form id="createProjectGridTemplateDone" style="display: none;">
|
|
<div class="js-sortable-link sortablejs-custom sortablejs-custom-rotate sortablejs-custom-handle" data-href="#">
|
|
<div class="card mb-3">
|
|
<div class="card-body">
|
|
<div class="mb-4">
|
|
<textarea class="form-control" placeholder="What needs to be done?" data-name="body" aria-label="What needs to be done?"></textarea>
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-end gap-3">
|
|
<a class="js-delete-field btn btn-white btn-sm" href="javascript:;">Cancel</a>
|
|
<a class="btn btn-primary btn-sm" href="javascript:;">Create</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<!-- End Add Create Project Template -->
|
|
</li>
|
|
|
|
<li class="col-12">
|
|
<!-- Title -->
|
|
<div class="js-sortable-disabled d-flex justify-content-between align-items-center mb-3">
|
|
<h6 class="text-cap mb-0">Create a new group</h6>
|
|
|
|
<div class="js-sortable"></div>
|
|
|
|
<a class="btn btn-white btn-icon btn-xs" href="javascript:;" data-bs-toggle="tooltip" data-bs-placement="left" title="Create group">
|
|
<i class="bi-plus"></i>
|
|
</a>
|
|
</div>
|
|
<!-- End Title -->
|
|
</li>
|
|
</ul>
|
|
<!-- End Kanban Row -->
|
|
</div>
|
|
<!-- End Content -->
|
|
</div>
|
|
|
|
<div class="tab-pane fade" id="list" role="tabpanel" aria-labelledby="list-tab">
|
|
<!-- Content -->
|
|
<div class="content container-fluid">
|
|
<!-- Kanban List -->
|
|
<ul class="list-inline">
|
|
<li class="js-add-field"
|
|
data-hs-add-field-options='{
|
|
"template": "#createProjectListTemplateToDo",
|
|
"container": "#createProjectListContainerToDo",
|
|
"defaultCreated": 0
|
|
}'>
|
|
<!-- Title -->
|
|
<div class="js-sortable-disabled d-flex justify-content-between align-items-center mb-3">
|
|
<h6 class="text-cap mb-0">To do</h6>
|
|
|
|
<a class="js-create-field btn btn-icon btn-sm btn-white" href="javascript:;" data-bs-toggle="tooltip" data-bs-placement="left" title="Add project">
|
|
<i class="bi-plus"></i>
|
|
</a>
|
|
</div>
|
|
<!-- End Title -->
|
|
|
|
<div class="js-sortable">
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom-handle card mb-3" data-href="#">
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col">
|
|
<h4 class="text-wrap">Front mobile app launch</h4>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsListDropdown1" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsListDropdown1">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row align-items-center">
|
|
<div class="col-sm-auto mb-3 mb-sm-0">
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img6.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img7.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-soft-dark avatar-circle">
|
|
<span class="avatar-initials">I</span>
|
|
</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
|
|
<span class="d-block fs-6">3 Assignees</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">20</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Completed</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-sm">
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progressbar" style="width: 0%" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom-handle card mb-3" data-href="#">
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col">
|
|
<h4 class="text-wrap">Increase page loading speed</h4>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsListDropdown2" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsListDropdown2">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row align-items-center">
|
|
<div class="col-sm-auto mb-3 mb-sm-0">
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img3.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img6.jpg" alt="Image Description">
|
|
</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
|
|
<span class="d-block fs-6">2 Assignees</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">3</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Completed</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-sm">
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progressbar" style="width: 0%" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom-handle card mb-3" data-href="#">
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col">
|
|
<h4 class="text-wrap">Implement a calendar plugin</h4>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsListDropdown3" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsListDropdown3">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row align-items-center">
|
|
<div class="col-sm-auto mb-3 mb-sm-0">
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img3.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img6.jpg" alt="Image Description">
|
|
</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
|
|
<span class="d-block fs-6">2 Assignees</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">9</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Completed</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-sm">
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progressbar" style="width: 0%" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
</div>
|
|
|
|
<!-- Container For Input Field -->
|
|
<div id="createProjectListContainerToDo"></div>
|
|
|
|
<!-- Card -->
|
|
<a class="js-sortable-disabled js-create-field btn btn-white btn-dashed-outline" href="javascript:;">
|
|
<i class="bi-plus"></i> Add project
|
|
</a>
|
|
<!-- End Card -->
|
|
|
|
<!-- Add Create Project Template -->
|
|
<form id="createProjectListTemplateToDo" style="display: none;">
|
|
<div class="js-sortable-link sortablejs-custom-handle card mb-3" data-href="#">
|
|
<div class="card-body">
|
|
<div class="mb-4">
|
|
<textarea class="form-control" placeholder="What needs to be done?" data-name="body" aria-label="What needs to be done?"></textarea>
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-end gap-3">
|
|
<a class="js-delete-field btn btn-white btn-sm" href="javascript:;">Cancel</a>
|
|
<a class="btn btn-primary btn-sm" href="javascript:;">Create</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<!-- End Add Create Project Template -->
|
|
</li>
|
|
|
|
<!-- Divider -->
|
|
<li>
|
|
<hr class="my-7">
|
|
</li>
|
|
<!-- End Divider -->
|
|
|
|
<li class="js-add-field"
|
|
data-hs-add-field-options='{
|
|
"template": "#createProjectListTemplateInProgress",
|
|
"container": "#createProjectListContainerInProgress",
|
|
"defaultCreated": 0
|
|
}'>
|
|
<!-- Title -->
|
|
<div class="js-sortable-disabled d-flex justify-content-between align-items-center mb-3">
|
|
<h6 class="text-cap mb-0">In progress</h6>
|
|
|
|
<a class="js-create-field btn btn-icon btn-sm btn-white" href="javascript:;" data-bs-toggle="tooltip" data-bs-placement="left" title="Add project">
|
|
<i class="bi-plus"></i>
|
|
</a>
|
|
</div>
|
|
<!-- End Title -->
|
|
|
|
<div class="js-sortable">
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom-handle card mb-3" data-href="#">
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col">
|
|
<h4 class="text-wrap">Display tasks in account page</h4>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsListDropdown4" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsListDropdown4">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row align-items-center">
|
|
<div class="col-sm-auto mb-3 mb-sm-0">
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img7.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img5.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img8.jpg" alt="Image Description">
|
|
</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
|
|
<span class="d-block fs-6">3 Assignees</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">7</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">12</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">3</span>
|
|
<span class="d-block fs-6">Completed</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-sm">
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar bg-warning" role="progressbar" style="width: 72%" aria-valuenow="72" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom-handle card mb-3" data-href="#">
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col">
|
|
<h4 class="text-wrap">Update Slack integration to use the new bot token</h4>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsListDropdown5" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsListDropdown5">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row align-items-center">
|
|
<div class="col-sm-auto mb-3 mb-sm-0">
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img5.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-soft-danger avatar-circle">
|
|
<span class="avatar-initials">P</span>
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img3.jpg" alt="Image Description">
|
|
</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
|
|
<span class="d-block fs-6">3 Assignees</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">40</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">20</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">45</span>
|
|
<span class="d-block fs-6">Completed</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-sm">
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar bg-danger" role="progressbar" style="width: 22%" aria-valuenow="22" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
</div>
|
|
|
|
<!-- Container For Input Field -->
|
|
<div id="createProjectListContainerInProgress"></div>
|
|
|
|
<!-- Card -->
|
|
<a class="js-sortable-disabled js-create-field btn btn-white btn-dashed-outline" href="javascript:;">
|
|
<i class="bi-plus"></i> Add project
|
|
</a>
|
|
<!-- End Card -->
|
|
|
|
<!-- Add Create Project Template -->
|
|
<form id="createProjectListTemplateInProgress" style="display: none;">
|
|
<div class="js-sortable-link sortablejs-custom-handle card mb-3" data-href="#">
|
|
<div class="card-body">
|
|
<div class="mb-4">
|
|
<textarea class="form-control" placeholder="What needs to be done?" data-name="body" aria-label="What needs to be done?"></textarea>
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-end gap-3">
|
|
<a class="js-delete-field btn btn-white btn-sm" href="javascript:;">Cancel</a>
|
|
<a class="btn btn-primary btn-sm" href="javascript:;">Create</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<!-- End Add Create Project Template -->
|
|
</li>
|
|
|
|
<!-- Divider -->
|
|
<li>
|
|
<hr class="my-7">
|
|
</li>
|
|
<!-- End Divider -->
|
|
|
|
<li class="js-add-field"
|
|
data-hs-add-field-options='{
|
|
"template": "#createProjectListTemplateReview",
|
|
"container": "#createProjectListContainerReview",
|
|
"defaultCreated": 0
|
|
}'>
|
|
<!-- Title -->
|
|
<div class="js-sortable-disabled d-flex justify-content-between align-items-center mb-3">
|
|
<h6 class="text-cap mb-0">Review</h6>
|
|
|
|
<a class="js-create-field btn btn-icon btn-sm btn-white" href="javascript:;" data-bs-toggle="tooltip" data-bs-placement="left" title="Add project">
|
|
<i class="bi-plus"></i>
|
|
</a>
|
|
</div>
|
|
<!-- End Title -->
|
|
|
|
<div class="js-sortable">
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom-handle card mb-3" data-href="#">
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col">
|
|
<h4 class="text-wrap">Design banner for social networks</h4>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsListDropdown6" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsListDropdown6">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row align-items-center">
|
|
<div class="col-sm-auto mb-3 mb-sm-0">
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-soft-info avatar-circle">
|
|
<span class="avatar-initials">L</span>
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img9.jpg" alt="Image Description">
|
|
</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
|
|
<span class="d-block fs-6">2 Assignees</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">7</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">7</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">2</span>
|
|
<span class="d-block fs-6">Completed</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-sm">
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar bg-success" role="progressbar" style="width: 99%" aria-valuenow="99" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
</div>
|
|
|
|
<!-- Container For Input Field -->
|
|
<div id="createProjectListContainerReview"></div>
|
|
|
|
<!-- Card -->
|
|
<a class="js-sortable-disabled js-create-field btn btn-white btn-dashed-outline" href="javascript:;">
|
|
<i class="bi-plus"></i> Add project
|
|
</a>
|
|
<!-- End Card -->
|
|
|
|
<!-- Add Create Project Template -->
|
|
<form id="createProjectListTemplateReview" style="display: none;">
|
|
<div class="js-sortable-link sortablejs-custom-handle card mb-3" data-href="#">
|
|
<div class="card-body">
|
|
<div class="mb-4">
|
|
<textarea class="form-control" placeholder="What needs to be done?" data-name="body" aria-label="What needs to be done?"></textarea>
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-end gap-3">
|
|
<a class="js-delete-field btn btn-white btn-sm" href="javascript:;">Cancel</a>
|
|
<a class="btn btn-primary btn-sm" href="javascript:;">Create</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<!-- End Add Create Project Template -->
|
|
</li>
|
|
|
|
<!-- Divider -->
|
|
<li>
|
|
<hr class="my-7">
|
|
</li>
|
|
<!-- End Divider -->
|
|
|
|
<li class="js-add-field"
|
|
data-hs-add-field-options='{
|
|
"template": "#createProjectListTemplateDone",
|
|
"container": "#createProjectListContainerDone",
|
|
"defaultCreated": 0
|
|
}'>
|
|
<!-- Title -->
|
|
<div class="js-sortable-disabled d-flex justify-content-between align-items-center mb-3">
|
|
<h6 class="text-cap mb-0">Done</h6>
|
|
|
|
<a class="js-create-field btn btn-icon btn-sm btn-white" href="javascript:;" data-bs-toggle="tooltip" data-bs-placement="left" title="Add project">
|
|
<i class="bi-plus"></i>
|
|
</a>
|
|
</div>
|
|
<!-- End Title -->
|
|
|
|
<div class="js-sortable">
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom-handle card mb-3" data-href="#">
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col">
|
|
<h4 class="text-wrap">Create product roadmap</h4>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsListDropdown7" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsListDropdown7">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row align-items-center">
|
|
<div class="col-sm-auto mb-3 mb-sm-0">
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img5.jpg" alt="Image Description">
|
|
</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
|
|
<span class="d-block fs-6">1 Assignee</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">1</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">1</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Completed</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-sm">
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom-handle card mb-3" data-href="#">
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col">
|
|
<h4 class="text-wrap">Mobile: notifications for subscribe pages and goals</h4>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsListDropdown8" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsListDropdown8">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row align-items-center">
|
|
<div class="col-sm-auto mb-3 mb-sm-0">
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img5.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img7.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img3.jpg" alt="Image Description">
|
|
</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
|
|
<span class="d-block fs-6">3 Assignee</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">5</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">7</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Completed</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-sm">
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom-handle card mb-3" data-href="#">
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col">
|
|
<h4 class="text-wrap">Allow commenting from the report view</h4>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsListDropdown9" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsListDropdown9">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row align-items-center">
|
|
<div class="col-sm-auto mb-3 mb-sm-0">
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img9.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img4.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-soft-info avatar-circle">
|
|
<span class="avatar-initials">V</span>
|
|
</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
|
|
<span class="d-block fs-6">3 Assignee</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">3</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">6</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Completed</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-sm">
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
|
|
<!-- Card -->
|
|
<div class="js-sortable-link sortablejs-custom-handle card mb-3" data-href="#">
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col">
|
|
<h4 class="text-wrap">Public API</h4>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto">
|
|
<!-- Dropdown -->
|
|
<div class="dropdown">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm card-dropdown-btn rounded-circle" id="kanbanProjectsListDropdown10" data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="kanbanProjectsListDropdown10">
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-pencil dropdown-item-icon"></i> Rename project
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-star dropdown-item-icon"></i> Add to favorites
|
|
</a>
|
|
<a class="dropdown-item" href="#">
|
|
<i class="bi-archive dropdown-item-icon"></i> Archive project
|
|
</a>
|
|
|
|
<div class="dropdown-divider"></div>
|
|
|
|
<a class="dropdown-item text-danger" href="#">
|
|
<i class="bi-trash dropdown-item-icon text-danger"></i>
|
|
Remove
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Dropdown -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row align-items-center">
|
|
<div class="col-sm-auto mb-3 mb-sm-0">
|
|
<!-- Avatar Group -->
|
|
<div class="avatar-group avatar-group-sm">
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img4.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img5.jpg" alt="Image Description">
|
|
</span>
|
|
<span class="avatar avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img6.jpg" alt="Image Description">
|
|
</span>
|
|
</div>
|
|
<!-- End Avatar Group -->
|
|
|
|
<span class="d-block fs-6">3 Assignee</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">75</span>
|
|
<span class="d-block fs-6">Tasks</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">4</span>
|
|
<span class="d-block fs-6">Complete</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto mb-3 mb-sm-0">
|
|
<!-- Stats -->
|
|
<div class="text-center">
|
|
<span class="d-block h4 mb-1">0</span>
|
|
<span class="d-block fs-6">Completed</span>
|
|
</div>
|
|
<!-- End Stats -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-sm">
|
|
<!-- Progress -->
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<!-- End Progress -->
|
|
</div>
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
<!-- End Card -->
|
|
</div>
|
|
|
|
<!-- Container For Input Field -->
|
|
<div id="createProjectListContainerDone"></div>
|
|
|
|
<!-- Card -->
|
|
<a class="js-sortable-disabled js-create-field btn btn-white btn-dashed-outline" href="javascript:;">
|
|
<i class="bi-plus"></i> Add project
|
|
</a>
|
|
<!-- End Card -->
|
|
|
|
<!-- Add Create Project Template -->
|
|
<form id="createProjectListTemplateDone" style="display: none;">
|
|
<div class="js-sortable-link sortablejs-custom-handle card mb-3" data-href="#">
|
|
<div class="card-body">
|
|
<div class="mb-4">
|
|
<textarea class="form-control" placeholder="What needs to be done?" data-name="body" aria-label="What needs to be done?"></textarea>
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-end gap-3">
|
|
<a class="js-delete-field btn btn-white btn-sm" href="javascript:;">Cancel</a>
|
|
<a class="btn btn-primary btn-sm" href="javascript:;">Create</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<!-- End Add Create Project Template -->
|
|
</li>
|
|
</ul>
|
|
<!-- End Kanban List -->
|
|
</div>
|
|
<!-- End Content -->
|
|
</div>
|
|
</div>
|
|
<!-- End Tab Content -->
|
|
|
|
<!-- Footer -->
|
|
|
|
<div class="footer">
|
|
<div class="row justify-content-between align-items-center">
|
|
<div class="col">
|
|
<p class="fs-6 mb-0">© <span class="d-none d-sm-inline-block">2022 Magico</span></p>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-auto">
|
|
<div class="d-flex justify-content-end">
|
|
<!-- List Separator -->
|
|
<ul class="list-inline list-separator">
|
|
<li class="list-inline-item">
|
|
<a class="list-separator-link" href="#">Pomoc</a>
|
|
</li>
|
|
|
|
<li class="list-inline-item">
|
|
<a class="list-separator-link" href="#">Magico.pl</a>
|
|
</li>
|
|
|
|
<li class="list-inline-item">
|
|
<!-- Keyboard Shortcuts Toggle -->
|
|
<button class="btn btn-ghost-secondary btn btn-icon btn-ghost-secondary rounded-circle" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasKeyboardShortcuts" aria-controls="offcanvasKeyboardShortcuts">
|
|
<i class="bi-command"></i>
|
|
</button>
|
|
<!-- End Keyboard Shortcuts Toggle -->
|
|
</li>
|
|
</ul>
|
|
<!-- End List Separator -->
|
|
</div>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
|
|
|
|
<!-- End Footer -->
|
|
</main>
|
|
<!-- ========== END MAIN CONTENT ========== -->
|
|
|
|
<!-- ========== SECONDARY CONTENTS ========== -->
|
|
<!-- Keyboard Shortcuts -->
|
|
<div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvasKeyboardShortcuts" aria-labelledby="offcanvasKeyboardShortcutsLabel">
|
|
<div class="offcanvas-header">
|
|
<h4 id="offcanvasKeyboardShortcutsLabel" class="mb-0">Keyboard shortcuts</h4>
|
|
<button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
|
|
</div>
|
|
<div class="offcanvas-body">
|
|
<div class="list-group list-group-sm list-group-flush list-group-no-gutters mb-5">
|
|
<div class="list-group-item">
|
|
<h5 class="mb-1">Formatting</h5>
|
|
</div>
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span class="fw-semi-bold">Bold</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">b</kbd>
|
|
</div>
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<em>italic</em>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">i</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<u>Underline</u>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">u</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<s>Strikethrough</s>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">Alt</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">s</kbd>
|
|
<!-- End Col -->
|
|
</div>
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span class="small">Small text</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">s</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<mark>Highlight</mark>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">e</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="list-group list-group-sm list-group-flush list-group-no-gutters mb-5">
|
|
<div class="list-group-item">
|
|
<h5 class="mb-1">Insert</h5>
|
|
</div>
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Mention person <a href="#">(@Brian)</a></span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">@</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Link to doc <a href="#">(+Meeting notes)</a></span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">+</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<a href="#">#hashtag</a>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">#hashtag</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Date</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">/date</kbd>
|
|
<kbd class="d-inline-block mb-1">Space</kbd>
|
|
<kbd class="d-inline-block mb-1">/datetime</kbd>
|
|
<kbd class="d-inline-block mb-1">/datetime</kbd>
|
|
<kbd class="d-inline-block mb-1">Space</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Time</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">/time</kbd>
|
|
<kbd class="d-inline-block mb-1">Space</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Note box</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">/note</kbd>
|
|
<kbd class="d-inline-block mb-1">Enter</kbd>
|
|
<kbd class="d-inline-block mb-1">/note red</kbd>
|
|
<kbd class="d-inline-block mb-1">/note red</kbd>
|
|
<kbd class="d-inline-block mb-1">Enter</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="list-group list-group-sm list-group-flush list-group-no-gutters mb-5">
|
|
<div class="list-group-item">
|
|
<h5 class="mb-1">Editing</h5>
|
|
</div>
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Find and replace</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">r</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Find next</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">n</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Find previous</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">p</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Indent</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Tab</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Un-indent</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Shift</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">Tab</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Move line up</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">Shift</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1"><i class="bi-arrow-up-short"></i></kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Move line down</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">Shift</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1"><i class="bi-arrow-down-short fs-5"></i></kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Add a comment</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">Alt</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">m</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Undo</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">z</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Redo</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">y</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="list-group list-group-sm list-group-flush list-group-no-gutters">
|
|
<div class="list-group-item">
|
|
<h5 class="mb-1">Application</h5>
|
|
</div>
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Create new doc</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">Alt</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">n</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Present</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">Shift</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">p</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Share</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">Shift</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">s</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Search docs</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">Shift</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">o</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
<div class="list-group-item">
|
|
<div class="row align-items-center">
|
|
<div class="col-5">
|
|
<span>Keyboard shortcuts</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-7 text-end">
|
|
<kbd class="d-inline-block mb-1">Ctrl</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">Shift</kbd> <span class="text-muted small">+</span> <kbd class="d-inline-block mb-1">/</kbd>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Keyboard Shortcuts -->
|
|
|
|
<!-- Activity -->
|
|
<div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvasActivityStream" aria-labelledby="offcanvasActivityStreamLabel">
|
|
<div class="offcanvas-header">
|
|
<h4 id="offcanvasActivityStreamLabel" class="mb-0">Activity stream</h4>
|
|
<button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
|
|
</div>
|
|
<div class="offcanvas-body">
|
|
<!-- Step -->
|
|
<ul class="step step-icon-sm step-avatar-sm">
|
|
<!-- Step Item -->
|
|
<li class="step-item">
|
|
<div class="step-content-wrapper">
|
|
<div class="step-avatar">
|
|
<img class="step-avatar" src="./assets/img/160x160/img9.jpg" alt="Image Description">
|
|
</div>
|
|
|
|
<div class="step-content">
|
|
<h5 class="mb-1">Iana Robinson</h5>
|
|
|
|
<p class="fs-5 mb-1">Added 2 files to task <a class="text-uppercase" href="#"><i class="bi-journal-bookmark-fill"></i> Fd-7</a></p>
|
|
|
|
<ul class="list-group list-group-sm">
|
|
<!-- List Item -->
|
|
<li class="list-group-item list-group-item-light">
|
|
<div class="row gx-1">
|
|
<div class="col-6">
|
|
<!-- Media -->
|
|
<div class="d-flex">
|
|
<div class="flex-shrink-0">
|
|
<img class="avatar avatar-xs" src="./assets/svg/brands/excel-icon.svg" alt="Image Description">
|
|
</div>
|
|
<div class="flex-grow-1 text-truncate ms-2">
|
|
<span class="d-block fs-6 text-dark text-truncate" title="weekly-reports.xls">weekly-reports.xls</span>
|
|
<span class="d-block small text-muted">12kb</span>
|
|
</div>
|
|
</div>
|
|
<!-- End Media -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-6">
|
|
<!-- Media -->
|
|
<div class="d-flex">
|
|
<div class="flex-shrink-0">
|
|
<img class="avatar avatar-xs" src="./assets/svg/brands/word-icon.svg" alt="Image Description">
|
|
</div>
|
|
<div class="flex-grow-1 text-truncate ms-2">
|
|
<span class="d-block fs-6 text-dark text-truncate" title="weekly-reports.xls">weekly-reports.xls</span>
|
|
<span class="d-block small text-muted">4kb</span>
|
|
</div>
|
|
</div>
|
|
<!-- End Media -->
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</li>
|
|
<!-- End List Item -->
|
|
</ul>
|
|
|
|
<span class="small text-muted text-uppercase">Now</span>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End Step Item -->
|
|
|
|
<!-- Step Item -->
|
|
<li class="step-item">
|
|
<div class="step-content-wrapper">
|
|
<span class="step-icon step-icon-soft-dark">B</span>
|
|
|
|
<div class="step-content">
|
|
<h5 class="mb-1">Bob Dean</h5>
|
|
|
|
<p class="fs-5 mb-1">Marked <a class="text-uppercase" href="#"><i class="bi-journal-bookmark-fill"></i> Fr-6</a> as <span class="badge bg-soft-success text-success rounded-pill"><span class="legend-indicator bg-success"></span>"Completed"</span></p>
|
|
|
|
<span class="small text-muted text-uppercase">Today</span>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End Step Item -->
|
|
|
|
<!-- Step Item -->
|
|
<li class="step-item">
|
|
<div class="step-content-wrapper">
|
|
<div class="step-avatar">
|
|
<img class="step-avatar-img" src="./assets/img/160x160/img3.jpg" alt="Image Description">
|
|
</div>
|
|
|
|
<div class="step-content">
|
|
<h5 class="h5 mb-1">Crane</h5>
|
|
|
|
<p class="fs-5 mb-1">Added 5 card to <a href="#">Payments</a></p>
|
|
|
|
<ul class="list-group list-group-sm">
|
|
<li class="list-group-item list-group-item-light">
|
|
<div class="row gx-1">
|
|
<div class="col">
|
|
<img class="img-fluid rounded" src="./assets/svg/components/card-1.svg" alt="Image Description">
|
|
</div>
|
|
<div class="col">
|
|
<img class="img-fluid rounded" src="./assets/svg/components/card-2.svg" alt="Image Description">
|
|
</div>
|
|
<div class="col">
|
|
<img class="img-fluid rounded" src="./assets/svg/components/card-3.svg" alt="Image Description">
|
|
</div>
|
|
<div class="col-auto align-self-center">
|
|
<div class="text-center">
|
|
<a href="#">+2</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
|
|
<span class="small text-muted text-uppercase">May 12</span>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End Step Item -->
|
|
|
|
<!-- Step Item -->
|
|
<li class="step-item">
|
|
<div class="step-content-wrapper">
|
|
<span class="step-icon step-icon-soft-info">D</span>
|
|
|
|
<div class="step-content">
|
|
<h5 class="mb-1">David Lidell</h5>
|
|
|
|
<p class="fs-5 mb-1">Added a new member to Front Dashboard</p>
|
|
|
|
<span class="small text-muted text-uppercase">May 15</span>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End Step Item -->
|
|
|
|
<!-- Step Item -->
|
|
<li class="step-item">
|
|
<div class="step-content-wrapper">
|
|
<div class="step-avatar">
|
|
<img class="step-avatar-img" src="./assets/img/160x160/img7.jpg" alt="Image Description">
|
|
</div>
|
|
|
|
<div class="step-content">
|
|
<h5 class="mb-1">Rachel King</h5>
|
|
|
|
<p class="fs-5 mb-1">Marked <a class="text-uppercase" href="#"><i class="bi-journal-bookmark-fill"></i> Fr-3</a> as <span class="badge bg-soft-success text-success rounded-pill"><span class="legend-indicator bg-success"></span>"Completed"</span></p>
|
|
|
|
<span class="small text-muted text-uppercase">Apr 29</span>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End Step Item -->
|
|
|
|
<!-- Step Item -->
|
|
<li class="step-item">
|
|
<div class="step-content-wrapper">
|
|
<div class="step-avatar">
|
|
<img class="step-avatar-img" src="./assets/img/160x160/img5.jpg" alt="Image Description">
|
|
</div>
|
|
|
|
<div class="step-content">
|
|
<h5 class="mb-1">Finch Hoot</h5>
|
|
|
|
<p class="fs-5 mb-1">Earned a "Top endorsed" <i class="bi-patch-check-fill text-primary"></i> badge</p>
|
|
|
|
<span class="small text-muted text-uppercase">Apr 06</span>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End Step Item -->
|
|
|
|
<!-- Step Item -->
|
|
<li class="step-item">
|
|
<div class="step-content-wrapper">
|
|
<span class="step-icon step-icon-soft-primary">
|
|
<i class="bi-person-fill"></i>
|
|
</span>
|
|
|
|
<div class="step-content">
|
|
<h5 class="mb-1">Project status updated</h5>
|
|
|
|
<p class="fs-5 mb-1">Marked <a class="text-uppercase" href="#"><i class="bi-journal-bookmark-fill"></i> Fr-3</a> as <span class="badge bg-soft-primary text-primary rounded-pill"><span class="legend-indicator bg-primary"></span>"In progress"</span></p>
|
|
|
|
<span class="small text-muted text-uppercase">Feb 10</span>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End Step Item -->
|
|
</ul>
|
|
<!-- End Step -->
|
|
|
|
<div class="d-grid">
|
|
<a class="btn btn-white" href="javascript:;">View all <i class="bi-chevron-right"></i></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Activity -->
|
|
|
|
<!-- Welcome Message Modal -->
|
|
<div class="modal fade" id="welcomeMessageModal" tabindex="-1" aria-hidden="true">
|
|
<div class="modal-dialog modal-dialog-centered">
|
|
<div class="modal-content">
|
|
<!-- Header -->
|
|
<div class="modal-close">
|
|
<button type="button" class="btn btn-ghost-secondary btn-icon btn-sm" data-bs-dismiss="modal" aria-label="Close">
|
|
<i class="bi-x-lg"></i>
|
|
</button>
|
|
</div>
|
|
<!-- End Header -->
|
|
|
|
<!-- Body -->
|
|
<div class="modal-body p-sm-5">
|
|
<div class="text-center">
|
|
<div class="w-75 w-sm-50 mx-auto mb-4">
|
|
<img class="img-fluid" src="./assets/svg/illustrations/oc-collaboration.svg" alt="Image Description" data-hs-theme-appearance="default">
|
|
<img class="img-fluid" src="./assets/svg/illustrations-light/oc-collaboration.svg" alt="Image Description" data-hs-theme-appearance="dark">
|
|
</div>
|
|
|
|
<h4 class="h1">Welcome to Front</h4>
|
|
|
|
<p>We're happy to see you in our community.</p>
|
|
</div>
|
|
</div>
|
|
<!-- End Body -->
|
|
|
|
<!-- Footer -->
|
|
<div class="modal-footer d-block text-center py-sm-5">
|
|
<small class="text-cap text-muted">Trusted by the world's best teams</small>
|
|
|
|
<div class="w-85 mx-auto">
|
|
<div class="row justify-content-between">
|
|
<div class="col">
|
|
<img class="img-fluid" src="./assets/svg/brands/gitlab-gray.svg" alt="Image Description">
|
|
</div>
|
|
<div class="col">
|
|
<img class="img-fluid" src="./assets/svg/brands/fitbit-gray.svg" alt="Image Description">
|
|
</div>
|
|
<div class="col">
|
|
<img class="img-fluid" src="./assets/svg/brands/flow-xo-gray.svg" alt="Image Description">
|
|
</div>
|
|
<div class="col">
|
|
<img class="img-fluid" src="./assets/svg/brands/layar-gray.svg" alt="Image Description">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Footer -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- End Welcome Message Modal -->
|
|
|
|
<!-- Share with people Modal -->
|
|
<div class="modal fade" id="shareWithPeopleModal" tabindex="-1" aria-labelledby="shareWithPeopleModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog modal-dialog-centered">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="shareWithPeopleModalLabel">Invite users</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
|
|
<!-- Body -->
|
|
<div class="modal-body">
|
|
<!-- Form -->
|
|
<div class="mb-4">
|
|
<div class="input-group mb-2 mb-sm-0">
|
|
<input type="text" class="form-control" name="fullName" placeholder="Search name or emails" aria-label="Search name or emails">
|
|
|
|
<div class="input-group-append input-group-append-last-sm-down-none">
|
|
<!-- Select -->
|
|
<div class="tom-select-custom tom-select-custom-end">
|
|
<select class="js-select form-select tom-select-custom-form-select-invite-user" autocomplete="off"
|
|
data-hs-tom-select-options='{
|
|
"searchInDropdown": false,
|
|
"hideSearch": true,
|
|
"dropdownWidth": "11rem"
|
|
}'>
|
|
<option value="guest" selected>Guest</option>
|
|
<option value="can edit">Can edit</option>
|
|
<option value="can comment">Can comment</option>
|
|
<option value="full access">Full access</option>
|
|
</select>
|
|
</div>
|
|
<!-- End Select -->
|
|
|
|
<a class="btn btn-primary d-none d-sm-inline-block" href="javascript:;">Invite</a>
|
|
</div>
|
|
</div>
|
|
|
|
<a class="btn btn-primary w-100 d-sm-none" href="javascript:;">Invite</a>
|
|
</div>
|
|
<!-- End Form -->
|
|
|
|
<!-- List Group -->
|
|
<ul class="list-unstyled list-py-2">
|
|
<!-- Item -->
|
|
<li>
|
|
<div class="d-flex">
|
|
<div class="flex-shrink-0">
|
|
<span class="icon icon-soft-dark icon-sm icon-circle">
|
|
<i class="bi-people-fill"></i>
|
|
</span>
|
|
</div>
|
|
|
|
<div class="flex-grow-1 ms-3">
|
|
<div class="row align-items-center">
|
|
<div class="col-sm">
|
|
<h5 class="text-body mb-0">#digitalmarketing</h5>
|
|
<span class="d-block fs-6">8 members</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-sm-auto">
|
|
<!-- Select -->
|
|
<div class="tom-select-custom tom-select-custom-sm-end">
|
|
<select class="js-select form-select form-select-borderless tom-select-custom-form-select-invite-user tom-select-form-select-ps-0" autocomplete="off"
|
|
data-hs-tom-select-options='{
|
|
"searchInDropdown": false,
|
|
"hideSearch": true,
|
|
"dropdownWidth": "11rem"
|
|
}'>
|
|
<option value="guest">Guest</option>
|
|
<option value="can edit" selected>Can edit</option>
|
|
<option value="can comment">Can comment</option>
|
|
<option value="full access">Full access</option>
|
|
<option value="remove" data-option-template='<div class="text-danger">Remove</div>'>Remove</option>
|
|
</select>
|
|
</div>
|
|
<!-- End Select -->
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<div class="d-flex">
|
|
<div class="flex-shrink-0">
|
|
<div class="avatar avatar-sm avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img3.jpg" alt="Image Description">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex-grow-1 ms-3">
|
|
<div class="row align-items-center">
|
|
<div class="col-sm">
|
|
<h5 class="text-body mb-0">David Harrison</h5>
|
|
<span class="d-block fs-6">david@site.com</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-sm-auto">
|
|
<!-- Select -->
|
|
<div class="tom-select-custom tom-select-custom-sm-end">
|
|
<select class="js-select form-select form-select-borderless tom-select-custom-form-select-invite-user tom-select-form-select-ps-0" autocomplete="off"
|
|
data-hs-tom-select-options='{
|
|
"searchInDropdown": false,
|
|
"hideSearch": true,
|
|
"dropdownWidth": "11rem"
|
|
}'>
|
|
<option value="guest">Guest</option>
|
|
<option value="can edit" selected>Can edit</option>
|
|
<option value="can comment">Can comment</option>
|
|
<option value="full access">Full access</option>
|
|
<option value="remove" data-option-template='<div class="text-danger">Remove</div>'>Remove</option>
|
|
</select>
|
|
</div>
|
|
<!-- End Select -->
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<div class="d-flex">
|
|
<div class="flex-shrink-0">
|
|
<div class="avatar avatar-sm avatar-circle">
|
|
<img class="avatar-img" src="./assets/img/160x160/img9.jpg" alt="Image Description">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex-grow-1 ms-3">
|
|
<div class="row align-items-center">
|
|
<div class="col-sm">
|
|
<h5 class="text-body mb-0">Ella Lauda <i class="bi-patch-check-fill text-primary" data-bs-toggle="tooltip" data-bs-placement="top" title="Top endorsed"></i></h5>
|
|
<span class="d-block fs-6">Markvt@site.com</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-sm-auto">
|
|
<!-- Select -->
|
|
<div class="tom-select-custom tom-select-custom-sm-end">
|
|
<select class="js-select form-select form-select-borderless tom-select-custom-form-select-invite-user tom-select-form-select-ps-0" autocomplete="off"
|
|
data-hs-tom-select-options='{
|
|
"searchInDropdown": false,
|
|
"hideSearch": true,
|
|
"dropdownWidth": "11rem"
|
|
}'>
|
|
<option value="guest">Guest</option>
|
|
<option value="can edit" selected>Can edit</option>
|
|
<option value="can comment">Can comment</option>
|
|
<option value="full access">Full access</option>
|
|
<option value="remove" data-option-template='<div class="text-danger">Remove</div>'>Remove</option>
|
|
</select>
|
|
</div>
|
|
<!-- End Select -->
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<div class="d-flex">
|
|
<div class="flex-shrink-0">
|
|
<span class="icon icon-soft-dark icon-sm icon-circle">
|
|
<i class="bi-people-fill"></i>
|
|
</span>
|
|
</div>
|
|
|
|
<div class="flex-grow-1 ms-3">
|
|
<div class="row align-items-center">
|
|
<div class="col-sm">
|
|
<h5 class="text-body mb-0">#conference</h5>
|
|
<span class="d-block fs-6">3 members</span>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-sm-auto">
|
|
<!-- Select -->
|
|
<div class="tom-select-custom tom-select-custom-sm-end">
|
|
<select class="js-select form-select form-select-borderless tom-select-custom-form-select-invite-user tom-select-form-select-ps-0" autocomplete="off"
|
|
data-hs-tom-select-options='{
|
|
"searchInDropdown": false,
|
|
"hideSearch": true,
|
|
"dropdownWidth": "11rem"
|
|
}'>
|
|
<option value="guest">Guest</option>
|
|
<option value="can edit" selected>Can edit</option>
|
|
<option value="can comment">Can comment</option>
|
|
<option value="full access">Full access</option>
|
|
<option value="remove" data-option-template='<div class="text-danger">Remove</div>'>Remove</option>
|
|
</select>
|
|
</div>
|
|
<!-- End Select -->
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End Item -->
|
|
</ul>
|
|
<!-- End List Group -->
|
|
|
|
<!-- Form Switch -->
|
|
<label class="row form-check form-switch" for="addTeamPreferencesNewProjectSwitch1">
|
|
<span class="col-8 col-sm-9 ms-0">
|
|
<i class="bi-bell text-primary me-2"></i>
|
|
<span class="text-dark">Inform all project members</span>
|
|
</span>
|
|
<span class="col-4 col-sm-3 text-end">
|
|
<input type="checkbox" class="form-check-input" id="addTeamPreferencesNewProjectSwitch1" checked>
|
|
</span>
|
|
</label>
|
|
<!-- End Form Switch -->
|
|
</div>
|
|
<!-- End Body -->
|
|
|
|
<!-- Footer -->
|
|
<div class="modal-footer">
|
|
<div class="row align-items-center flex-grow-1 mx-n2">
|
|
<div class="col-sm-9 mb-2 mb-sm-0">
|
|
<input type="hidden" id="publicShareLinkClipboard" value="https://themes.getbootstrap.com/product/front-multipurpose-responsive-template/">
|
|
|
|
<p class="modal-footer-text">The public share <a class="link" href="#">link settings</a>
|
|
<i class="bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="The public share link allows people to view the project without giving access to full collaboration features."></i>
|
|
</p>
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-sm-3 text-sm-end">
|
|
<a class="js-clipboard btn btn-white btn-sm text-nowrap" href="javascript:;" data-bs-toggle="tooltip" data-bs-placement="top" title="Copy to clipboard!"
|
|
data-hs-clipboard-options='{
|
|
"type": "tooltip",
|
|
"successText": "Copied!",
|
|
"contentTarget": "#publicShareLinkClipboard",
|
|
"container": "#shareWithPeopleModal"
|
|
}'>
|
|
<i class="bi-link me-1"></i> Copy link</a>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
<!-- End Footer -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Share with people Modal -->
|
|
<!-- ========== END SECONDARY CONTENTS ========== -->
|
|
|
|
<!-- JS Global Compulsory hs-builder:build-delete -->
|
|
<script src="./node_modules/jquery/dist/jquery.min.js"></script>
|
|
<script src="./node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
|
|
<script src="./node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
|
|
|
|
<!-- JS Implementing Plugins -->
|
|
<!-- bundlejs:vendor [.] -->
|
|
<script src="./assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
|
|
<script src="./assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script>
|
|
|
|
<script src="./node_modules/tom-select/dist/js/tom-select.complete.min.js"></script>
|
|
<script src="./assets/vendor/hs-add-field/dist/hs-add-field.js"></script>
|
|
<script src="./node_modules/sortablejs/Sortable.min.js"></script>
|
|
<script src="./node_modules/daterangepicker/moment.min.js"></script>
|
|
<script src="./node_modules/daterangepicker/daterangepicker.js"></script>
|
|
<script src="./node_modules/clipboard/dist/clipboard.min.js"></script>
|
|
|
|
<!-- JS Front -->
|
|
<!-- bundlejs:theme [.] -->
|
|
<script src="./assets/js/hs.core.js"></script>
|
|
<script src="./assets/js/hs.bs-dropdown.js"></script>
|
|
<script src="./assets/js/hs.tom-select.js"></script>
|
|
<script src="./assets/js/hs.sortable.js"></script>
|
|
<script src="./assets/js/hs.clipboard.js"></script>
|
|
|
|
|
|
<!-- JS Plugins Init. -->
|
|
<script>
|
|
$(document).on('ready', function () {
|
|
// INITIALIZATION OF DATERANGEPICKER
|
|
// =======================================================
|
|
$('.js-daterangepicker').daterangepicker();
|
|
|
|
$('.js-daterangepicker-times').daterangepicker({
|
|
timePicker: true,
|
|
startDate: moment().startOf('hour'),
|
|
endDate: moment().startOf('hour').add(32, 'hour'),
|
|
locale: {
|
|
format: 'M/DD hh:mm A'
|
|
}
|
|
});
|
|
|
|
var start = moment();
|
|
var end = moment();
|
|
|
|
function cb(start, end) {
|
|
$('#js-daterangepicker-predefined .js-daterangepicker-predefined-preview').html(start.format('MMM D') + ' - ' + end.format('MMM D, YYYY'));
|
|
}
|
|
|
|
$('#js-daterangepicker-predefined').daterangepicker({
|
|
startDate: start,
|
|
endDate: end,
|
|
ranges: {
|
|
'Today': [moment(), moment()],
|
|
'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
|
|
'Last 7 Days': [moment().subtract(6, 'days'), moment()],
|
|
'Last 30 Days': [moment().subtract(29, 'days'), moment()],
|
|
'This Month': [moment().startOf('month'), moment().endOf('month')],
|
|
'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
|
|
}
|
|
}, cb);
|
|
|
|
cb(start, end);
|
|
});
|
|
</script>
|
|
|
|
|
|
<!-- JS Plugins Init. -->
|
|
<script>
|
|
(function() {
|
|
window.onload = function () {
|
|
|
|
|
|
// INITIALIZATION OF NAVBAR VERTICAL ASIDE
|
|
// =======================================================
|
|
new HSSideNav('.js-navbar-vertical-aside').init()
|
|
|
|
|
|
// INITIALIZATION OF FORM SEARCH
|
|
// =======================================================
|
|
new HSFormSearch('.js-form-search')
|
|
|
|
|
|
// INITIALIZATION OF BOOTSTRAP DROPDOWN
|
|
// =======================================================
|
|
HSBsDropdown.init()
|
|
|
|
|
|
// INITIALIZATION OF ADD FIELD
|
|
// =======================================================
|
|
new HSAddField('.js-add-field')
|
|
|
|
|
|
// INITIALIZATION OF SELECT
|
|
// =======================================================
|
|
HSCore.components.HSTomSelect.init('.js-select')
|
|
|
|
|
|
// INITIALIZATION OF CLIPBOARD
|
|
// =======================================================
|
|
HSCore.components.HSClipboard.init('.js-clipboard')
|
|
|
|
|
|
// INITIALIZATION OF SORTABLEJS
|
|
// =======================================================
|
|
HSCore.components.HSSortable.init('.js-sortable', {
|
|
forceFallback: true,
|
|
animation: 0,
|
|
group: 'listGroup',
|
|
delay: 500,
|
|
delayOnTouchOnly: true
|
|
});
|
|
}
|
|
})()
|
|
</script>
|
|
|
|
<!-- Style Switcher JS -->
|
|
|
|
<script>
|
|
(function () {
|
|
// STYLE SWITCHER
|
|
// =======================================================
|
|
const $dropdownBtn = document.getElementById('selectThemeDropdown') // Dropdowon trigger
|
|
const $variants = document.querySelectorAll(`[aria-labelledby="selectThemeDropdown"] [data-icon]`) // All items of the dropdown
|
|
|
|
// Function to set active style in the dorpdown menu and set icon for dropdown trigger
|
|
const setActiveStyle = function () {
|
|
$variants.forEach($item => {
|
|
if ($item.getAttribute('data-value') === HSThemeAppearance.getOriginalAppearance()) {
|
|
$dropdownBtn.innerHTML = `<i class="${$item.getAttribute('data-icon')}" />`
|
|
return $item.classList.add('active')
|
|
}
|
|
|
|
$item.classList.remove('active')
|
|
})
|
|
}
|
|
|
|
// Add a click event to all items of the dropdown to set the style
|
|
$variants.forEach(function ($item) {
|
|
$item.addEventListener('click', function () {
|
|
HSThemeAppearance.setAppearance($item.getAttribute('data-value'))
|
|
})
|
|
})
|
|
|
|
// Call the setActiveStyle on load page
|
|
setActiveStyle()
|
|
|
|
// Add event listener on change style to call the setActiveStyle function
|
|
window.addEventListener('on-hs-appearance-change', function () {
|
|
setActiveStyle()
|
|
})
|
|
})()
|
|
</script>
|
|
|
|
<!-- End Style Switcher JS -->
|
|
</body>
|
|
</html>
|