Files

566 lines
31 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>
<head>
<meta charset="utf-8">
<title>Dashboard 02</title>
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<meta name="theme-color" content="#fff">
<meta name="format-detection" content="telephone=no">
<meta name="description" content="Page description"><!-- Twitter Card data-->
<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="@publisher_handle">
<meta name="twitter:title" content="Page Title">
<meta name="twitter:description" content="Page description less than 200 characters">
<meta name="twitter:creator" content="@author_handle">
<meta name="twitter:image" content="http://www.example.com/image.jpg"><!-- Open Graph data-->
<meta property="og:title" content="Title Here">
<meta property="og:type" content="article">
<meta property="og:url" content="http://www.example.com/">
<meta property="og:image" content="http://example.com/image.jpg">
<meta property="og:description" content="Description Here">
<meta property="og:site_name" content="Site Name, i.e. Moz">
<meta property="fb:admins" content="Facebook numeric ID">
<link href="https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&amp;display=swap" rel="stylesheet">
<link rel="stylesheet" media="all" href="css/app.css"><!-- favicon-->
<link rel="apple-touch-icon" sizes="180x180" href="img/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="img/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="img/favicon-16x16.png">
<link rel="manifest" href="img/site.webmanifest">
<link rel="mask-icon" href="img/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#da532c">
</head>
<body>
<!-- page-->
<div class="page">
<!-- sidebar-->
<div class="sidebar js-sidebar">
<div class="sidebar__nav">
<!-- nav-->
<nav class="nav js-nav"><a class="nav__link nav__link_head" href="/">
<div class="nav__preview"><img class="nav__pic" src="img/logo.svg" alt="Logo"></div>
<div class="nav__title"><img class="nav__pic" src="img/betaCRM.svg" alt="betaCRM"></div>
</a>
<div class="nav__list">
<!-- mobile primary menu-->
<div class="nav__primary js-nav-primary">
<div class="nav__group"><a class="nav__link active" href="#" title="Dashboard">
<div class="nav__preview"><i class="la la-tachometer-alt "></i></div>
<div class="nav__title">Dashboard</div>
</a><a class="nav__link" href="#" title="Projects">
<div class="nav__preview"><i class="la la-toolbox "></i></div>
<div class="nav__title">Projects</div>
</a><a class="nav__link" href="#" title="Tasks">
<div class="nav__preview"><i class="la la-clipboard-check "></i></div>
<div class="nav__title">Tasks</div>
</a><a class="nav__link" href="#" title="Kanban">
<div class="nav__preview"><i class="la la-images "></i></div>
<div class="nav__title">Kanban</div>
</a><a class="nav__link" href="#" title="Calendar">
<div class="nav__preview"><i class="la la-calendar-week "></i></div>
<div class="nav__title">Calendar</div>
</a><a class="nav__link nav__link_menu js-nav-link-menu" href="#">
<div class="nav__preview"><i class="la la-bars "></i></div>
</a></div>
</div><!-- mobile secondary menu-->
<div class="nav__secondary js-nav-secondary">
<div class="nav__group"><a class="nav__link" href="#" title="Contacts">
<div class="nav__preview"><i class="la la-user-lock "></i></div>
<div class="nav__title">Contacts</div>
</a><a class="nav__link" href="#" title="Messages">
<div class="nav__preview"><i class="la la-comments "></i>
<div class="nav__online online"></div>
</div>
<div class="nav__title">Messages</div>
</a><a class="nav__link" href="#" title="Products">
<div class="nav__preview"><i class="la la-cube "></i></div>
<div class="nav__title">Products</div>
</a><a class="nav__link" href="#" title="Invoices">
<div class="nav__preview"><i class="la la-calculator "></i></div>
<div class="nav__title">Invoices</div>
</a><a class="nav__link" href="#" title="File Browser">
<div class="nav__preview"><i class="la la-folder-open "></i></div>
<div class="nav__title">File Browser</div>
</a><a class="nav__link" href="#" title="Notifications">
<div class="nav__preview"><i class="la la-bullseye "></i>
<div class="nav__online online bg-red-raw"></div>
</div>
<div class="nav__title">Notifications</div>
</a><a class="nav__link" href="#" title="Reports">
<div class="nav__preview"><i class="la la-chart-area "></i></div>
<div class="nav__title">Reports</div>
</a><a class="nav__link" href="#" title="Help Center">
<div class="nav__preview"><i class="la la-question "></i></div>
<div class="nav__title">Help Center</div>
</a><a class="nav__link nav__link_user" href="#" title="John Doe">
<div class="nav__preview"><img class="nav__pic" src="img/user-1.jpg" alt="User">
<div class="nav__online online"></div>
</div>
<div class="nav__title">John Doe</div>
</a></div>
</div>
</div>
</nav>
</div>
<div class="sidebar__container js-sidebar-container">
<div class="sidebar__head">
<div class="sidebar__preview"><img class="sidebar__pic" src="img/white-ui-store.png" alt="WhiteUI.store"></div>
<div class="sidebar__wrap">
<div class="sidebar__title">WHITEUI.STORE LLC</div>
<div class="sidebar__text">8484 Ross Wells</div>
</div><button class="sidebar__action sidebar__action_toggle action js-sidebar-toggle"><i class="la la-angle-left "></i></button>
</div>
<div class="sidebar__inner">
<div class="sidebar__section">
<!-- widget-->
<div class="widget">
<div class="widget__head">
<div class="widget__title title title_sm">Upcoming events</div>
<div class="widget__text">Don’t miss scheduled events</div>
</div>
<div class="widget__body">
<!-- events-->
<div class="events">
<div class="events__list">
<div class="events__item">
<div class="events__head">
<div class="events__circle"></div><a class="events__time" href="#">05:48AM</a>
</div>
<div class="events__name">Meeting with a client</div>
<div class="events__text">Tell how to boost website traffic</div><button class="events__action"><i class="la la-ellipsis-h "></i></button>
</div>
<div class="events__item">
<div class="events__head">
<div class="events__circle yellow"></div><a class="events__time" href="#">10:28AM</a>
</div>
<div class="events__name">New project discussion</div>
<div class="events__text">Business Cards Does Your Business </div><button class="events__action"><i class="la la-ellipsis-h "></i></button>
</div>
<div class="events__item">
<div class="events__head">
<div class="events__circle green"></div><a class="events__time" href="#">07:58PM</a>
</div>
<div class="events__name">Financial data overview</div>
<div class="events__text">What Makes Flyers Unrivaled</div><button class="events__action"><i class="la la-ellipsis-h "></i></button>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="sidebar__section">
<div class="history">
<div class="history__container">
<div class="history__head">
<div class="history__wrap">
<div class="history__title title title_sm">Conversion history</div>
<div class="history__text">Week to week performance</div>
</div><a class="history__link" href="#"><i class="la la-chart-bar "></i></a>
</div>
<div class="history__chart">
<div id="chart-history-bar"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div><!-- container-->
<div class="container js-container">
<div class="container__head"><button class="container__action container__action_menu action js-container-toggle"><i class="la la-bars "></i></button>
<div class="container__title title title_md">Dashboard</div><!-- search-->
<div class="container__search search js-search"><button class="search__action action js-search-open"><i class="la la-search "></i></button>
<div class="search__dropdown js-search-dropdown">
<div class="search__field"><input class="search__input js-search-input" type="search" placeholder="Start typing…">
<div class="search__icon"><i class="la la-search "></i></div>
</div>
<div class="search__results js-search-results"><a class="search__result" href="#">
<div class="search__cell">
<div class="search__preview color-red"><i class="lab la-dribbble "></i></div>
</div>
<div class="search__cell">
<div class="search__title">Dribble Redesign</div>
<div class="search__text">Webdesign</div>
</div>
<div class="search__cell mobile-hide">
<!-- tag-->
<div class="search__tag tag gray">24 Feb 2019</div>
</div>
</a><a class="search__result" href="#">
<div class="search__cell">
<div class="search__preview color-green"><i class="lab la-evernote "></i></div>
</div>
<div class="search__cell">
<div class="search__title">New HTML Theme</div>
<div class="search__text">Theme</div>
</div>
<div class="search__cell mobile-hide">
<!-- tag-->
<div class="search__tag tag gray">20 May 2019</div>
</div>
</a><a class="search__result" href="#">
<div class="search__cell">
<div class="search__preview"><img class="search__pic" src="img/user-1.jpg" alt="User"></div>
</div>
<div class="search__cell">
<div class="search__title">Bradley Wilkins</div>
<div class="search__text">[email protected]</div>
</div>
<div class="search__cell mobile-hide">
<!-- tag-->
<div class="search__tag tag gray">Designer</div>
</div>
</a></div>
</div>
<div class="search__backdrop backdrop js-search-backdrop"></div>
</div><!-- new-->
<div class="container__new new js-new"><button class="new__action action js-new-open"><i class="la la-plus-circle "></i></button>
<div class="new__dropdown js-new-dropdown"><a class="new__item" href="#">
<div class="new__icon"><i class="la la-toolbox "></i></div>
<div class="new__title">New Project</div>
</a><a class="new__item" href="#">
<div class="new__icon"><i class="la la-clipboard-check "></i></div>
<div class="new__title">New Task</div>
</a><a class="new__item" href="#">
<div class="new__icon"><i class="la la-user-lock "></i></div>
<div class="new__title">New Contact</div>
</a><a class="new__item" href="#">
<div class="new__icon"><i class="la la-calendar-week "></i></div>
<div class="new__title">New Event</div>
</a><a class="new__item" href="#">
<div class="new__icon"><i class="la la-cube "></i></div>
<div class="new__title">New Product</div>
</a><a class="new__item" href="#">
<div class="new__icon"><i class="la la-calculator "></i></div>
<div class="new__title">New Invoice</div>
</a></div>
<div class="new__backdrop backdrop js-new-backdrop"></div>
</div>
</div>
<div class="container__body">
<!-- overview-->
<div class="overview overview_line">
<div class="overview__item">
<div class="overview__row">
<div class="overview__col">
<div class="overview__label">Income per lead</div>
<div class="overview__value">$1.870</div>
</div>
<div class="overview__col">
<div class="overview__chart">
<div id="spark-1"></div>
</div>
</div>
</div>
</div>
<div class="overview__item">
<div class="overview__row">
<div class="overview__col">
<div class="overview__label">New leads</div>
<div class="overview__value">2.890</div>
</div>
<div class="overview__col">
<div class="overview__chart">
<div id="spark-2"></div>
</div>
</div>
</div>
</div>
<div class="overview__item">
<div class="overview__row">
<div class="overview__col">
<div class="overview__label">Conversion rate</div>
<div class="overview__value">15.10%</div>
</div>
<div class="overview__col">
<div class="overview__chart">
<div id="spark-3"></div>
</div>
</div>
</div>
</div>
</div><!-- layout-->
<div class="layout js-layout">
<div class="layout__tabs"><button class="layout__action action action_title js-layout-action active">Orders</button><button class="layout__action action action_title js-layout-action">Invoices</button></div>
<div class="layout__row">
<!-- panel-->
<div class="layout__panel layout__panel_tab panel js-layout-tab visible">
<div class="panel__head mobile-hide">
<div class="panel__group">
<div class="panel__title title">Orders</div>
</div><!-- action group-->
<div class="panel__group action-group"><button class="action action_title active">Day</button><button class="action action_title">Week</button><button class="action action_title">Month</button><button class="action"><i class="la la-calendar-week "></i></button></div>
</div>
<div class="panel__body">
<!-- grid-->
<div class="grid">
<div class="grid__table">
<div class="grid__head">
<div class="grid__row">
<div class="grid__cell">Product</div>
<div class="grid__cell text-right">Details</div>
</div>
</div>
<div class="grid__body">
<div class="grid__row">
<div class="grid__cell">
<div class="grid__flex">
<div class="grid__preview"><img class="grid__pic" src="img/product-1.jpg" alt="Product"></div>
<div class="grid__wrap">
<div class="grid__bold">Macbook Pro 2013, 16 GB, 256 GB SSD</div>
<div class="grid__text">4574 Bashirian Creek Suite 631</div>
</div>
</div>
</div>
<div class="grid__cell text-right">
<div class="grid__bold">$118.00</div>
<div class="grid__bold color-green">Shipped</div>
</div>
</div>
<div class="grid__row">
<div class="grid__cell">
<div class="grid__flex">
<div class="grid__preview"><img class="grid__pic" src="img/product-2.jpg" alt="Product"></div>
<div class="grid__wrap">
<div class="grid__bold">Dell XPS, 16 GB, 512 GB SSD, 1050 TI</div>
<div class="grid__text">8874 Candelario Valleys</div>
</div>
</div>
</div>
<div class="grid__cell text-right">
<div class="grid__bold">$208.00</div>
<div class="grid__bold color-yellow">Processing</div>
</div>
</div>
<div class="grid__row">
<div class="grid__cell">
<div class="grid__flex">
<div class="grid__preview"><img class="grid__pic" src="img/product-3.jpg" alt="Product"></div>
<div class="grid__wrap">
<div class="grid__bold">Macbook Air 2013, 4GB, 128 GB SSD</div>
<div class="grid__text">6124 Flossie Station</div>
</div>
</div>
</div>
<div class="grid__cell text-right">
<div class="grid__bold">$118.00</div>
<div class="grid__bold color-yellow">Processing</div>
</div>
</div>
<div class="grid__row">
<div class="grid__cell">
<div class="grid__flex">
<div class="grid__preview"><img class="grid__pic" src="img/product-4.jpg" alt="Product"></div>
<div class="grid__wrap">
<div class="grid__bold">Macbook, 4GB, 128 GB SSD</div>
<div class="grid__text">1910 Erdman Station Apt. 696</div>
</div>
</div>
</div>
<div class="grid__cell text-right">
<div class="grid__bold">$578.00</div>
<div class="grid__bold color-green">Shipped</div>
</div>
</div>
<div class="grid__row">
<div class="grid__cell">
<div class="grid__flex">
<div class="grid__preview"><img class="grid__pic" src="img/product-5.jpg" alt="Product"></div>
<div class="grid__wrap">
<div class="grid__bold">LG Laptop, 8 GB, 256 GB SSD</div>
<div class="grid__text">586 Bernhard Landing Suite 706</div>
</div>
</div>
</div>
<div class="grid__cell text-right">
<div class="grid__bold">$374.00</div>
<div class="grid__bold color-red">Cancelled</div>
</div>
</div>
<div class="grid__row">
<div class="grid__cell">
<div class="grid__flex">
<div class="grid__preview"><img class="grid__pic" src="img/product-6.jpg" alt="Product"></div>
<div class="grid__wrap">
<div class="grid__bold">Macbook Pro 2016, 16 GB, 512 GB SSD</div>
<div class="grid__text">201 Bosco Coves</div>
</div>
</div>
</div>
<div class="grid__cell text-right">
<div class="grid__bold">$220.00</div>
<div class="grid__bold color-green">Shipped</div>
</div>
</div>
<div class="grid__row">
<div class="grid__cell">
<div class="grid__flex">
<div class="grid__preview"><img class="grid__pic" src="img/product-7.jpg" alt="Product"></div>
<div class="grid__wrap">
<div class="grid__bold">Macbook Pro 2018, 32 GB, 1 TB SSD</div>
<div class="grid__text">9823 Crist Brooks Suite 116</div>
</div>
</div>
</div>
<div class="grid__cell text-right">
<div class="grid__bold">$698.00</div>
<div class="grid__bold color-green">Shipped</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="panel__foot"><a class="panel__btn btn" href="#">All Orders</a>
<div class="panel__text">2.480 Total Orders</div>
</div>
</div><!-- panel-->
<div class="layout__panel layout__panel_tab panel js-layout-tab">
<div class="panel__head mobile-hide">
<div class="panel__group">
<div class="panel__title title">Invoices</div>
</div><!-- action group-->
<div class="panel__group action-group"><button class="action action_title active">Day</button><button class="action action_title">Week</button><button class="action action_title">Month</button></div>
</div>
<div class="panel__body">
<!-- grid-->
<div class="grid">
<div class="grid__table">
<div class="grid__head">
<div class="grid__row">
<div class="grid__cell">Number</div>
<div class="grid__cell text-right">Details</div>
</div>
</div>
<div class="grid__body">
<div class="grid__row">
<div class="grid__cell">
<div class="grid__flex">
<div class="grid__preview"><i class="la la-calculator "></i></div>
<div class="grid__wrap">
<div class="grid__bold">Invoice #AA-04-19-1890678</div>
<div class="grid__text">New Madieton LLC.</div>
</div>
</div>
</div>
<div class="grid__cell text-right">
<div class="grid__bold">$118.00</div>
<div class="grid__bold color-green">Paid</div>
</div>
</div>
<div class="grid__row">
<div class="grid__cell">
<div class="grid__flex">
<div class="grid__preview"><i class="la la-calculator "></i></div>
<div class="grid__wrap">
<div class="grid__bold">Invoice #AA-04-19-1897890</div>
<div class="grid__text">Crystalton INC.</div>
</div>
</div>
</div>
<div class="grid__cell text-right">
<div class="grid__bold">$208.00</div>
<div class="grid__bold color-yellow">Processing</div>
</div>
</div>
<div class="grid__row">
<div class="grid__cell">
<div class="grid__flex">
<div class="grid__preview"><i class="la la-calculator "></i></div>
<div class="grid__wrap">
<div class="grid__bold">Invoice #AA-04-19-1890243</div>
<div class="grid__text">Tyriquemouth LLC.</div>
</div>
</div>
</div>
<div class="grid__cell text-right">
<div class="grid__bold">$118.00</div>
<div class="grid__bold color-yellow">Processing</div>
</div>
</div>
<div class="grid__row">
<div class="grid__cell">
<div class="grid__flex">
<div class="grid__preview"><i class="la la-calculator "></i></div>
<div class="grid__wrap">
<div class="grid__bold">Invoice #AA-04-19-1893481</div>
<div class="grid__text">Lethamouth LLC.</div>
</div>
</div>
</div>
<div class="grid__cell text-right">
<div class="grid__bold">$578.00</div>
<div class="grid__bold color-green">Paid</div>
</div>
</div>
<div class="grid__row">
<div class="grid__cell">
<div class="grid__flex">
<div class="grid__preview"><i class="la la-calculator "></i></div>
<div class="grid__wrap">
<div class="grid__bold">Invoice #AA-04-19-1823908</div>
<div class="grid__text">Kuvalisberg INC.</div>
</div>
</div>
</div>
<div class="grid__cell text-right">
<div class="grid__bold">$374.00</div>
<div class="grid__bold color-red">Cancelled</div>
</div>
</div>
<div class="grid__row">
<div class="grid__cell">
<div class="grid__flex">
<div class="grid__preview"><i class="la la-calculator "></i></div>
<div class="grid__wrap">
<div class="grid__bold">Invoice #AA-04-19-1890123</div>
<div class="grid__text">Paxtonchester LLC.</div>
</div>
</div>
</div>
<div class="grid__cell text-right">
<div class="grid__bold">$220.00</div>
<div class="grid__bold color-green">Paid</div>
</div>
</div>
<div class="grid__row">
<div class="grid__cell">
<div class="grid__flex">
<div class="grid__preview"><i class="la la-calculator "></i></div>
<div class="grid__wrap">
<div class="grid__bold">Invoice #AA-04-19-1890243</div>
<div class="grid__text">Tyriquemouth LLC.</div>
</div>
</div>
</div>
<div class="grid__cell text-right">
<div class="grid__bold">$698.00</div>
<div class="grid__bold color-green">Paid</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="panel__foot"><a class="panel__btn btn" href="#">All Orders</a>
<div class="panel__text">1.520 Total Invoices</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div><!-- modals-->
<!-- scripts-->
<script src="js/lib/jquery.min.js"></script>
<script src="js/lib/datepicker.min.js"></script>
<script src="js/lib/datepicker.en.js"></script>
<script src="js/lib/select2.min.js"></script>
<script src="js/lib/wNumb.min.js"></script>
<script src="js/lib/nouislider.min.js"></script>
<script src="js/lib/apexcharts.min.js"></script>
<script src="js/charts.js"></script>
<script src="js/app.js"></script>
</body>
</html>