MIF_E31222756/template/DB/taskboard.html

1009 lines
64 KiB
HTML
Raw 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>
<meta charset="utf-8" />
<title>Taskboard | Adminox - Responsive Bootstrap 4 Admin Dashboard</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="A fully featured admin theme which can be used to build CRM, CMS, etc." name="description" />
<meta content="Coderthemes" name="author" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!-- App favicon -->
<link rel="shortcut icon" href="assets/images/favicon.ico">
<link href="assets/libs/bootstrap-tagsinput/bootstrap-tagsinput.css" rel="stylesheet" type="text/css"/>
<!-- App css -->
<link href="assets/css/bootstrap.min.css" rel="stylesheet" type="text/css" id="bootstrap-stylesheet" />
<link href="assets/css/icons.min.css" rel="stylesheet" type="text/css" />
<link href="assets/css/app.min.css" rel="stylesheet" type="text/css" id="app-stylesheet" />
</head>
<body>
<!-- Begin page -->
<div id="wrapper">
<!-- Topbar Start -->
<div class="navbar-custom">
<ul class="list-unstyled topnav-menu float-right mb-0">
<li class="dropdown notification-list dropdown d-none d-lg-inline-block ml-2">
<a class="nav-link dropdown-toggle mr-0 waves-effect waves-light" data-toggle="dropdown" href="#" role="button" aria-haspopup="false" aria-expanded="false">
<img src="assets/images/flags/us.jpg" alt="lang-image" height="12">
</a>
<div class="dropdown-menu dropdown-menu-right profile-dropdown ">
<!-- item-->
<a href="javascript:void(0);" class="dropdown-item notify-item">
<img src="assets/images/flags/germany.jpg" alt="lang-image" class="mr-1" height="12"> <span
class="align-middle">German</span>
</a>
<!-- item-->
<a href="javascript:void(0);" class="dropdown-item notify-item">
<img src="assets/images/flags/italy.jpg" alt="lang-image" class="mr-1" height="12"> <span
class="align-middle">Italian</span>
</a>
<!-- item-->
<a href="javascript:void(0);" class="dropdown-item notify-item">
<img src="assets/images/flags/spain.jpg" alt="lang-image" class="mr-1" height="12"> <span
class="align-middle">Spanish</span>
</a>
<!-- item-->
<a href="javascript:void(0);" class="dropdown-item notify-item">
<img src="assets/images/flags/russia.jpg" alt="lang-image" class="mr-1" height="12"> <span
class="align-middle">Russian</span>
</a>
</div>
</li>
<li class="dropdown notification-list">
<a class="nav-link dropdown-toggle waves-effect waves-light" data-toggle="dropdown" href="#" role="button" aria-haspopup="false" aria-expanded="false">
<i class="dripicons-bell noti-icon"></i>
<span class="badge badge-pink rounded-circle noti-icon-badge">4</span>
</a>
<div class="dropdown-menu dropdown-menu-right dropdown-lg">
<div class="dropdown-header noti-title">
<h5 class="text-overflow m-0"><span class="float-right">
<span class="badge badge-danger float-right">5</span>
</span>Notification</h5>
</div>
<div class="slimscroll noti-scroll">
<a href="javascript:void(0);" class="dropdown-item notify-item">
<div class="notify-icon bg-success"><i class="mdi mdi-comment-account-outline"></i></div>
<p class="notify-details">Robert S. Taylor commented on Admin<small class="text-muted">1 min ago</small></p>
</a>
<!-- item-->
<a href="javascript:void(0);" class="dropdown-item notify-item">
<div class="notify-icon bg-primary">
<i class="mdi mdi-settings-outline"></i>
</div>
<p class="notify-details">New settings
<small class="text-muted">There are new settings available</small>
</p>
</a>
<!-- item-->
<a href="javascript:void(0);" class="dropdown-item notify-item">
<div class="notify-icon bg-warning">
<i class="mdi mdi-bell-outline"></i>
</div>
<p class="notify-details">Updates
<small class="text-muted">There are 2 new updates available</small>
</p>
</a>
<!-- item-->
<a href="javascript:void(0);" class="dropdown-item notify-item">
<div class="notify-icon">
<img src="assets/images/users/avatar-4.jpg" class="img-fluid rounded-circle" alt="" /> </div>
<p class="notify-details">Karen Robinson</p>
<p class="text-muted mb-0 user-msg">
<small>Wow ! this admin looks good and awesome design</small>
</p>
</a>
<!-- item-->
<a href="javascript:void(0);" class="dropdown-item notify-item">
<div class="notify-icon bg-danger">
<i class="mdi mdi-account-plus"></i>
</div>
<p class="notify-details">New user
<small class="text-muted">You have 10 unread messages</small>
</p>
</a>
<!-- item-->
<a href="javascript:void(0);" class="dropdown-item notify-item">
<div class="notify-icon bg-info">
<i class="mdi mdi-comment-account-outline"></i>
</div>
<p class="notify-details">Caleb Flakelar commented on Admin
<small class="text-muted">4 days ago</small>
</p>
</a>
<!-- item-->
<a href="javascript:void(0);" class="dropdown-item notify-item">
<div class="notify-icon bg-secondary">
<i class="mdi mdi-heart"></i>
</div>
<p class="notify-details">Carlos Crouch liked
<b>Admin</b>
<small class="text-muted">13 days ago</small>
</p>
</a>
</div>
<!-- All-->
<a href="javascript:void(0);" class="dropdown-item text-center text-primary notify-item notify-all">
View all
<i class="fi-arrow-right"></i>
</a>
</div>
</li>
<li class="dropdown notification-list">
<a class="nav-link dropdown-toggle nav-user mr-0 waves-effect waves-light" data-toggle="dropdown" href="#" role="button" aria-haspopup="false" aria-expanded="false">
<img src="assets/images/users/avatar-1.jpg" alt="user-image" class="rounded-circle">
<span class="pro-user-name ml-1">
Maxine K <i class="mdi mdi-chevron-down"></i>
</span>
</a>
<div class="dropdown-menu dropdown-menu-right profile-dropdown ">
<!-- item-->
<div class="dropdown-header noti-title">
<h6 class="text-overflow m-0">Welcome !</h6>
</div>
<!-- item-->
<a href="javascript:void(0);" class="dropdown-item notify-item">
<i class="fe-user"></i>
<span>Profile</span>
</a>
<!-- item-->
<a href="javascript:void(0);" class="dropdown-item notify-item">
<i class="fe-settings"></i>
<span>Settings</span>
</a>
<!-- item-->
<a href="javascript:void(0);" class="dropdown-item notify-item">
<i class="fe-lock"></i>
<span>Lock Screen</span>
</a>
<div class="dropdown-divider"></div>
<!-- item-->
<a href="javascript:void(0);" class="dropdown-item notify-item">
<i class="fe-log-out"></i>
<span>Logout</span>
</a>
</div>
</li>
<li class="dropdown notification-list">
<a href="javascript:void(0);" class="nav-link right-bar-toggle waves-effect waves-light">
<i class="fe-settings noti-icon"></i>
</a>
</li>
</ul>
<!-- LOGO -->
<div class="logo-box">
<a href="index.html" class="logo text-center">
<span class="logo-lg">
<img src="assets/images/logo-light.png" alt="" height="25">
<!-- <span class="logo-lg-text-light">UBold</span> -->
</span>
<span class="logo-sm">
<!-- <span class="logo-sm-text-dark">U</span> -->
<img src="assets/images/logo-sm.png" alt="" height="28">
</span>
</a>
</div>
<ul class="list-unstyled topnav-menu topnav-menu-left m-0">
<li>
<button class="button-menu-mobile waves-effect waves-light">
<i class="fe-menu"></i>
</button>
</li>
<li class="d-none d-sm-block">
<form class="app-search">
<div class="app-search-box">
<div class="input-group">
<input type="text" class="form-control" placeholder="Search...">
<div class="input-group-append">
<button class="btn" type="submit">
<i class="fe-search"></i>
</button>
</div>
</div>
</div>
</form>
</li>
</ul>
</div>
<!-- end Topbar -->
<!-- ========== Left Sidebar Start ========== -->
<div class="left-side-menu">
<div class="slimscroll-menu">
<!--- Sidemenu -->
<div id="sidebar-menu">
<ul class="metismenu" id="side-menu">
<li class="menu-title">Navigation</li>
<li>
<a href="javascript: void(0);">
<i class="fe-airplay"></i>
<span class="badge badge-success badge-pill float-right">2</span>
<span> Dashboard </span>
</a>
<ul class="nav-second-level" aria-expanded="false">
<li><a href="index.html">Dashboard 1</a></li>
<li> <a href="dashboard-2.html">Dashboard 2</a></li>
</ul>
</li>
<li>
<a href="javascript: void(0);">
<i class="fe-sidebar"></i>
<span> Layouts </span>
<span class="menu-arrow"></span>
</a>
<ul class="nav-second-level" aria-expanded="false">
<li><a href="layouts-horizontal.html">Horizontal</a></li>
<li><a href="layouts-menucollapsed.html">Menu Collapsed</a></li>
<li><a href="layouts-light-sidebar.html">Light Sidebar</a></li>
<li><a href="layouts-small-sidebar.html">Small Sidebar</a></li>
<li><a href="layouts-boxed.html">Boxed</a></li>
</ul>
</li>
<li>
<a href="javascript: void(0);">
<i class="fe-file-plus"></i>
<span> Pages </span>
<span class="menu-arrow"></span>
</a>
<ul class="nav-second-level" aria-expanded="false">
<li><a href="page-starter.html">Starter Page</a></li>
<li><a href="page-login.html">Login</a></li>
<li><a href="page-register.html">Register</a></li>
<li><a href="page-logout.html">Logout</a></li>
<li><a href="page-recoverpw.html">Recover Password</a></li>
<li><a href="page-lock-screen.html">Lock Screen</a></li>
<li><a href="page-confirm-mail.html">Confirm Mail</a></li>
<li><a href="page-404.html">Error 404</a></li>
<li><a href="page-404-alt.html">Error 404-alt</a></li>
<li><a href="page-500.html">Error 500</a></li>
</ul>
</li>
<li>
<a href="javascript: void(0);">
<i class="fe-plus-square"></i>
<span> Extra Pages </span>
<span class="menu-arrow"></span>
</a>
<ul class="nav-second-level" aria-expanded="false">
<li><a href="extras-about.html">About Us</a></li>
<li><a href="extras-contact.html">Contact</a></li>
<li><a href="extras-companies.html">Companies</a></li>
<li><a href="extras-members.html">Members</a></li>
<li><a href="extras-members-2.html">Members 2</a></li>
<li><a href="extras-timeline.html">Timeline</a></li>
<li><a href="extras-invoice.html">Invoice</a></li>
<li><a href="extras-maintenance.html">Maintenance</a></li>
<li><a href="extras-coming-soon.html">Coming Soon</a></li>
<li><a href="extras-faq.html">FAQ</a></li>
<li><a href="extras-pricing.html">Pricing</a></li>
<li><a href="extras-profile.html">Profile</a></li>
<li><a href="extras-email-template.html">Email Templates</a></li>
<li><a href="extras-search-result.html">Search Results</a></li>
<li><a href="extras-sitemap.html">Site Map</a></li>
</ul>
</li>
<li class="menu-title">Apps</li>
<li>
<a href="javascript: void(0);">
<i class="fe-mail"></i>
<span> Email </span>
<span class="menu-arrow"></span>
</a>
<ul class="nav-second-level" aria-expanded="false">
<li><a href="email-inbox.html">Inbox</a></li>
<li><a href="email-read.html">Read Email</a></li>
<li><a href="email-compose.html">Compose Email</a></li>
</ul>
</li>
<li>
<a href="calendar.html">
<i class="fe-calendar"></i>
<span> Calendar </span>
</a>
</li>
<li>
<a href="tickets.html">
<i class="fe-life-buoy"></i>
<span> Tickets </span>
<span class="badge badge-danger badge-pill float-right">New</span>
</a>
</li>
<li>
<a href="taskboard.html">
<i class="fe-file-text"></i>
<span> Task Board </span>
</a>
</li>
<li>
<a href="todo.html">
<i class="fe-layers"></i>
<span> Todo </span>
</a>
</li>
<li class="menu-title">Components</li>
<li>
<a href="javascript: void(0);">
<i class="fe-target"></i>
<span> Admin UI </span>
<span class="menu-arrow"></span>
</a>
<ul class="nav-second-level" aria-expanded="false">
<li><a href="admin-grid.html">Grid</a></li>
<li><a href="admin-sweet-alert.html">Sweet Alert</a></li>
<li><a href="admin-tiles.html">Tiles Box</a></li>
<li><a href="admin-nestable.html">Nestable List</a></li>
<li><a href="admin-rangeslider.html">Range Slider</a></li>
<li><a href="admin-ratings.html">Ratings</a></li>
<li><a href="admin-filemanager.html">File Manager</a></li>
<li><a href="admin-lightbox.html">Lightbox</a></li>
<li><a href="admin-scrollbar.html">Scroll bar</a></li>
<li><a href="admin-slider.html">Slider</a></li>
<li><a href="admin-treeview.html">Treeview</a></li>
</ul>
</li>
<li>
<a href="javascript: void(0);">
<i class="fe-briefcase"></i>
<span> UI Kit </span>
<span class="menu-arrow"></span>
</a>
<ul class="nav-second-level" aria-expanded="false">
<li><a href="ui-typography.html">Typography</a></li>
<li><a href="ui-cards.html">Cards</a></li>
<li><a href="ui-buttons.html">Buttons</a></li>
<li><a href="ui-modals.html">Modals</a></li>
<li><a href="ui-checkbox-radio.html">Checkboxs-Radios</a></li>
<li><a href="ui-spinners.html">Spinners</a></li>
<li><a href="ui-ribbons.html">Ribbons</a></li>
<li><a href="ui-portlets.html">Portlets</a></li>
<li><a href="ui-tabs.html">Tabs</a></li>
<li><a href="ui-progressbars.html">Progress Bars</a></li>
<li><a href="ui-notifications.html">Notification</a></li>
<li><a href="ui-carousel.html">Carousel</a></li>
<li><a href="ui-video.html">Video</a></li>
<li><a href="ui-tooltips-popovers.html">Tooltips &amp; Popovers</a></li>
<li><a href="ui-images.html">Images</a></li>
<li><a href="ui-bootstrap.html">Bootstrap UI</a></li>
</ul>
</li>
<li>
<a href="javascript: void(0);">
<i class="fe-box"></i>
<span> Icons </span>
<span class="menu-arrow"></span>
</a>
<ul class="nav-second-level" aria-expanded="false">
<li><a href="icons-colored.html">Colored Icons</a></li>
<li><a href="icons-materialdesign.html">Material Design</a></li>
<li><a href="icons-dripicons.html">Dripicons</a></li>
<li><a href="icons-fontawesome.html">Font awesome</a></li>
<li><a href="icons-feather.html">Feather Icons</a></li>
<li><a href="icons-simple-line.html">Simple line Icons</a></li>
<li><a href="icons-flags.html">Flag Icons</a></li>
<li><a href="icons-file.html">File Icons</a></li>
<li><a href="icons-pe7.html">PE7 Icons</a></li>
<li><a href="icons-typicons.html">Typicons</a></li>
</ul>
</li>
<li>
<a href="javascript: void(0);">
<i class="fe-bar-chart-2"></i>
<span> Graphs </span>
<span class="menu-arrow"></span>
</a>
<ul class="nav-second-level" aria-expanded="false">
<li><a href="chart-flot.html">Flot Chart</a></li>
<li><a href="chart-morris.html">Morris Chart</a></li>
<li><a href="chart-google.html">Google Chart</a></li>
<li><a href="chart-echart.html">Echarts</a></li>
<li><a href="chart-chartist.html">Chartist Charts</a></li>
<li><a href="chart-chartjs.html">Chartjs Chart</a></li>
<li><a href="chart-c3.html">C3 Chart</a></li>
<li><a href="chart-sparkline.html">Sparkline Chart</a></li>
<li><a href="chart-knob.html">Jquery Knob</a></li>
</ul>
</li>
<li>
<a href="javascript: void(0);">
<i class="fe-disc"></i>
<span class="badge badge-warning badge-pill float-right">12</span>
<span> Forms </span>
</a>
<ul class="nav-second-level" aria-expanded="false">
<li><a href="form-elements.html">Form Elements</a></li>
<li><a href="form-advanced.html">Form Advanced</a></li>
<li><a href="form-layouts.html">Form Layouts</a></li>
<li><a href="form-validation.html">Form Validation</a></li>
<li><a href="form-pickers.html">Form Pickers</a></li>
<li><a href="form-wizard.html">Form Wizard</a></li>
<li><a href="form-mask.html">Form Masks</a></li>
<li><a href="form-summernote.html">Summernote</a></li>
<li><a href="form-quilljs.html">Quilljs Editor</a></li>
<li><a href="form-typeahead.html">Typeahead</a></li>
<li><a href="form-x-editable.html">X Editable</a></li>
<li><a href="form-uploads.html">Multiple File Upload</a></li>
</ul>
</li>
<li>
<a href="javascript: void(0);">
<i class="fe-layout"></i>
<span> Tables </span>
<span class="menu-arrow"></span>
</a>
<ul class="nav-second-level" aria-expanded="false">
<li><a href="tables-basic.html">Basic Tables</a></li>
<li><a href="tables-layouts.html">Tables Layouts</a></li>
<li><a href="tables-datatable.html">Data Tables</a></li>
<li><a href="tables-foo-tables.html">Foo Tables</a></li>
<li><a href="tables-responsive.html">Responsive Table</a></li>
<li><a href="tables-tablesaw.html">Tablesaw Tables</a></li>
<li><a href="tables-editable.html">Editable Tables</a></li>
</ul>
</li>
<li>
<a href="javascript: void(0);">
<i class="fe-map"></i>
<span> Maps </span>
<span class="menu-arrow"></span>
</a>
<ul class="nav-second-level" aria-expanded="false">
<li><a href="maps-google.html">Google Maps</a></li>
<li><a href="maps-vector.html">Vector Maps</a></li>
<li><a href="maps-mapael.html">Mapael Maps</a></li>
</ul>
</li>
<li>
<a href="javascript: void(0);">
<i class="fe-folder-plus"></i>
<span> Multi Level </span>
<span class="menu-arrow"></span>
</a>
<ul class="nav-second-level nav" aria-expanded="false">
<li>
<a href="javascript: void(0);">Level 1.1</a>
</li>
<li>
<a href="javascript: void(0);" aria-expanded="false">Level 1.2
<span class="menu-arrow"></span>
</a>
<ul class="nav-third-level nav" aria-expanded="false">
<li>
<a href="javascript: void(0);">Level 2.1</a>
</li>
<li>
<a href="javascript: void(0);">Level 2.2</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
<!-- End Sidebar -->
<div class="clearfix"></div>
</div>
<!-- Sidebar -left -->
</div>
<!-- Left Sidebar End -->
<!-- ============================================================== -->
<!-- Start Page Content here -->
<!-- ============================================================== -->
<div class="content-page">
<div class="content">
<!-- Start Content-->
<div class="container-fluid">
<!-- start page title -->
<div class="row">
<div class="col-12">
<div class="page-title-box">
<div class="page-title-right">
<ol class="breadcrumb m-0">
<li class="breadcrumb-item"><a href="javascript: void(0);">Adminox</a></li>
<li class="breadcrumb-item active">Taskboard</li>
</ol>
</div>
<h4 class="page-title">Taskboard</h4>
</div>
</div>
</div>
<!-- end page title -->
<div class="row">
<div class="col-lg-4">
<div class="card-box">
<h4 class="text-dark header-title">Upcoming</h4>
<p class="sub-header">
Your awesome text goes here.
</p>
<ul class="sortable-list taskList list-unstyled" id="upcoming">
<li class="bg-soft-warning" id="task1">
<div class="checkbox checkbox-primary checkbox-single float-right">
<input type="checkbox" aria-label="Single checkbox Two">
<label></label>
</div>
When an unknown printer took a galley of type and scrambled it to make a type specimen book.
<div class="clearfix"></div>
<div class="mt-3">
<p class="float-right mb-0 mt-1">
<button type="button" class="btn btn-success btn-xs waves-effect waves-light" data-toggle="modal" data-target="#task-detail-modal">View</button>
</p>
<p class="mb-0"><a href="" class="text-muted"><img src="assets/images/users/avatar-1.jpg" alt="task-user" class="avatar-sm rounded-circle mr-2"> <span class="font-weight-medium font-secondary">Petey Cruiser</span></a> </p>
</div>
</li>
<li class="bg-soft-success" id="task2">
<div class="checkbox checkbox-primary checkbox-single float-right">
<input type="checkbox" aria-label="Single checkbox Two">
<label></label>
</div>
Many desktop publishing packages and web page editors now use Lorem.
<div class="clearfix"></div>
<div class="mt-3">
<p class="float-right mb-0 mt-1">
<button type="button" class="btn btn-success btn-xs waves-effect waves-light" data-toggle="modal" data-target="#task-detail-modal">View</button>
</p>
<p class="mb-0"><a href="" class="text-muted"><img src="assets/images/users/avatar-2.jpg" alt="task-user" class="avatar-sm rounded-circle mr-2"> <span class="font-weight-medium font-secondary">Anna Sthesia</span></a> </p>
</div>
</li>
<li id="task3">
<div class="checkbox checkbox-primary checkbox-single float-right">
<input type="checkbox" aria-label="Single checkbox Two">
<label></label>
</div>
If you are going to use a passage of Lorem Ipsum..
<div class="clearfix"></div>
<div class="mt-3">
<p class="float-right mb-0 mt-1">
<button type="button" class="btn btn-success btn-xs waves-effect waves-light" data-toggle="modal" data-target="#task-detail-modal">View</button>
</p>
<p class="mb-0"><a href="" class="text-muted"><img src="assets/images/users/avatar-3.jpg" alt="task-user" class="avatar-sm rounded-circle mr-2"> <span class="font-weight-medium font-secondary">Gail Forcewind</span></a> </p>
</div>
</li>
<li class="bg-soft-info" id="task4">
<div class="checkbox checkbox-primary checkbox-single float-right">
<input type="checkbox" aria-label="Single checkbox Two">
<label></label>
</div>
It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old.
<div class="clearfix"></div>
<div class="mt-3">
<p class="float-right mb-0 mt-1">
<button type="button" class="btn btn-success btn-xs waves-effect waves-light" data-toggle="modal" data-target="#task-detail-modal">View</button>
</p>
<p class="mb-0"><a href="" class="text-muted"><img src="assets/images/users/avatar-4.jpg" alt="task-user" class="avatar-sm rounded-circle mr-2"> <span class="font-weight-medium font-secondary">Maya Didas</span></a> </p>
</div>
</li>
<li class="bg-soft-danger" id="task5">
<div class="checkbox checkbox-primary checkbox-single float-right">
<input type="checkbox" aria-label="Single checkbox Two">
<label></label>
</div>
There are many variations of passages of Lorem Ipsum available.
<div class="clearfix"></div>
<div class="mt-3">
<p class="float-right mb-0 mt-1">
<button type="button" class="btn btn-success btn-xs waves-effect waves-light" data-toggle="modal" data-target="#task-detail-modal">View</button>
</p>
<p class="mb-0"><a href="" class="text-muted"><img src="assets/images/users/avatar-5.jpg" alt="task-user" class="avatar-sm rounded-circle mr-2"> <span class="font-weight-medium font-secondary">Rick O'Shea</span></a> </p>
</div>
</li>
</ul>
<a href="#" class="btn btn-secondary btn-block mt-3 waves-effect waves-light">Add New</a>
</div>
</div>
<div class="col-lg-4">
<div class="card-box">
<h4 class="text-dark header-title">In Progress</h4>
<p class="sub-header">
Your awesome text goes here.
</p>
<ul class="sortable-list taskList list-unstyled" id="inprogress">
<li id="task9">
<div class="checkbox checkbox-primary checkbox-single float-right">
<input type="checkbox" aria-label="Single checkbox Two">
<label></label>
</div>
If you are going to use a passage of Lorem Ipsum..
<div class="clearfix"></div>
<div class="mt-3">
<p class="float-right mb-0 mt-1">
<button type="button" class="btn btn-success btn-xs waves-effect waves-light" data-toggle="modal" data-target="#task-detail-modal">View</button>
</p>
<p class="mb-0"><a href="" class="text-muted"><img src="assets/images/users/avatar-3.jpg" alt="task-user" class="avatar-sm rounded-circle mr-2"> <span class="font-weight-medium font-secondary">Gail Forcewind</span></a> </p>
</div>
</li>
<li class="bg-soft-info" id="task10">
<div class="checkbox checkbox-primary checkbox-single float-right">
<input type="checkbox" aria-label="Single checkbox Two">
<label></label>
</div>
It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old.
<div class="clearfix"></div>
<div class="mt-3">
<p class="float-right mb-0 mt-1">
<button type="button" class="btn btn-success btn-xs waves-effect waves-light" data-toggle="modal" data-target="#task-detail-modal">View</button>
</p>
<p class="mb-0"><a href="" class="text-muted"><img src="assets/images/users/avatar-4.jpg" alt="task-user" class="avatar-sm rounded-circle mr-2"> <span class="font-weight-medium font-secondary">Maya Didas</span></a> </p>
</div>
</li>
<li class="bg-soft-danger" id="task11">
<div class="checkbox checkbox-primary checkbox-single float-right">
<input type="checkbox" aria-label="Single checkbox Two">
<label></label>
</div>
There are many variations of passages of Lorem Ipsum available.
<div class="clearfix"></div>
<div class="mt-3">
<p class="float-right mb-0 mt-1">
<button type="button" class="btn btn-success btn-xs waves-effect waves-light" data-toggle="modal" data-target="#task-detail-modal">View</button>
</p>
<p class="mb-0"><a href="" class="text-muted"><img src="assets/images/users/avatar-5.jpg" alt="task-user" class="avatar-sm rounded-circle mr-2"> <span class="font-weight-medium font-secondary">Rick O'Shea</span></a> </p>
</div>
</li>
<li class="bg-soft-warning" id="task7">
<div class="checkbox checkbox-primary checkbox-single float-right">
<input type="checkbox" aria-label="Single checkbox Two">
<label></label>
</div>
When an unknown printer took a galley of type and scrambled it to make a type specimen book.
<div class="clearfix"></div>
<div class="mt-3">
<p class="float-right mb-0 mt-1">
<button type="button" class="btn btn-success btn-xs waves-effect waves-light" data-toggle="modal" data-target="#task-detail-modal">View</button>
</p>
<p class="mb-0"><a href="" class="text-muted"><img src="assets/images/users/avatar-1.jpg" alt="task-user" class="avatar-sm rounded-circle mr-2"> <span class="font-weight-medium font-secondary">Petey Cruiser</span></a> </p>
</div>
</li>
</ul>
<a href="#" class="btn btn-secondary btn-block mt-3 waves-effect waves-light">Add New</a>
</div>
</div>
<div class="col-lg-4">
<div class="card-box">
<h4 class="text-dark header-title">Completed</h4>
<p class="sub-header">
Your awesome text goes here.
</p>
<ul class="sortable-list taskList list-unstyled" id="completed">
<li class="bg-soft-warning" id="task14">
<div class="checkbox checkbox-primary checkbox-single float-right">
<input type="checkbox" aria-label="Single checkbox Two">
<label></label>
</div>
When an unknown printer took a galley of type and scrambled it to make a type specimen book.
<div class="clearfix"></div>
<div class="mt-3">
<p class="float-right mb-0 mt-1">
<button type="button" class="btn btn-success btn-xs waves-effect waves-light" data-toggle="modal" data-target="#task-detail-modal">View</button>
</p>
<p class="mb-0"><a href="" class="text-muted"><img src="assets/images/users/avatar-1.jpg" alt="task-user" class="avatar-sm rounded-circle mr-2"> <span class="font-weight-medium font-secondary">Petey Cruiser</span></a> </p>
</div>
</li>
<li class="bg-soft-success" id="task15">
<div class="checkbox checkbox-primary checkbox-single float-right">
<input type="checkbox" aria-label="Single checkbox Two">
<label></label>
</div>
Many desktop publishing packages and web page editors now use Lorem.
<div class="clearfix"></div>
<div class="mt-3">
<p class="float-right mb-0 mt-1">
<button type="button" class="btn btn-success btn-xs waves-effect waves-light" data-toggle="modal" data-target="#task-detail-modal">View</button>
</p>
<p class="mb-0"><a href="" class="text-muted"><img src="assets/images/users/avatar-2.jpg" alt="task-user" class="avatar-sm rounded-circle mr-2"> <span class="font-weight-medium font-secondary">Anna Sthesia</span></a> </p>
</div>
</li>
<li id="task16">
<div class="checkbox checkbox-primary checkbox-single float-right">
<input type="checkbox" aria-label="Single checkbox Two">
<label></label>
</div>
If you are going to use a passage of Lorem Ipsum..
<div class="clearfix"></div>
<div class="mt-3">
<p class="float-right mb-0 mt-1">
<button type="button" class="btn btn-success btn-xs waves-effect waves-light" data-toggle="modal" data-target="#task-detail-modal">View</button>
</p>
<p class="mb-0"><a href="" class="text-muted"><img src="assets/images/users/avatar-3.jpg" alt="task-user" class="avatar-sm rounded-circle mr-2"> <span class="font-weight-medium font-secondary">Gail Forcewind</span></a> </p>
</div>
</li>
<li class="bg-soft-info" id="task17">
<div class="checkbox checkbox-primary checkbox-single float-right">
<input type="checkbox" aria-label="Single checkbox Two">
<label></label>
</div>
It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old.
<div class="clearfix"></div>
<div class="mt-3">
<p class="float-right mb-0 mt-1">
<button type="button" class="btn btn-success btn-xs waves-effect waves-light" data-toggle="modal" data-target="#task-detail-modal">View</button>
</p>
<p class="mb-0"><a href="" class="text-muted"><img src="assets/images/users/avatar-4.jpg" alt="task-user" class="avatar-sm rounded-circle mr-2"> <span class="font-weight-medium font-secondary">Maya Didas</span></a> </p>
</div>
</li>
<li class="bg-soft-danger" id="task18">
<div class="checkbox checkbox-primary checkbox-single float-right">
<input type="checkbox" aria-label="Single checkbox Two">
<label></label>
</div>
There are many variations of passages of Lorem Ipsum available.
<div class="clearfix"></div>
<div class="mt-3">
<p class="float-right mb-0 mt-1">
<button type="button" class="btn btn-success btn-xs waves-effect waves-light" data-toggle="modal" data-target="#task-detail-modal">View</button>
</p>
<p class="mb-0"><a href="" class="text-muted"><img src="assets/images/users/avatar-5.jpg" alt="task-user" class="avatar-sm rounded-circle mr-2"> <span class="font-weight-medium font-secondary">Rick O'Shea</span></a> </p>
</div>
</li>
</ul>
<a href="#" class="btn btn-secondary btn-block mt-3 waves-effect waves-light">Add New</a>
</div>
</div>
</div>
<!-- end row -->
<!-- Modal -->
<div id="task-detail-modal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true" style="display: none;">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header border-bottom-0 p-0">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="modal-body">
<div class="p-2 task-detail">
<div class="media mb-3">
<img class="d-flex mr-3 rounded-circle" src="assets/images/users/avatar-2.jpg" alt="Generic placeholder image" height="48">
<div class="media-body">
<h5 class="media-heading mb-1 mt-0">Michael Zenaty</h5>
<span class="badge badge-danger">Urgent</span>
</div>
</div>
<h4 class="mb-4">Code HTML email template for welcome email</h4>
<p class="text-muted">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptates, illo, iste
itaque voluptas corrupti ratione reprehenderit magni similique? Tempore, quos
delectus asperiores libero voluptas quod perferendis! Voluptate, quod illo
rerum? Lorem ipsum dolor sit amet.
</p>
<ul class="list-inline task-dates mb-0 mt-4">
<li>
<h5 class="mb-1">Start Date</h5>
<p> 22 March 2017 <small class="text-muted">1:00 PM</small></p>
</li>
<li>
<h5 class="mb-1">Due Date</h5>
<p> 17 April 2017 <small class="text-muted">12:00 PM</small></p>
</li>
</ul>
<div class="clearfix"></div>
<div class="task-tags mt-4">
<h5 class="">Tags</h5>
<input type="text" value="Amsterdam,Washington,Sydney" data-role="tagsinput" placeholder="add tags"/>
</div>
<div class="assign-team mt-4">
<h5 class="mb-1">Followers</h5>
<div>
<a href="#"> <img class="rounded-circle avatar-sm" alt="64x64" src="assets/images/users/avatar-2.jpg"> </a>
<a href="#"> <img class="rounded-circle avatar-sm" alt="64x64" src="assets/images/users/avatar-3.jpg"> </a>
<a href="#"> <img class="rounded-circle avatar-sm" alt="64x64" src="assets/images/users/avatar-5.jpg"> </a>
<a href="#"> <img class="rounded-circle avatar-sm" alt="64x64" src="assets/images/users/avatar-8.jpg"> </a>
</div>
</div>
<div class="attached-files mt-4">
<h5 class="">Attached Files </h5>
<div class="files-list">
<div class="file-box">
<a href=""><img src="assets/images/attached-files/img-1.jpg" class="img-fluid img-thumbnail" alt="attached-img"></a>
<p class="font-13 mb-1 text-muted"><small>File one</small></p>
</div>
<div class="file-box">
<a href=""><img src="assets/images/attached-files/img-2.jpg" class="img-fluid img-thumbnail" alt="attached-img"></a>
<p class="font-13 mb-1 text-muted"><small>Attached-2</small></p>
</div>
<div class="file-box">
<a href=""><img src="assets/images/attached-files/img-3.png" class="img-fluid img-thumbnail" alt="attached-img"></a>
<p class="font-13 mb-1 text-muted"><small>Dribbble shot</small></p>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-success waves-effect waves-light">Save Changes</button>
<button type="button" class="btn btn-secondary waves-effect" data-dismiss="modal">Cancel</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</div> <!-- end container-fluid -->
</div> <!-- end content -->
<!-- Footer Start -->
<footer class="footer">
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
2017 - 2019 &copy; Adminox theme by <a href="">Coderthemes</a>
</div>
</div>
</div>
</footer>
<!-- end Footer -->
</div>
<!-- ============================================================== -->
<!-- End Page content -->
<!-- ============================================================== -->
</div>
<!-- END wrapper -->
<!-- Right Sidebar -->
<div class="right-bar">
<div class="rightbar-title">
<a href="javascript:void(0);" class="right-bar-toggle float-right">
<i class="mdi mdi-close"></i>
</a>
<h4 class="font-16 m-0 text-white">Theme Customizer</h4>
</div>
<div class="slimscroll-menu">
<div class="p-3">
<div class="alert alert-warning" role="alert">
<strong>Customize </strong> the overall color scheme, layout, etc.
</div>
<div class="mb-2">
<img src="assets/images/layouts/light.png" class="img-fluid img-thumbnail" alt="">
</div>
<div class="custom-control custom-switch mb-3">
<input type="checkbox" class="custom-control-input theme-choice" id="light-mode-switch" checked />
<label class="custom-control-label" for="light-mode-switch">Light Mode</label>
</div>
<div class="mb-2">
<img src="assets/images/layouts/dark.png" class="img-fluid img-thumbnail" alt="">
</div>
<div class="custom-control custom-switch mb-3">
<input type="checkbox" class="custom-control-input theme-choice" id="dark-mode-switch" data-bsStyle="assets/css/bootstrap-dark.min.css"
data-appStyle="assets/css/app-dark.min.css" />
<label class="custom-control-label" for="dark-mode-switch">Dark Mode</label>
</div>
<div class="mb-2">
<img src="assets/images/layouts/rtl.png" class="img-fluid img-thumbnail" alt="">
</div>
<div class="custom-control custom-switch mb-3">
<input type="checkbox" class="custom-control-input theme-choice" id="rtl-mode-switch" data-appStyle="assets/css/app-rtl.min.css" />
<label class="custom-control-label" for="rtl-mode-switch">RTL Mode</label>
</div>
<div class="mb-2">
<img src="assets/images/layouts/dark-rtl.png" class="img-fluid img-thumbnail" alt="">
</div>
<div class="custom-control custom-switch mb-5">
<input type="checkbox" class="custom-control-input theme-choice" id="dark-rtl-mode-switch" data-bsStyle="assets/css/bootstrap-dark.min.css"
data-appStyle="assets/css/app-dark-rtl.min.css" />
<label class="custom-control-label" for="dark-rtl-mode-switch">Dark RTL Mode</label>
</div>
<a href="https://1.envato.market/y2YAD" class="btn btn-danger btn-block mt-3" target="_blank"><i class="mdi mdi-download mr-1"></i> Download Now</a>
</div>
</div> <!-- end slimscroll-menu-->
</div>
<!-- /Right-bar -->
<!-- Right bar overlay-->
<div class="rightbar-overlay"></div>
<a href="javascript:void(0);" class="right-bar-toggle demos-show-btn">
<i class="mdi mdi-settings-outline mdi-spin"></i> &nbsp;Choose Demos
</a>
<!-- Vendor js -->
<script src="assets/js/vendor.min.js"></script>
<script src="assets/libs/bootstrap-tagsinput/bootstrap-tagsinput.min.js"></script>
<script src="assets/libs/jquery-ui/jquery-ui.min.js"></script>
<!-- Tickets js -->
<script src="assets/js/pages/taskboard.init.js"></script>
<!-- App js -->
<script src="assets/js/app.min.js"></script>
</body>
</html>