2191 lines
98 KiB
HTML
2191 lines
98 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="pl" class="magico-h-100">
|
|
<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>Helpdesk - Dashboard</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">
|
|
|
|
<!-- 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 src="https://company.magico.pro/assets/public/js/magico-toolbar.min.js?v=1" defer></script>
|
|
|
|
<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 magico-h-100">
|
|
|
|
<script src="./assets/js/hs.theme-appearance.js"></script>
|
|
|
|
|
|
|
|
|
|
<magico-toolbar>
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="187.398" height="28" viewBox="0 0 187.398 32.101">
|
|
<g id="Group_11" data-name="Group 11" transform="translate(-1534.01 -276.095)">
|
|
<path id="Path_26" data-name="Path 26" d="M10.139-8.657a3.478,3.478,0,0,0-1.061-2.611A3.567,3.567,0,0,0,6.5-12.295a3.508,3.508,0,0,0-2.577,1.061A3.508,3.508,0,0,0,2.863-8.657V0H1.011V-22.905H2.863v10.139A5.292,5.292,0,0,1,6.5-14.147a5.309,5.309,0,0,1,3.907,1.583,5.309,5.309,0,0,1,1.583,3.907V0H10.139ZM25.566-4.345l1.617.909A7.17,7.17,0,0,1,24.556-.657,7.041,7.041,0,0,1,20.783.4a7,7,0,0,1-5.12-2.156,7,7,0,0,1-2.156-5.12,6.961,6.961,0,0,1,2.156-5.154,7.05,7.05,0,0,1,5.12-2.122,7.105,7.105,0,0,1,3.554.943,7.08,7.08,0,0,1,2.577,2.392l-9.4,8.286a5.243,5.243,0,0,0,3.267,1.078A5.273,5.273,0,0,0,23.6-2.223,5.361,5.361,0,0,0,25.566-4.345Zm-9.3.505,8.051-7.141a5.233,5.233,0,0,0-3.537-1.314,5.242,5.242,0,0,0-3.857,1.566A5.242,5.242,0,0,0,15.36-6.872,5.4,5.4,0,0,0,16.269-3.84ZM28.733,0V-22.905h1.853V0ZM39.882.4a7.014,7.014,0,0,1-5.423-2.425V9.162H32.606V-13.777l2.021,1.886a7.061,7.061,0,0,1,5.255-2.257,7.017,7.017,0,0,1,5.154,2.122,7.017,7.017,0,0,1,2.122,5.154,7.05,7.05,0,0,1-2.122,5.12A6.961,6.961,0,0,1,39.882.4Zm0-1.853a5.242,5.242,0,0,0,3.857-1.566,5.242,5.242,0,0,0,1.566-3.857,5.242,5.242,0,0,0-1.566-3.857,5.242,5.242,0,0,0-3.857-1.566,5.229,5.229,0,0,0-3.84,1.583,5.229,5.229,0,0,0-1.583,3.84,5.229,5.229,0,0,0,1.583,3.84A5.229,5.229,0,0,0,39.882-1.448Zm15.562-12.7a7.014,7.014,0,0,1,5.423,2.425V-22.905H62.72V0L60.7-1.853A7.061,7.061,0,0,1,55.444.4a7,7,0,0,1-5.12-2.156,7,7,0,0,1-2.156-5.12,6.961,6.961,0,0,1,2.156-5.154A7.05,7.05,0,0,1,55.444-14.147Zm0,1.853a5.242,5.242,0,0,0-3.857,1.566,5.242,5.242,0,0,0-1.566,3.857,5.242,5.242,0,0,0,1.566,3.857,5.242,5.242,0,0,0,3.857,1.566,5.229,5.229,0,0,0,3.84-1.583,5.229,5.229,0,0,0,1.583-3.84,5.229,5.229,0,0,0-1.583-3.84A5.229,5.229,0,0,0,55.444-12.295ZM76.295-4.345l1.617.909A7.17,7.17,0,0,1,75.284-.657,7.041,7.041,0,0,1,71.512.4a7,7,0,0,1-5.12-2.156,7,7,0,0,1-2.156-5.12,6.961,6.961,0,0,1,2.156-5.154,7.05,7.05,0,0,1,5.12-2.122,7.105,7.105,0,0,1,3.554.943,7.08,7.08,0,0,1,2.577,2.392l-9.4,8.286a5.243,5.243,0,0,0,3.267,1.078,5.273,5.273,0,0,0,2.813-.775A5.361,5.361,0,0,0,76.295-4.345ZM67-3.84l8.051-7.141a5.233,5.233,0,0,0-3.537-1.314,5.242,5.242,0,0,0-3.857,1.566,5.242,5.242,0,0,0-1.566,3.857A5.4,5.4,0,0,0,67-3.84Zm13.575.909A2.3,2.3,0,0,0,82.8-1.583a2.379,2.379,0,0,0,1.752-.707,2.379,2.379,0,0,0,.707-1.752,2.447,2.447,0,0,0-.488-1.5A2.238,2.238,0,0,0,83.537-6.4L81.92-6.872A3.805,3.805,0,0,1,79.966-8.2a3.463,3.463,0,0,1-.741-2.173,3.508,3.508,0,0,1,1.061-2.577,3.508,3.508,0,0,1,2.577-1.061,3.59,3.59,0,0,1,2,.606A3.4,3.4,0,0,1,86.2-11.789l-1.684.707a1.6,1.6,0,0,0-1.651-1.078,1.679,1.679,0,0,0-1.28.539,1.768,1.768,0,0,0-.505,1.246,1.633,1.633,0,0,0,1.314,1.718l1.617.472a4.032,4.032,0,0,1,2.24,1.516,4.263,4.263,0,0,1,.859,2.627,4.248,4.248,0,0,1-.573,2.189A4.271,4.271,0,0,1,84.985-.3,4.248,4.248,0,0,1,82.8.269a4.154,4.154,0,0,1-2.223-.623,4.618,4.618,0,0,1-1.617-1.7ZM97.549,0H95.293L90.476-6.905V0H88.623V-22.905h1.853V-7.377l3.941-6.4h2.189l-4.076,6.6Z" transform="translate(1533 299)" fill="#209ed1"/>
|
|
<path id="Path_25" data-name="Path 25" d="M1.011-1.853H2.863V0H1.011ZM24.455,0H22.6V-8.792a3.29,3.29,0,0,0-1.044-2.543,3.514,3.514,0,0,0-2.459-.96,3.533,3.533,0,0,0-2.442.96A3.264,3.264,0,0,0,15.6-8.792V0H13.743V-8.792A3.29,3.29,0,0,0,12.7-11.335a3.514,3.514,0,0,0-2.459-.96,3.533,3.533,0,0,0-2.442.96A3.264,3.264,0,0,0,6.737-8.792V0H4.884V-13.777l1.549,1.213a5.19,5.19,0,0,1,3.806-1.583,5.409,5.409,0,0,1,2.56.64,4.92,4.92,0,0,1,1.886,1.684A5.1,5.1,0,0,1,19.1-14.147a5.1,5.1,0,0,1,2.139.438,5.585,5.585,0,0,1,1.651,1.128,5.585,5.585,0,0,1,1.128,1.651,5.1,5.1,0,0,1,.438,2.139ZM38.5-1.853A7.061,7.061,0,0,1,33.246.4a7,7,0,0,1-5.12-2.156,7,7,0,0,1-2.156-5.12,6.961,6.961,0,0,1,2.156-5.154,7.05,7.05,0,0,1,5.12-2.122A7.061,7.061,0,0,1,38.5-11.891l2.021-1.886V0ZM33.246-12.295a5.242,5.242,0,0,0-3.857,1.566,5.242,5.242,0,0,0-1.566,3.857,5.242,5.242,0,0,0,1.566,3.857,5.242,5.242,0,0,0,3.857,1.566,5.229,5.229,0,0,0,3.84-1.583,5.229,5.229,0,0,0,1.583-3.84,5.229,5.229,0,0,0-1.583-3.84A5.229,5.229,0,0,0,33.246-12.295ZM44.7,5.154a5.258,5.258,0,0,0,4.48,2.189A5.469,5.469,0,0,0,53.1,5.777a5.29,5.29,0,0,0,1.634-3.992V-2.021A7.014,7.014,0,0,1,49.314.4a7,7,0,0,1-5.12-2.156,7,7,0,0,1-2.156-5.12,6.961,6.961,0,0,1,2.156-5.154,7.05,7.05,0,0,1,5.12-2.122,7.061,7.061,0,0,1,5.255,2.257l2.021-1.886V1.785A7.1,7.1,0,0,1,54.4,7.04,7.183,7.183,0,0,1,49.179,9.2a7.123,7.123,0,0,1-5.895-2.9Zm4.615-17.448a5.242,5.242,0,0,0-3.857,1.566,5.242,5.242,0,0,0-1.566,3.857,5.242,5.242,0,0,0,1.566,3.857,5.242,5.242,0,0,0,3.857,1.566,5.229,5.229,0,0,0,3.84-1.583,5.229,5.229,0,0,0,1.583-3.84,5.229,5.229,0,0,0-1.583-3.84A5.229,5.229,0,0,0,49.314-12.295Zm9.3-1.482h1.853V0H58.611Zm0-5.389h1.853v2.021H58.611ZM74.846-11.52,73.4-10.375a5.236,5.236,0,0,0-4.143-1.92A5.242,5.242,0,0,0,65.4-10.728a5.242,5.242,0,0,0-1.566,3.857A5.242,5.242,0,0,0,65.4-3.015a5.242,5.242,0,0,0,3.857,1.566A5.12,5.12,0,0,0,73.3-3.267l1.482,1.145A7.239,7.239,0,0,1,72.32-.253,7.189,7.189,0,0,1,69.255.4a7,7,0,0,1-5.12-2.156,7,7,0,0,1-2.156-5.12,6.961,6.961,0,0,1,2.156-5.154,7.05,7.05,0,0,1,5.12-2.122,7.193,7.193,0,0,1,3.133.674A7.08,7.08,0,0,1,74.846-11.52Zm8.286-2.627a7.017,7.017,0,0,1,5.154,2.122,7.017,7.017,0,0,1,2.122,5.154,7.05,7.05,0,0,1-2.122,5.12A6.961,6.961,0,0,1,83.133.4a7,7,0,0,1-5.12-2.156,7,7,0,0,1-2.156-5.12,6.961,6.961,0,0,1,2.156-5.154A7.05,7.05,0,0,1,83.133-14.147Zm0,1.853a5.242,5.242,0,0,0-3.857,1.566,5.242,5.242,0,0,0-1.566,3.857,5.242,5.242,0,0,0,1.566,3.857,5.242,5.242,0,0,0,3.857,1.566,5.229,5.229,0,0,0,3.84-1.583,5.229,5.229,0,0,0,1.583-3.84,5.229,5.229,0,0,0-1.583-3.84A5.229,5.229,0,0,0,83.133-12.295Z" transform="translate(1631 299)" fill="#615d5c"/>
|
|
</g>
|
|
</svg>
|
|
|
|
</magico-toolbar>
|
|
|
|
|
|
<div class="magico-czary-mary-do-ogarniecia">
|
|
<button type="button" class="js-navbar-vertical-aside-toggle-invoker navbar-aside-toggler" style="opacity: 1;">
|
|
<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="" data-bs-original-title="Collapse" aria-label="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="" data-bs-original-title="Expand" aria-label="Expand"></i>
|
|
</button>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- ========== MAIN CONTENT ========== -->
|
|
<main id="content" role="main" class="main magico-main-height" style="border-top: 1px solid rgba(231, 234, 243, 0.7); ">
|
|
<!-- Navbar Vertical -->
|
|
<aside class="magico-navbar 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">
|
|
|
|
<!-- 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 active" href="#navbarVerticalMenuDashboards" role="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalMenuDashboards" aria-expanded="true" aria-controls="navbarVerticalMenuDashboards">
|
|
<i class="bi-house-door nav-icon"></i>
|
|
<span class="nav-link-title">Kokpit</span>
|
|
</a>
|
|
|
|
<div id="navbarVerticalMenuDashboards" class="nav-collapse collapse show" data-bs-parent="#navbarVerticalMenu">
|
|
<a class="nav-link active" href="./magico-helpdesk-dashboard.html">Konsultant</a>
|
|
<a class="nav-link " href="./dashboard-alternative.html">Manager</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
|
|
<span class="dropdown-header mt-4">KONFIGURACJA</span>
|
|
<small class="bi-three-dots nav-subtitle-replacer"></small>
|
|
|
|
<div class="nav-item">
|
|
<a class="nav-link " href="./api-keys.html" data-placement="left">
|
|
<i class="bi-building nav-icon"></i>
|
|
<span class="nav-link-title">Grupy telefonów</span>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="nav-item">
|
|
<a class="nav-link " href="./api-keys.html" data-placement="left">
|
|
<i class="bi-phone nav-icon"></i>
|
|
<span class="nav-link-title">Urządzenia</span>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="nav-item">
|
|
<a class="nav-link " href="./api-keys.html" data-placement="left">
|
|
<i class="bi-chat-square-dots nav-icon"></i>
|
|
<span class="nav-link-title">Szablony SMS</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>
|
|
</ul>
|
|
</div>
|
|
<!-- End Footer -->
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
|
|
<!-- End Navbar Vertical -->
|
|
|
|
<!-- Content -->
|
|
<div class="content container magico-h-100">
|
|
<!-- Page Header -->
|
|
<div class="page-header">
|
|
<div class="row align-items-end">
|
|
<div class="col-sm mb-2 mb-sm-0 ">
|
|
<div class="d-flex align-items-center">
|
|
<h1 class="page-header-title">Kokpit konsultanta</h1>
|
|
<span class="badge bg-soft-dark text-dark ms-2">Marketing</span> <!-- Grupy telefonów -->
|
|
</div>
|
|
|
|
<div class="row align-items-center"> <!-- BOX dla Managera i właściciela, pozwala przełączyć się na kokpit konsultanta jednego z pracowników i podejrzeć jego prace -->
|
|
<div class="col-auto">
|
|
<!-- Select -->
|
|
<div class="tom-select-custom">
|
|
<select class="js-select form-select form-select-sm form-select-borderless tom-select-form-select-ps-0" id="ownerLabel" autocomplete="on"
|
|
data-hs-tom-select-options='{
|
|
"searchInDropdown": true,
|
|
"hideSearch": false,
|
|
"dropdownWidth": "12rem"
|
|
}'>
|
|
<option value="owner1" selected data-option-template='<span class="d-flex align-items-center"><img class="avatar avatar-xss avatar-circle" src="./assets/img/160x160/img6.jpg" alt="Avatar" /><span class="flex-grow-1 ms-2">Mark Williams</span></span>'>Mark Williams</option>
|
|
<option value="owner2" data-option-template='<span class="d-flex align-items-center"><img class="avatar avatar-xss avatar-circle" src="./assets/img/160x160/img10.jpg" alt="Avatar" /><span class="flex-grow-1 ms-2">Amanda Harvey</span></span>'>Amanda Harvey</option>
|
|
<option value="owner3" data-option-template='<span class="d-flex align-items-center"><i class="bi-person text-body"></i><span class="flex-grow-1 ms-2">Assign to owner</span></span>'>Assign to owner</option>
|
|
</select>
|
|
</div>
|
|
<!-- End Select -->
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
<!-- End Col -->
|
|
|
|
<div class="col-sm-auto">
|
|
<a class="btn btn-ghost-primary" href="javascript:;" data-bs-toggle="modal" data-bs-target="#qrModal">
|
|
Połączone: 1
|
|
</a>
|
|
<a class="btn btn-primary" href="javascript:;" data-bs-toggle="modal" data-bs-target="#qrModal">
|
|
<i class="bi-telephone-plus-fill me-1"></i> Połącz telefon
|
|
</a>
|
|
</div>
|
|
<!-- End Col -->
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
<!-- End Page Header -->
|
|
|
|
<a href="#" href="javascript:;" data-bs-toggle="modal" data-bs-target="#numberModal" class="alert alert-soft-dark mb-4 mb-lg-5 d-block" role="alert">
|
|
<div class="d-flex align-items-center">
|
|
<div class="flex-shrink-0 d-none d-sm-block">
|
|
<img class="avatar avatar-xl" src="./assets/svg/illustrations/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="default">
|
|
<img class="avatar avatar-xl" src="./assets/svg/illustrations-light/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="dark">
|
|
</div>
|
|
|
|
<div class="flex-grow-1 ms-3">
|
|
<h3 class="alert-heading mb-1">Nowe połączenie!</h3>
|
|
<p class="mb-0">+48 541 524 865</p>
|
|
</div>
|
|
|
|
<div class="d-flex align-items-center">
|
|
<div class="spinner-grow text-success me-4" role="status">
|
|
<span class="visually-hidden">Loading...</span>
|
|
</div>
|
|
|
|
<button type="button" class="btn btn-white d-none d-sm-block">Zobacz szczegóły</button>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
|
|
<div class="row magico-scroll" style="overflow-y: auto;">
|
|
<div class="col-12 col-sm-4 mh-100">
|
|
<!-- Card -->
|
|
<div class="card mh-100">
|
|
<!-- Header -->
|
|
<div class="card-header card-header-content-between">
|
|
<h4 class="card-header-title">Połączenia w kolejce</h4>
|
|
</div>
|
|
<!-- End Header -->
|
|
|
|
<!-- Body -->
|
|
<div class="card-body magico-scroll overflow-auto">
|
|
<ul class="list-unstyled list-py-3 mb-0 list-group-start-bordered">
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center list-group-item-action border-danger" href="#">
|
|
<div class="d-flex align-items-center me-2" >
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">+48 457 854 451</h5>
|
|
<span class="fs-6 text-body">14 minut temu</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body">Jan Kowalski</span>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center list-group-item-action border-warning" href="#">
|
|
<div class="d-flex align-items-center me-2" >
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">+48 457 854 451</h5>
|
|
<span class="fs-6 text-body">14 minut temu</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body">Jan Kowalski</span>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center list-group-item-action border-success" href="#">
|
|
<div class="d-flex align-items-center me-2" >
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">+48 457 854 451</h5>
|
|
<span class="fs-6 text-body">14 minut temu</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body">Jan Kowalski</span>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center list-group-item-action" href="#">
|
|
<div class="d-flex align-items-center me-2" >
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">+48 457 854 451</h5>
|
|
<span class="fs-6 text-body">14 minut temu</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body">Jan Kowalski</span>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center list-group-item-action" href="#">
|
|
<div class="d-flex align-items-center me-2" >
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">+48 457 854 451</h5>
|
|
<span class="fs-6 text-body">dziś, 7:40</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body">Jan Kowalski</span>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
</ul>
|
|
</div>
|
|
<!-- End Body -->
|
|
</div>
|
|
<!-- End Card -->
|
|
</div>
|
|
<div class="col-12 col-sm-4 mh-100">
|
|
<!-- Card -->
|
|
<div class="card mh-100">
|
|
<!-- Header -->
|
|
<div class="card-header card-header-content-between">
|
|
<h4 class="card-header-title">Zaplanowane</h4>
|
|
</div>
|
|
<!-- End Header -->
|
|
|
|
<!-- Body -->
|
|
<div class="card-body magico-scroll overflow-auto">
|
|
<ul class="list-unstyled list-py-3 mb-0 list-group-start-bordered">
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center list-group-item-action border-danger" href="#">
|
|
<div class="d-flex align-items-center me-2" >
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">+48 457 854 451</h5>
|
|
<span class="fs-6 text-body">30 minut temu</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body">Jan Kowalski</span>
|
|
</div>
|
|
<div class="text-danger fs-1 ms-3"> <!-- Pokaż, jeśli termin minął -->
|
|
<i class="bi bi-exclamation-square"></i>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center list-group-item-action" href="#">
|
|
<div class="d-flex align-items-center me-2" >
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">+48 457 854 451</h5>
|
|
<span class="fs-6 text-body">za 2 godziny</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body">Jan Kowalski</span>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center list-group-item-action" href="#">
|
|
<div class="d-flex align-items-center me-2" >
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">+48 457 854 451</h5>
|
|
<span class="fs-6 text-body">dziś 15:40</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body">Jan Kowalski</span>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center list-group-item-action" href="#">
|
|
<div class="d-flex align-items-center me-2" >
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">+48 457 854 451</h5>
|
|
<span class="fs-6 text-body">dziś 15:40</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body">Jan Kowalski</span>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center list-group-item-action" href="#">
|
|
<div class="d-flex align-items-center me-2" >
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">+48 457 854 451</h5>
|
|
<span class="fs-6 text-body">dziś 18:40</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body">Jan Kowalski</span>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
</ul>
|
|
</div>
|
|
<!-- End Body -->
|
|
</div>
|
|
<!-- End Card -->
|
|
</div>
|
|
<div class="col-12 col-sm-4 mh-100">
|
|
<!-- Card -->
|
|
<div class="card mh-100">
|
|
<!-- Header -->
|
|
<div class="card-header card-header-content-between">
|
|
<h4 class="card-header-title">Historia połączeń</h4>
|
|
</div>
|
|
<!-- End Header -->
|
|
|
|
<!-- Body -->
|
|
<div class="card-body magico-scroll overflow-auto">
|
|
<ul class="list-unstyled list-py-3 mb-0 ">
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center " href="#">
|
|
<div class="fs-2 text-danger">
|
|
<i class="bi bi-telephone-x"></i>
|
|
</div>
|
|
<div class="d-flex align-items-center me-2" >
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
|
|
<span class="fs-6 text-body">dziś 7:40</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body"></span>
|
|
</div>
|
|
<div class="ms-3">
|
|
<div class="avatar avatar-sm avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Ania Skrzypaczkiewicz">
|
|
<img class="avatar-img" src="https://htmlstream.com/preview/front-dashboard-v2.0/assets/img/160x160/img10.jpg" alt="Image Description">
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center " href="#">
|
|
<div class="fs-2 text-primary">
|
|
<i class="bi bi-telephone-outbound"></i>
|
|
</div>
|
|
<div class="d-flex align-items-center me-2">
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
|
|
<span class="fs-6 text-body">dziś 7:40</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body"></span>
|
|
</div>
|
|
<div class="ms-3">
|
|
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
|
|
<span class="avatar-initials">BB</span>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center " href="#">
|
|
<div class="fs-2 text-secondary">
|
|
<i class="bi bi-telephone-inbound"></i>
|
|
</div>
|
|
<div class="d-flex align-items-center me-2">
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
|
|
<span class="fs-6 text-body">dziś 7:40</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body"></span>
|
|
</div>
|
|
<div class="ms-3">
|
|
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
|
|
<span class="avatar-initials">BB</span>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center " href="#">
|
|
<div class="fs-2 text-secondary">
|
|
<i class="bi bi-telephone-inbound"></i>
|
|
</div>
|
|
<div class="d-flex align-items-center me-2">
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
|
|
<span class="fs-6 text-body">dziś 7:40</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body"></span>
|
|
</div>
|
|
<div class="ms-3">
|
|
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
|
|
<span class="avatar-initials">BB</span>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center " href="#">
|
|
<div class="fs-2 text-secondary">
|
|
<i class="bi bi-telephone-inbound"></i>
|
|
</div>
|
|
<div class="d-flex align-items-center me-2">
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
|
|
<span class="fs-6 text-body">dziś 7:40</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body"></span>
|
|
</div>
|
|
<div class="ms-3">
|
|
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
|
|
<span class="avatar-initials">BB</span>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center " href="#">
|
|
<div class="fs-2 text-secondary">
|
|
<i class="bi bi-telephone-inbound"></i>
|
|
</div>
|
|
<div class="d-flex align-items-center me-2">
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
|
|
<span class="fs-6 text-body">dziś 7:40</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body"></span>
|
|
</div>
|
|
<div class="ms-3">
|
|
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
|
|
<span class="avatar-initials">BB</span>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center " href="#">
|
|
<div class="fs-2 text-secondary">
|
|
<i class="bi bi-telephone-inbound"></i>
|
|
</div>
|
|
<div class="d-flex align-items-center me-2">
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
|
|
<span class="fs-6 text-body">dziś 7:40</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body"></span>
|
|
</div>
|
|
<div class="ms-3">
|
|
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
|
|
<span class="avatar-initials">BB</span>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center " href="#">
|
|
<div class="fs-2 text-secondary">
|
|
<i class="bi bi-telephone-inbound"></i>
|
|
</div>
|
|
<div class="d-flex align-items-center me-2">
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
|
|
<span class="fs-6 text-body">dziś 7:40</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body"></span>
|
|
</div>
|
|
<div class="ms-3">
|
|
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
|
|
<span class="avatar-initials">BB</span>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
<!-- Item -->
|
|
<li>
|
|
<a class="d-flex align-items-center " href="#">
|
|
<div class="fs-2 text-secondary">
|
|
<i class="bi bi-telephone-inbound"></i>
|
|
</div>
|
|
<div class="d-flex align-items-center me-2">
|
|
<div class="flex-grow-1 ms-3">
|
|
<h5 class="text-hover-primary mb-0">Jan Kowalski +48 457 854 451</h5>
|
|
<span class="fs-6 text-body">dziś 7:40</span>
|
|
</div>
|
|
</div>
|
|
<div class="ms-auto">
|
|
<span class="fs-6 text-body"></span>
|
|
</div>
|
|
<div class="ms-3">
|
|
<div class="avatar avatar-sm avatar-soft-dark avatar-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Bartłomiej Banaczyk">
|
|
<span class="avatar-initials">BB</span>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<!-- End Item -->
|
|
|
|
|
|
|
|
</ul>
|
|
</div>
|
|
<!-- End Body -->
|
|
</div>
|
|
<!-- End Card -->
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
<!-- End 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 -->
|
|
<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 -->
|
|
|
|
<!-- Create a new user Modal -->
|
|
<div class="modal fade" id="inviteUserModal" tabindex="-1" aria-labelledby="inviteUserModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog modal-dialog-centered">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h4 class="modal-title" id="inviteUserModalLabel">Invite users</h4>
|
|
<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" 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 -->
|
|
|
|
<div class="row">
|
|
<h5 class="col modal-title">Invite users</h5>
|
|
|
|
<div class="col-auto">
|
|
<a class="d-flex align-items-center small text-body" href="#">
|
|
<img class="avatar avatar-xss avatar-4x3 me-2" src="./assets/svg/brands/gmail-icon.svg" alt="Image Description">
|
|
Import contacts
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<hr class="mt-2">
|
|
|
|
<ul class="list-unstyled list-py-2 mb-0">
|
|
<!-- List Group 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/img10.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="mb-0">Amanda Harvey <i class="bi-patch-check-fill text-primary" data-toggle="tooltip" data-placement="top" title="Top endorsed"></i></h5>
|
|
<span class="d-block small">amanda@site.com</span>
|
|
</div>
|
|
|
|
<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" selected>Guest</option>
|
|
<option value="can edit">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>
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End List Group Item -->
|
|
|
|
<!-- List Group 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="mb-0">David Harrison</h5>
|
|
<span class="d-block small">david@site.com</span>
|
|
</div>
|
|
|
|
<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" selected>Guest</option>
|
|
<option value="can edit">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>
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End List Group Item -->
|
|
|
|
<!-- List Group 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="mb-0">Ella Lauda <i class="bi-patch-check-fill text-primary" data-toggle="tooltip" data-placement="top" title="Top endorsed"></i></h5>
|
|
<span class="d-block small">Markvt@site.com</span>
|
|
</div>
|
|
|
|
<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" selected>Guest</option>
|
|
<option value="can edit">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>
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End List Group Item -->
|
|
|
|
<!-- List Group Item -->
|
|
<li>
|
|
<div class="d-flex">
|
|
<div class="flex-shrink-0">
|
|
<div class="avatar avatar-sm avatar-soft-dark avatar-circle">
|
|
<span class="avatar-initials">B</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex-grow-1 ms-3">
|
|
<div class="row align-items-center">
|
|
<div class="col-sm">
|
|
<h5 class="mb-0">Bob Dean</h5>
|
|
<span class="d-block small">bob@site.com</span>
|
|
</div>
|
|
|
|
<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" selected>Guest</option>
|
|
<option value="can edit">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>
|
|
</div>
|
|
<!-- End Row -->
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End List Group Item -->
|
|
</ul>
|
|
</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="inviteUserPublicClipboard" value="https://themes.getbootstrap.com/product/front-multipurpose-responsive-template/">
|
|
|
|
<p class="modal-footer-text">The public share <a 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>
|
|
|
|
<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": "#inviteUserPublicClipboard",
|
|
"container": "#inviteUserModal"
|
|
}'>
|
|
<i class="bi-link-45deg me-1"></i> Copy link</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Footer -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Create a new user Modal -->
|
|
<!-- ========== END SECONDARY CONTENTS ========== -->
|
|
|
|
<div class="modal fade" id="qrModal" tabindex="-1" aria-labelledby="inviteUserModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog modal-dialog-centered">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h4 class="modal-title" id="inviteUserModalLabel">Zeskanuj kod QR</h4>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
|
|
<!-- Body -->
|
|
<div class="modal-body">
|
|
|
|
<div class="text-center mb-3">
|
|
Uruchom aplikację Magico Call na Twoim telefonie i zeskanuj wyświetlony kod QR
|
|
</div>
|
|
|
|
<hr class="mt-2">
|
|
|
|
<div class="text-center">
|
|
<img width="300" src="https://www.qr-online.pl/bin/qr/976f637559dcebd7040a7ceb143cfb7c.png">
|
|
</div>
|
|
|
|
</div>
|
|
<!-- End Body -->
|
|
|
|
<!-- Footer -->
|
|
<div class="modal-footer">
|
|
<div class="row align-items-center flex-grow-1 mx-n2">
|
|
<div class="col-sm-8 mb-2 mb-sm-0">
|
|
<input type="hidden" id="inviteUserPublicClipboard" value="https://themes.getbootstrap.com/product/front-multipurpose-responsive-template/">
|
|
|
|
<p class="modal-footer-text">Lub wprowadź kod ręcznie: <strong>547 542</strong></a>
|
|
<i class="bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="Masz 60 sekund na wprowadzenie kodu parowania"></i>
|
|
</p>
|
|
</div>
|
|
|
|
<div class="col-sm-4 text-sm-end">
|
|
<a class="js-clipboard btn btn-white btn-sm text-nowrap" href="javascript:;" title="">
|
|
<i class="bi-link-45deg me-1"></i> Generuj nowy kod</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Footer -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal fade" id="numberModal" tabindex="-1" aria-labelledby="inviteUserModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog modal-xl modal-dialog-centered">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h4 class="modal-title" id="inviteUserModalLabel">Jan Kowalski +48 456 789 123</h4>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
|
|
<!-- Body -->
|
|
<div class="modal-body">
|
|
|
|
<div class="row mb-5">
|
|
<div class="col-12 col-md-6">
|
|
<button type="button" class="btn btn-primary">Zadzwoń</button>
|
|
</div>
|
|
<div class="col-12 col-md-6 text-end">
|
|
<button type="button" class="btn btn-soft-primary" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Skomentuj">
|
|
<i class="bi bi-chat-left-text"></i>
|
|
</button>
|
|
|
|
<button type="button" class="btn btn-soft-primary" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Zaplanuj połączenie">
|
|
<i class="bi bi-clock"></i>
|
|
</button>
|
|
|
|
<button type="button" class="btn btn-soft-primary" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Wyślij SMS">
|
|
<i class="bi bi-send"></i>
|
|
</button>
|
|
|
|
<div class="btn-group" role="group">
|
|
<button type="button" class="btn btn-primary" data-bs-toggle="dropdown" data-bs-target="uploadGroupDropdown">
|
|
<i class="bi-telephone-fill me-1"></i> W KOLEJCE
|
|
</button>
|
|
|
|
<div class="btn-group">
|
|
<button type="button" class="btn btn-primary dropdown-toggle" id="uploadGroupDropdown" data-bs-toggle="dropdown" aria-expanded="false"></button>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="uploadGroupDropdown" style="">
|
|
<a class="dropdown-item text-success" href="#">
|
|
<h2><span class="badge bg-success d-block">GOTOWE</span></h2>
|
|
</a>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-12 col-md-8">
|
|
<div class="magico-scroll" style="overflow-y: auto; overflow-x: hidden; height: 35rem;">
|
|
|
|
<!-- Step -->
|
|
<ul class="step">
|
|
<!-- Step Item -->
|
|
<li class="step-item">
|
|
<div class="step-content-wrapper">
|
|
<small class="step-divider">Dziś</small>
|
|
</div>
|
|
</li>
|
|
<!-- End Step Item -->
|
|
|
|
<!-- 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">
|
|
<div class="d-flex justify-content-between">
|
|
<h5 class="mb-1">Zmiana statusu</h5>
|
|
<p class="fs-5 mb-1 pe-3">2 minuty temu</p>
|
|
</div>
|
|
|
|
<p class="fs-5 mb-1">Zmieniono status na <span class="badge bg-soft-success text-primary rounded-pill"><span class="legend-indicator bg-success"></span>"GOTOWE"</span></p>
|
|
</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" src="./assets/img/160x160/img9.jpg" alt="Image Description">
|
|
</div>
|
|
|
|
<div class="step-content">
|
|
<div class="d-flex justify-content-between">
|
|
<h5 class="mb-1">Połączenie wychodzące</h5>
|
|
<p class="fs-5 mb-1 pe-3">4 minuty temu</p>
|
|
</div>
|
|
|
|
<p class="fs-5 mb-1">Czas trwania: 2:54</p>
|
|
</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">
|
|
<i class="bi bi-telephone-inbound"></i>
|
|
</span>
|
|
|
|
<div class="step-content">
|
|
<div class="d-flex justify-content-between">
|
|
<h5 class="mb-1">Połączenie przychodzące</h5>
|
|
<p class="fs-5 mb-1 pe-3">14 minuty temu</p>
|
|
</div>
|
|
|
|
<p class="fs-5 mb-1">Czas trwania: 2:54</p>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End Step Item -->
|
|
|
|
<!-- Step Item -->
|
|
<li class="step-item">
|
|
<div class="step-content-wrapper">
|
|
<span class="step-icon step-icon-soft-danger">
|
|
<i class="bi bi-telephone-x"></i>
|
|
</span>
|
|
|
|
<div class="step-content">
|
|
<div class="d-flex justify-content-between">
|
|
<h5 class="mb-1">Połączenie nieodebrane</h5>
|
|
<p class="fs-5 mb-1 pe-3">25 minut temu</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End Step Item -->
|
|
|
|
<!-- Step Item -->
|
|
<li class="step-item">
|
|
<div class="step-content-wrapper">
|
|
<small class="step-divider">Wczoraj</small>
|
|
</div>
|
|
</li>
|
|
<!-- End Step Item -->
|
|
|
|
|
|
<!-- Step Item -->
|
|
<li class="step-item">
|
|
<div class="step-content-wrapper">
|
|
<span class="step-icon step-icon-soft-info">
|
|
<i class="bi bi-chat-left-text"></i>
|
|
</span>
|
|
|
|
<div class="step-content">
|
|
<div class="d-flex justify-content-between">
|
|
<h5 class="mb-1">Dodano komentarz</h5>
|
|
<p class="fs-5 mb-1 pe-3">wczoraj 14:30</p>
|
|
</div>
|
|
|
|
<p class="fs-5 mb-1">Lorem ipsum, dolor, sit amet consectetur adipisicing elit. Maxime, accusantium praesentium obcaecati sed pariatur ipsa aperiam cupiditate labore non tempora rem ut aspernatur reprehenderit corrupti veritatis rerum, odio quo excepturi.</p>
|
|
</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">
|
|
<i class="bi bi-send"></i>
|
|
</span>
|
|
|
|
<div class="step-content">
|
|
<div class="d-flex justify-content-between">
|
|
<h5 class="mb-1">Wysłano SMS</h5>
|
|
<p class="fs-5 mb-1 pe-3">wczoraj 17:30</p>
|
|
</div>
|
|
|
|
<p class="fs-5 mb-1">Lorem ipsum, dolor, sit amet consectetur adipisicing elit. Maxime, accusantium praesentium obcaecati sed pariatur ipsa aperiam cupiditate labore non tempora rem ut aspernatur reprehenderit corrupti veritatis rerum, odio quo excepturi.</p>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<!-- End Step Item -->
|
|
|
|
</ul>
|
|
<!-- End Step -->
|
|
|
|
<!-- Footer -->
|
|
<div class="d-grid">
|
|
<a class="btn btn-white" href="javascript:;">
|
|
<i class="bi-arrow-clockwise me-1"></i> Wczytaj więcej
|
|
</a>
|
|
</div>
|
|
<!-- End Footer -->
|
|
|
|
</div>
|
|
|
|
</div>
|
|
<div class="col-12 col-md-4">
|
|
|
|
|
|
<!-- Pokazujemy po kliknięciu na ikonę planowania terminu rozmowy
|
|
dla pola daty robimy ładnego datepickera | czas ograniczamy do godzin i minut, z interwałem co 15 minut -->
|
|
<div class="mb-4">
|
|
<form>
|
|
<div class="input-group mb-3">
|
|
<input type="data" class="form-control" placeholder="2022-03-14 14:15" aria-label="2022-03-14 14:15" aria-describedby="basic-addon2">
|
|
<span class="input-group-text btn btn-outline-primary" id="basic-addon2"><i class="bi bi-send"></i></span>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<hr class="mb-4">
|
|
|
|
<form>
|
|
<div class="mb-3">
|
|
<textarea id="exampleFormControlTextarea1" class="form-control" placeholder="Komentarz" rows="4"></textarea>
|
|
</div>
|
|
<div class="d-flex justify-content-end gap-3">
|
|
<a class="js-delete-field btn btn-white btn-sm" href="javascript:;" data-hs-add-field-delete="0">Anuluj</a>
|
|
<a class="btn btn-primary btn-sm" href="javascript:;">Skomentuj</a>
|
|
</div>
|
|
</form>
|
|
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<!-- End Body -->
|
|
|
|
<!-- Footer -->
|
|
<!--<div class="modal-footer">
|
|
<div class="row align-items-center flex-grow-1 mx-n2">
|
|
<div class="col-sm-8 mb-2 mb-sm-0">
|
|
<p class="modal-footer-text">Lub wprowadź kod ręcznie: <strong>547 542</strong></a>
|
|
<i class="bi-question-circle" data-bs-toggle="tooltip" data-bs-placement="top" title="Masz 60 sekund na wprowadzenie kodu parowania"></i>
|
|
</p>
|
|
</div>
|
|
|
|
<div class="col-sm-4 text-sm-end">
|
|
<a class="js-clipboard btn btn-white btn-sm text-nowrap" href="javascript:;" title="">
|
|
<i class="bi-link-45deg me-1"></i> Generuj nowy kod</a>
|
|
</div>
|
|
</div>
|
|
</div> -->
|
|
<!-- End Footer -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 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="./assets/vendor/hs-nav-scroller/dist/hs-nav-scroller.min.js"></script>
|
|
<script src="./node_modules/tom-select/dist/js/tom-select.complete.min.js"></script>
|
|
<script src="./node_modules/flatpickr/dist/flatpickr.min.js"></script>
|
|
<script src="./node_modules/daterangepicker/moment.min.js"></script>
|
|
<script src="./node_modules/daterangepicker/daterangepicker.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>
|
|
|
|
<!-- JS Plugins Init. -->
|
|
<script>
|
|
(function() {
|
|
window.onload = function () {
|
|
// INITIALIZATION OF NAVBAR VERTICAL ASIDE
|
|
// =======================================================
|
|
new HSSideNav('.js-navbar-vertical-aside').init()
|
|
|
|
|
|
// INITIALIZATION OF BOOTSTRAP DROPDOWN
|
|
// =======================================================
|
|
HSBsDropdown.init()
|
|
|
|
|
|
// INITIALIZATION OF FORM SEARCH
|
|
// =======================================================
|
|
new HSFormSearch('.js-form-search')
|
|
|
|
|
|
// INITIALIZATION OF NAV SCROLLER
|
|
// =======================================================
|
|
new HsNavScroller('.js-nav-scroller')
|
|
|
|
|
|
// INITIALIZATION OF SELECT
|
|
// =======================================================
|
|
HSCore.components.HSTomSelect.init('.js-select')
|
|
|
|
|
|
|
|
}
|
|
})()
|
|
</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>
|