Files
amble_api/public/pages/apps/email.html
2025-07-15 15:54:43 +05:30

812 lines
46 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>SteelUI Admin</title>
<!-- plugins:css -->
<link rel="stylesheet" href="../../../../vendors/iconfonts/mdi/font/css/materialdesignicons.min.css">
<link rel="stylesheet" href="../../../../vendors/css/vendor.bundle.base.css">
<link rel="stylesheet" href="../../../../vendors/css/vendor.bundle.addons.css">
<!-- endinject -->
<!-- inject:css -->
<link rel="stylesheet" href="../../../../css/vertical-layout-light/style.css">
<!-- endinject -->
<link rel="shortcut icon" href="../../../../images/favicon.png" />
</head>
<body class="sidebar-icon-only">
<div class="container-scroller">
<!-- partial:../../partials/_navbar.html -->
<nav class="navbar col-lg-12 col-12 p-0 d-flex flex-row">
<div class="navbar-brand-wrapper d-flex align-items-center justify-content-start">
<a class="navbar-brand brand-logo-mini" href="../../index.html"><img src="../../../../images/logo-mini.svg" alt="logo"/></a>
</div>
<div class="navbar-menu-wrapper d-flex align-items-center justify-content-between">
<div class="d-flex align-items-center">
<button class="navbar-toggler navbar-toggler align-self-center" type="button" data-toggle="minimize">
<span class="mdi mdi-menu"></span>
</button>
<div class="welcome-message d-lg-flex d-none">Hi, welcome back!</div>
</div>
<ul class="navbar-nav mr-lg-2">
<li class="nav-item nav-search d-none d-lg-block">
<div class="input-group">
<input type="text" class="form-control" placeholder="search" aria-label="search" aria-describedby="search">
<div class="input-group-append">
<span class="input-group-text" id="search">
<i class="mdi mdi-magnify"></i>
</span>
</div>
</div>
</li>
</ul>
<ul class="navbar-nav navbar-nav-right">
<li class="nav-item dropdown">
<a class="nav-link count-indicator dropdown-toggle" id="notificationDropdown" href="#" data-toggle="dropdown">
<i class="mdi mdi-bell mx-0"></i>
<span class="count">2</span>
</a>
<div class="dropdown-menu dropdown-menu-right navbar-dropdown preview-list" aria-labelledby="notificationDropdown">
<h6 class="p-3 mb-0">Notifications</h6>
<div class="dropdown-divider"></div>
<a class="dropdown-item preview-item">
<div class="preview-thumbnail">
<div class="preview-icon text-center rounded-circle">
<i class="mdi mdi-calendar text-success"></i>
</div>
</div>
<div class="preview-item-content">
<h6 class="preview-subject mb-1">Event today</h6>
<p class="text-muted ellipsis mb-0"> Just a reminder that you have an event today </p>
</div>
</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item preview-item">
<div class="preview-thumbnail">
<div class="preview-icon text-center rounded-circle">
<i class="mdi mdi-settings text-danger"></i>
</div>
</div>
<div class="preview-item-content">
<h6 class="preview-subject mb-1">Settings</h6>
<p class="text-muted ellipsis mb-0"> Update dashboard </p>
</div>
</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item preview-item">
<div class="preview-thumbnail">
<div class="preview-icon text-center rounded-circle">
<i class="mdi mdi-link-variant text-warning"></i>
</div>
</div>
<div class="preview-item-content">
<h6 class="preview-subject mb-1">Launch Admin</h6>
<p class="text-muted ellipsis mb-0"> New admin wow! </p>
</div>
</a>
<div class="dropdown-divider"></div>
<p class="p-3 mb-0 text-center">See all notifications</p>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link count-indicator dropdown-toggle" id="mailDropdown" href="#" data-toggle="dropdown">
<i class="mdi mdi-email-open mx-0"></i>
<span class="count">3</span>
</a>
<div class="dropdown-menu dropdown-menu-right navbar-dropdown preview-list" aria-labelledby="mailDropdown">
<a class="dropdown-item">
<p class="mb-0 font-weight-normal float-left">You have 4 new notifications
</p>
<span class="badge badge-pill badge-warning float-right">View all</span>
</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item preview-item">
<div class="preview-thumbnail">
<div class="preview-icon bg-success">
<i class="mdi mdi-information mx-0"></i>
</div>
</div>
<div class="preview-item-content">
<h6 class="preview-subject font-weight-medium">Application Error</h6>
<p class="font-weight-light small-text mb-0">
Just now
</p>
</div>
</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item preview-item">
<div class="preview-thumbnail">
<div class="preview-icon bg-warning">
<i class="mdi mdi-settings mx-0"></i>
</div>
</div>
<div class="preview-item-content">
<h6 class="preview-subject font-weight-medium">Settings</h6>
<p class="font-weight-light small-text mb-0">
Private message
</p>
</div>
</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item preview-item">
<div class="preview-thumbnail">
<div class="preview-icon bg-info">
<i class="mdi mdi-account-box mx-0"></i>
</div>
</div>
<div class="preview-item-content">
<h6 class="preview-subject font-weight-medium">New user registration</h6>
<p class="font-weight-light small-text mb-0">
2 days ago
</p>
</div>
</a>
</div>
</li>
</ul>
<button class="navbar-toggler navbar-toggler-right d-lg-none align-self-center" type="button" data-toggle="offcanvas">
<span class="mdi mdi-menu"></span>
</button>
</div>
</nav>
<!-- partial -->
<div class="container-fluid page-body-wrapper">
<!-- partial:../../partials/_settings-panel.html -->
{{!--<div class="theme-setting-wrapper">
<div id="settings-trigger"><i class="mdi mdi-settings"></i></div>
<div id="theme-settings" class="settings-panel">
<i class="settings-close mdi mdi-close"></i>
<p class="settings-heading">SIDEBAR SKINS</p>
<div class="sidebar-bg-options" id="sidebar-light-theme"><div class="img-ss rounded-circle bg-light border mr-3"></div>Light</div>
<div class="sidebar-bg-options selected" id="sidebar-dark-theme"><div class="img-ss rounded-circle bg-dark border mr-3"></div>Dark</div>
<p class="settings-heading mt-2">HEADER SKINS</p>
<div class="color-tiles mx-0 px-4">
<div class="tiles success"></div>
<div class="tiles warning"></div>
<div class="tiles danger"></div>
<div class="tiles light"></div>
<div class="tiles info"></div>
<div class="tiles dark"></div>
<div class="tiles default"></div>
</div>
</div>
</div>--}}
<div id="right-sidebar" class="settings-panel">
<i class="settings-close mdi mdi-close"></i>
<ul class="nav nav-tabs" id="setting-panel" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="todo-tab" data-toggle="tab" href="#todo-section" role="tab" aria-controls="todo-section" aria-expanded="true">TO DO LIST</a>
</li>
<li class="nav-item">
<a class="nav-link" id="chats-tab" data-toggle="tab" href="#chats-section" role="tab" aria-controls="chats-section">CHATS</a>
</li>
</ul>
<div class="tab-content" id="setting-content">
<div class="tab-pane fade show active scroll-wrapper" id="todo-section" role="tabpanel" aria-labelledby="todo-section">
<div class="add-items d-flex px-3 mb-0">
<form class="form w-100">
<div class="form-group d-flex">
<input type="text" class="form-control todo-list-input" placeholder="Add To-do">
<button type="submit" class="add btn btn-primary todo-list-add-btn" id="add-task">Add</button>
</div>
</form>
</div>
<div class="list-wrapper px-3">
<ul class="d-flex flex-column-reverse todo-list">
<li>
<div class="form-check">
<label class="form-check-label">
<input class="checkbox" type="checkbox">
Team review meeting at 3.00 PM
</label>
</div>
<i class="remove mdi mdi-close-circle-outline"></i>
</li>
<li>
<div class="form-check">
<label class="form-check-label">
<input class="checkbox" type="checkbox">
Prepare for presentation
</label>
</div>
<i class="remove mdi mdi-close-circle-outline"></i>
</li>
<li>
<div class="form-check">
<label class="form-check-label">
<input class="checkbox" type="checkbox">
Resolve all the low priority tickets due today
</label>
</div>
<i class="remove mdi mdi-close-circle-outline"></i>
</li>
<li class="completed">
<div class="form-check">
<label class="form-check-label">
<input class="checkbox" type="checkbox" checked>
Schedule meeting for next week
</label>
</div>
<i class="remove mdi mdi-close-circle-outline"></i>
</li>
<li class="completed">
<div class="form-check">
<label class="form-check-label">
<input class="checkbox" type="checkbox" checked>
Project review
</label>
</div>
<i class="remove mdi mdi-close-circle-outline"></i>
</li>
</ul>
</div>
<div class="events py-4 border-bottom px-3">
<div class="wrapper d-flex mb-2">
<i class="mdi mdi-circle-outline text-primary mr-2"></i>
<span>Feb 11 2018</span>
</div>
<p class="mb-0 font-weight-thin text-gray">Creating component page</p>
<p class="text-gray mb-0">build a js based app</p>
</div>
<div class="events pt-4 px-3">
<div class="wrapper d-flex mb-2">
<i class="mdi mdi-circle-outline text-primary mr-2"></i>
<span>Feb 7 2018</span>
</div>
<p class="mb-0 font-weight-thin text-gray">Meeting with Alisa</p>
<p class="text-gray mb-0 ">Call Sarah Graves</p>
</div>
</div>
<!-- To do section tab ends -->
<div class="tab-pane fade" id="chats-section" role="tabpanel" aria-labelledby="chats-section">
<div class="d-flex align-items-center justify-content-between border-bottom">
<p class="settings-heading border-top-0 mb-3 pl-3 pt-0 border-bottom-0 pb-0">Friends</p>
<small class="settings-heading border-top-0 mb-3 pt-0 border-bottom-0 pb-0 pr-3 font-weight-normal">See All</small>
</div>
<ul class="chat-list">
<li class="list active">
<div class="profile"><img src="https://via.placeholder.com/100x100" alt="image"><span class="online"></span></div>
<div class="info">
<p>Thomas Douglas</p>
<p>Available</p>
</div>
<small class="text-muted my-auto">19 min</small>
</li>
<li class="list">
<div class="profile"><img src="https://via.placeholder.com/100x100" alt="image"><span class="offline"></span></div>
<div class="info">
<div class="wrapper d-flex">
<p>Catherine</p>
</div>
<p>Away</p>
</div>
<div class="badge badge-success badge-pill my-auto mx-2">4</div>
<small class="text-muted my-auto">23 min</small>
</li>
<li class="list">
<div class="profile"><img src="https://via.placeholder.com/100x100" alt="image"><span class="online"></span></div>
<div class="info">
<p>Daniel Russell</p>
<p>Available</p>
</div>
<small class="text-muted my-auto">14 min</small>
</li>
<li class="list">
<div class="profile"><img src="https://via.placeholder.com/100x100" alt="image"><span class="offline"></span></div>
<div class="info">
<p>James Richardson</p>
<p>Away</p>
</div>
<small class="text-muted my-auto">2 min</small>
</li>
<li class="list">
<div class="profile"><img src="https://via.placeholder.com/100x100" alt="image"><span class="online"></span></div>
<div class="info">
<p>Madeline Kennedy</p>
<p>Available</p>
</div>
<small class="text-muted my-auto">5 min</small>
</li>
<li class="list">
<div class="profile"><img src="https://via.placeholder.com/100x100" alt="image"><span class="online"></span></div>
<div class="info">
<p>Sarah Graves</p>
<p>Available</p>
</div>
<small class="text-muted my-auto">47 min</small>
</li>
</ul>
</div>
<!-- chat tab ends -->
</div>
</div>
<!-- partial -->
<!-- partial:../../partials/_sidebar.html -->
<nav class="sidebar sidebar-offcanvas" id="sidebar">
<ul class="nav">
<li class="nav-item">
<a class="navbar-brand brand-logo-mini" href="../../index.html"><img src="../../../../images/logo-mini.svg" alt="logo"/></a>
<a class="navbar-brand brand-logo" href="../../index.html"><img src="../../../../images/logo.svg" alt="logo"/></a>
</li>
<li class="nav-item">
<div class="menu-heading mt-0">MAIN MENU</div>
</li>
<li class="nav-item">
<a class="nav-link" href="../../index.html">
<i class="mdi mdi-locker-multiple menu-icon"></i>
<span class="menu-title">Dashboard</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="../../pages/widgets/widgets.html">
<i class="mdi mdi-airplay menu-icon"></i>
<span class="menu-title">Widgets</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="collapse" href="#apps" aria-expanded="false" aria-controls="apps">
<i class="mdi mdi-television menu-icon"></i>
<span class="menu-title">App Pages</span>
<i class="menu-arrow"></i>
</a>
<div class="collapse" id="apps">
<ul class="nav flex-column sub-menu">
<li class="nav-item"> <a class="nav-link" href="../../pages/apps/email.html">E-mail</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/apps/calendar.html">Calendar</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/apps/todo.html">Todo List</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/apps/gallery.html">Gallery</a></li>
</ul>
</div>
</li>
<li class="nav-item">
<div class="menu-heading">Interface</div>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="collapse" href="#ui-basic" aria-expanded="false" aria-controls="ui-basic">
<i class="mdi mdi-target menu-icon"></i>
<span class="menu-title">Components</span>
<i class="menu-arrow"></i>
</a>
<div class="collapse" id="ui-basic">
<ul class="nav flex-column sub-menu">
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/accordions.html">Accordions</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/buttons.html">Buttons</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/badges.html">Badges</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/breadcrumbs.html">Breadcrumbs</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/dropdowns.html">Dropdowns</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/modals.html">Modals</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/progress.html">Progress bar</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/pagination.html">Pagination</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/tabs.html">Tabs</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/typography.html">Typography</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/tooltips.html">Tooltips</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/dragula.html">Dragula</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/clipboard.html">Clipboard</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/context-menu.html">Context menu</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/slider.html">Sliders</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/carousel.html">Carousel</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/colcade.html">Colcade</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/loaders.html">Loaders</a></li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="collapse" href="#form-elements" aria-expanded="false" aria-controls="form-elements">
<i class="mdi mdi-bullhorn menu-icon"></i>
<span class="menu-title">Forms</span>
<i class="menu-arrow"></i>
</a>
<div class="collapse" id="form-elements">
<ul class="nav flex-column sub-menu">
<li class="nav-item"><a class="nav-link" href="../../pages/forms/basic_elements.html">Basic Elements</a></li>
<li class="nav-item"><a class="nav-link" href="../../pages/forms/advanced_elements.html">Advanced Elements</a></li>
<li class="nav-item"><a class="nav-link" href="../../pages/forms/validation.html">Validation</a></li>
<li class="nav-item"><a class="nav-link" href="../../pages/forms/wizard.html">Wizard</a></li>
<li class="nav-item"><a class="nav-link" href="../../pages/forms/text_editor.html">Text editors</a></li>
<li class="nav-item"><a class="nav-link" href="../../pages/forms/code_editor.html">Code editors</a></li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="collapse" href="#utilities" aria-expanded="false" aria-controls="utilities">
<i class="mdi mdi-scale-balance menu-icon"></i>
<span class="menu-title">Utilities</span>
<i class="menu-arrow"></i>
</a>
<div class="collapse" id="utilities">
<ul class="nav flex-column sub-menu">
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/popups.html">Popups</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/ui-features/notifications.html">Notifications</a></li>
</ul>
</div>
</li>
<li class="nav-item">
<div class="menu-heading">Addons</div>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="collapse" href="#charts" aria-expanded="false" aria-controls="charts">
<i class="mdi mdi-chart-bar menu-icon"></i>
<span class="menu-title">Charts</span>
<i class="menu-arrow"></i>
</a>
<div class="collapse" id="charts">
<ul class="nav flex-column sub-menu">
<li class="nav-item"> <a class="nav-link" href="../../pages/charts/chartjs.html">ChartJs</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/charts/morris.html">Morris</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/charts/flot-chart.html">Flot</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/charts/google-charts.html">Google charts</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/charts/sparkline.html">Sparkline js</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/charts/c3.html">C3 charts</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/charts/chartist.html">Chartists</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/charts/justGage.html">JustGage</a></li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="collapse" href="#tables" aria-expanded="false" aria-controls="tables">
<i class="mdi mdi-grid-large menu-icon"></i>
<span class="menu-title">Tables</span>
<i class="menu-arrow"></i>
</a>
<div class="collapse" id="tables">
<ul class="nav flex-column sub-menu">
<li class="nav-item"> <a class="nav-link" href="../../pages/tables/basic-table.html">Basic table</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/tables/data-table.html">Data table</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/tables/js-grid.html">Js-grid</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/tables/sortable-table.html">Sortable table</a></li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="collapse" href="#icons" aria-expanded="false" aria-controls="icons">
<i class="mdi mdi-emoticon menu-icon"></i>
<span class="menu-title">Icons</span>
<i class="menu-arrow"></i>
</a>
<div class="collapse" id="icons">
<ul class="nav flex-column sub-menu">
<li class="nav-item"> <a class="nav-link" href="../../pages/icons/flag-icons.html">Flag icons</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/icons/font-awesome.html">Font Awesome</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/icons/simple-line-icon.html">Simple line icons</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/icons/themify.html">Themify icons</a></li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="collapse" href="#maps" aria-expanded="false" aria-controls="maps">
<i class="mdi mdi-map menu-icon"></i>
<span class="menu-title">Maps</span>
<i class="menu-arrow"></i>
</a>
<div class="collapse" id="maps">
<ul class="nav flex-column sub-menu">
<li class="nav-item"> <a class="nav-link" href="../../pages/maps/mapeal.html">Mapeal</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/maps/vector-map.html">Vector Map</a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/maps/google-maps.html">Google Map</a></li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="collapse" href="#pages" aria-expanded="false" aria-controls="pages">
<i class="mdi mdi-file-document menu-icon"></i>
<span class="menu-title">Pages</span>
<i class="menu-arrow"></i>
</a>
<div class="collapse" id="pages">
<ul class="nav flex-column sub-menu">
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/login.html"> Login </a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/login-2.html"> Login 2 </a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/register.html"> Register </a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/register-2.html"> Register 2 </a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/lock-screen.html"> Lockscreen </a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/error-404.html"> 404 </a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/error-500.html"> 500 </a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/blank-page.html"> Blank Page </a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/profile.html"> Profile </a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/faq.html"> FAQ </a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/faq-2.html"> FAQ 2 </a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/news-grid.html"> News grid </a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/timeline.html"> Timeline </a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/search-results.html"> Search Results </a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/portfolio.html"> Portfolio </a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/invoice.html"> Invoice </a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/pricing-table.html"> Pricing Table </a></li>
<li class="nav-item"> <a class="nav-link" href="../../pages/samples/orders.html"> Orders </a></li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" href="https://www.bootstrapdash.com/demo/steelui/docs/documentation.html" target="_blank">
<span class="menu-title documentation">Documentation</span>
</a>
</li>
</ul>
</nav>
<!-- partial -->
<div class="main-panel">
<div class="content-wrapper">
<div class="email-wrapper wrapper">
<div class="row align-items-stretch">
<div class="mail-sidebar d-none d-lg-block col-md-2 pt-3 bg-white">
<div class="menu-bar">
<ul class="menu-items">
<li class="compose mb-3"><button class="btn btn-primary btn-block">Compose</button></li>
<li class="active"><a href="#"><i class="mdi mdi-email-outline"></i> Inbox</a><span class="badge badge-pill badge-success">8</span></li>
<li><a href="#"><i class="mdi mdi-share"></i> Sent</a></li>
<li><a href="#"><i class="mdi mdi-file-outline"></i> Draft</a><span class="badge badge-pill badge-warning">4</span></li>
<li><a href="#"><i class="mdi mdi-upload"></i> Outbox</a><span class="badge badge-pill badge-danger">3</span></li>
<li><a href="#"><i class="mdi mdi-star-outline"></i> Starred</a></li>
<li><a href="#"><i class="mdi mdi-delete"></i> Trash</a></li>
</ul>
<div class="wrapper">
<div class="online-status d-flex justify-content-between align-items-center">
<p class="chat">Chats</p> <span class="status offline online"></span></div>
</div>
<ul class="profile-list">
<li class="profile-list-item"> <a href="#"> <span class="pro-pic"><img src="https://via.placeholder.com/100x100" alt=""></span><div class="user"><p class="u-name">David</p><p class="u-designation">Python Developer</p></div> </a></li>
<li class="profile-list-item"> <a href="#"> <span class="pro-pic"><img src="https://via.placeholder.com/100x100" alt=""></span><div class="user"><p class="u-name">Stella Johnson</p><p class="u-designation">SEO Expert</p></div> </a></li>
<li class="profile-list-item"> <a href="#"> <span class="pro-pic"><img src="https://via.placeholder.com/100x100" alt=""></span><div class="user"><p class="u-name">Catherine</p><p class="u-designation">IOS Developer</p></div> </a></li>
<li class="profile-list-item"> <a href="#"> <span class="pro-pic"><img src="https://via.placeholder.com/100x100" alt=""></span><div class="user"><p class="u-name">John Doe</p><p class="u-designation">Business Analyst</p></div> </a></li>
<li class="profile-list-item"> <a href="#"> <span class="pro-pic"><img src="https://via.placeholder.com/100x100" alt=""></span><div class="user"><p class="u-name">Daniel Russell</p><p class="u-designation">Tester</p></div> </a></li>
<li class="profile-list-item"> <a href="#"> <span class="pro-pic"><img src="https://via.placeholder.com/100x100" alt=""></span><div class="user"><p class="u-name">Sarah Graves</p><p class="u-designation">Admin</p></div> </a></li>
<li class="profile-list-item"> <a href="#"> <span class="pro-pic"><img src="https://via.placeholder.com/100x100" alt=""></span><div class="user"><p class="u-name">Sophia Lara</p><p class="u-designation">UI/UX</p></div> </a></li>
<li class="profile-list-item"> <a href="#"> <span class="pro-pic"><img src="https://via.placeholder.com/100x100" alt=""></span><div class="user"><p class="u-name">Catherine Myers</p><p class="u-designation">Business Analyst</p></div> </a></li>
<li class="profile-list-item"> <a href="#"> <span class="pro-pic"><img src="https://via.placeholder.com/100x100" alt=""></span><div class="user"><p class="u-name">Tim</p><p class="u-designation">PHP Developer</p></div> </a></li>
</ul>
</div>
</div>
<div class="mail-list-container col-md-3 pt-4 pb-4 border-right bg-white">
<div class="border-bottom pb-4 mb-3 px-3">
<div class="form-group">
<input class="form-control w-100" type="search" placeholder="Search mail" id="Mail-rearch">
</div>
</div>
<div class="mail-list">
<div class="form-check"> <label class="form-check-label"> <input type="checkbox" class="form-check-input"> </label></div>
<div class="content">
<p class="sender-name">David Moore</p>
<p class="message_text">Hi Emily, Please be informed that the new project presentation is due Monday.</p>
</div>
<div class="details">
<i class="mdi mdi-star-outline"></i>
</div>
</div>
<div class="mail-list new_mail">
<div class="form-check"> <label class="form-check-label"> <input type="checkbox" class="form-check-input" checked> </label></div>
<div class="content">
<p class="sender-name">Microsoft Account Password Change</p>
<p class="message_text">Change the password for your Microsoft Account using the security code 35525</p>
</div>
<div class="details">
<i class="mdi mdi-star favorite"></i>
</div>
</div>
<div class="mail-list">
<div class="form-check"> <label class="form-check-label"> <input type="checkbox" class="form-check-input"> </label></div>
<div class="content">
<p class="sender-name">Sophia Lara</p>
<p class="message_text">Hello, last date for registering for the annual music event is closing in</p>
</div>
<div class="details">
<i class="mdi mdi-star-outline"></i>
</div>
</div>
<div class="mail-list">
<div class="form-check"> <label class="form-check-label"> <input type="checkbox" class="form-check-input"> </label></div>
<div class="content">
<p class="sender-name">Stella Davidson</p>
<p class="message_text">Hey there, can you send me this years holiday calendar?</p>
</div>
<div class="details">
<i class="mdi mdi-star favorite"></i>
</div>
</div>
<div class="mail-list">
<div class="form-check"> <label class="form-check-label"> <input type="checkbox" class="form-check-input"> </label></div>
<div class="content">
<p class="sender-name">David Moore</p>
<p class="message_text">FYI</p>
</div>
<div class="details">
<i class="mdi mdi-star favorite"></i>
</div>
</div>
<div class="mail-list">
<div class="form-check"> <label class="form-check-label"> <input type="checkbox" class="form-check-input"> </label></div>
<div class="content">
<p class="sender-name">Daniel Russel</p>
<p class="message_text">Hi, Please find this weeks update..</p>
</div>
<div class="details">
<i class="mdi mdi-star-outline"></i>
</div>
</div>
<div class="mail-list">
<div class="form-check"><label class="form-check-label"> <input type="checkbox" class="form-check-input"> </label></div>
<div class="content">
<p class="sender-name">Sarah Graves</p>
<p class="message_text">Hey, can you send me this years holiday calendar ?</p>
</div>
<div class="details">
<i class="mdi mdi-star-outline"></i>
</div>
</div>
<div class="mail-list">
<div class="form-check"> <label class="form-check-label"> <input type="checkbox" class="form-check-input"> </label></div>
<div class="content">
<p class="sender-name">Bruno King</p>
<p class="message_text">Hi, Please find this weeks monitoring report in the attachment.</p>
</div>
<div class="details">
<i class="mdi mdi-star-outline"></i>
</div>
</div>
<div class="mail-list">
<div class="form-check"> <label class="form-check-label"> <input type="checkbox" class="form-check-input"> </label></div>
<div class="content">
<p class="sender-name">Me, Mark</p>
<p class="message_text">Hi, Testing is complete. The system is ready to go live.</p>
</div>
<div class="details">
<i class="mdi mdi-star-outline"></i>
</div>
</div>
<div class="mail-list">
<div class="form-check"> <label class="form-check-label"> <input type="checkbox" class="form-check-input"> </label></div>
<div class="content">
<p class="sender-name">Catherine Myers</p>
<p class="message_text">Template Market: Limited Period Offer!!! 50% Discount on all Templates.</p>
</div>
<div class="details">
<i class="mdi mdi-star favorite"></i>
</div>
</div>
<div class="mail-list">
<div class="form-check"> <label class="form-check-label"> <input type="checkbox" class="form-check-input"> </label></div>
<div class="content">
<p class="sender-name">Daniel Russell</p>
<p class="message_text">Hi Emily, Please approve my leaves for 10 days from 10th May to 20th May.</p>
</div>
<div class="details">
<i class="mdi mdi-star-outline"></i>
</div>
</div>
<div class="mail-list">
<div class="form-check"> <label class="form-check-label"> <input type="checkbox" class="form-check-input"> </label></div>
<div class="content">
<p class="sender-name">Sarah Graves</p>
<p class="message_text">Hello there, Make the most of the limited period offer. Grab your favorites</p>
</div>
<div class="details">
<i class="mdi mdi-star-outline"></i>
</div>
</div>
<div class="mail-list">
<div class="form-check"> <label class="form-check-label"> <input type="checkbox" class="form-check-input"> </label></div>
<div class="content">
<p class="sender-name">John Doe</p>
<p class="message_text">This is the first reminder to complete the online cybersecurity course</p>
</div>
<div class="details">
<i class="mdi mdi-star-outline"></i>
</div>
</div>
<div class="mail-list">
<div class="form-check"> <label class="form-check-label"> <input type="checkbox" class="form-check-input"> </label></div>
<div class="content">
<p class="sender-name">Bruno</p>
<p class="message_text">Dear Employee, As per the regulations all employees are required to complete</p>
</div>
<div class="details">
<i class="mdi mdi-star-outline"></i>
</div>
</div>
</div>
<div class="mail-view d-none d-md-block col-md-9 col-lg-7 bg-white">
<div class="row">
<div class="col-md-12 mb-4 mt-4">
<div class="btn-toolbar">
<div class="btn-group">
<button type="button" class="btn btn-sm btn-outline-secondary"><i class="mdi mdi-reply text-primary"></i> Reply</button>
<button type="button" class="btn btn-sm btn-outline-secondary"><i class="mdi mdi-reply-all text-primary"></i>Reply All</button>
<button type="button" class="btn btn-sm btn-outline-secondary"><i class="mdi mdi-share text-primary"></i>Forward</button>
</div>
<div class="btn-group">
<button type="button" class="btn btn-sm btn-outline-secondary"><i class="mdi mdi-attachment text-primary"></i>Attach</button>
<button type="button" class="btn btn-sm btn-outline-secondary"><i class="mdi mdi-delete text-primary"></i>Delete</button>
</div>
</div>
</div>
</div>
<div class="message-body">
<div class="sender-details">
<img class="img-sm rounded-circle mr-3" src="https://via.placeholder.com/100x100" alt="">
<div class="details">
<p class="msg-subject">
Weekly Update - Week 19 (May 8, 2017 - May 14, 2017)
</p>
<p class="sender-email">
Sarah Graves
<a href="#">itsmesarah268@gmail.com</a>
&nbsp;<i class="mdi mdi-account-multiple-plus"></i>
</p>
</div>
</div>
<div class="message-content">
<p>Hi Emily,</p>
<p>This week has been a great week and the team is right on schedule with the set deadline. The team has made great progress and achievements this week. At the current rate we will be able to deliver the product right on time and meet the quality that is expected of us. Attached are the seminar report held this week by our team and the final product design that needs your approval at the earliest.</p>
<p>For the coming week the highest priority is given to the development for <a href="http://www.bootstrapdash.com/" target="_blank">http://www.bootstrapdash.com/</a> once the design is approved and necessary improvements are made.</p>
<p><br><br>Regards,<br>Sarah Graves</p>
</div>
<div class="attachments-sections">
<ul>
<li>
<div class="thumb"><i class="mdi mdi-file-pdf"></i></div>
<div class="details">
<p class="file-name">Seminar Reports.pdf</p>
<div class="buttons">
<p class="file-size">678Kb</p>
<a href="#" class="view">View</a>
<a href="#" class="download">Download</a>
</div>
</div>
</li>
<li>
<div class="thumb"><i class="mdi mdi-file-image"></i></div>
<div class="details">
<p class="file-name">Product Design.jpg</p>
<div class="buttons">
<p class="file-size">1.96Mb</p>
<a href="#" class="view">View</a>
<a href="#" class="download">Download</a>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- content-wrapper ends -->
<!-- partial:../../partials/_footer.html -->
<footer class="footer">
<div class="d-sm-flex justify-content-center justify-content-sm-between">
<span class="text-muted text-center text-sm-left d-block d-sm-inline-block">Copyright © <a href="#" target="_blank">BTF</a> 2020-21. All rights reserved.</span>
{{!--<span class="float-none float-sm-right d-block mt-1 mt-sm-0 text-center">Hand-crafted & made with <i class="mdi mdi-heart text-danger"></i></span>--}}
</div>
</footer>
<!-- partial -->
</div>
<!-- main-panel ends -->
</div>
<!-- page-body-wrapper ends -->
</div>
<!-- container-scroller -->
<!-- plugins:js -->
<script src="../../../../vendors/js/vendor.bundle.base.js"></script>
<script src="../../../../vendors/js/vendor.bundle.addons.js"></script>
<!-- endinject -->
<!-- inject:js -->
<script src="../../../../js/off-canvas.js"></script>
<script src="../../../../js/hoverable-collapse.js"></script>
<script src="../../../../js/template.js"></script>
<script src="../../../../js/settings.js"></script>
<script src="../../../../js/todolist.js"></script>
<!-- endinject -->
<!-- Custom js for this page-->
<!-- End custom js for this page-->
</body>
</html>