doctype html
head
    meta(charset='utf-8')
    meta(http-equiv='X-UA-Compatible' content='IE=edge')
    meta(name='viewport' content='width=device-width, initial-scale=1, shrink-to-fit=no')
    meta(name='description' content='')
    meta(name='author' content='')
    title #{title ? title : 'Dashboard'}
    block styles
        // FIXME: replace this with a local copy
        link(href='https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i' rel='stylesheet')
        link(href=asset('dash/css/sb-admin-2.min.css') rel='stylesheet')
        link(href=asset('dash/vendor/fontawesome-free/css/all.min.css') rel='stylesheet' type='text/css')
        link(href=asset('dash/vendor/datatables2/dataTables.bootstrap4.min.css'))
        link(rel='stylesheet' href='https://unpkg.com/vue2-datepicker@latest/index.css')
        link(rel='stylesheet' data-name='vs/editor/editor.main' href=asset('monaco/package/min/vs/editor/editor.main.css'))
#wrapper
    ul#accordionSidebar.navbar-nav.bg-gradient-primary.sidebar.sidebar-dark.accordion
        a.sidebar-brand.d-flex.align-items-center.justify-content-center(href='index.html')
            .sidebar-brand-text.mx-3
                | #{config('app.name')}
        hr.sidebar-divider
        .sidebar-heading Website Content
        li.nav-item
            a.nav-link(href=route('dash/cobalt/listing/workItem'))
                i.fas.fa-fw.fa-briefcase
                span Work Timeline
        li.nav-item
            a.nav-link(href=route('dash/cobalt/listing/feedPost'))
                i.fas.fa-fw.fa-stream
                span Feed Posts
        li.nav-item
            a.nav-link(href=route('dash/cobalt/listing/goLink'))
                i.fas.fa-fw.fa-link
                span Go Links
        li.nav-item
            a.nav-link(href=route('dash/cobalt/listing/snippet'))
                i.fas.fa-fw.fa-code
                span Snippets

        hr.sidebar-divider
        .sidebar-heading Analytics
        li.nav-item
            a.nav-link(href=route('dash/cobalt/listing/contactSubmission'))
                i.fas.fa-fw.fa-comment-alt
                span Contact Form
            a.nav-link(href=route('dash/cobalt/listing/pageView'))
                i.fas.fa-fw.fa-chart-bar
                span Raw Page Views
    #content-wrapper.d-flex.flex-column
        #content
            nav.navbar.navbar-expand.navbar-light.bg-white.topbar.mb-4.static-top.shadow
                button#sidebarToggleTop.btn.btn-link.d-md-none.rounded-circle.mr-3
                    i.fa.fa-bars
                .d-none.d-sm-inline-block.form-inline.mr-auto.ml-md-3.my-2.my-md-0.mw-100
                    h1.h3.mb-0.text-gray-800 #{title ? title : 'Dashboard'}
                ul.navbar-nav.ml-auto
                    li.nav-item.dropdown.no-arrow.d-sm-none
                        a#searchDropdown.nav-link.dropdown-toggle(href='#' role='button' data-toggle='dropdown' aria-haspopup='true' aria-expanded='false')
                            i.fas.fa-search.fa-fw
                        .dropdown-menu.dropdown-menu-right.p-3.shadow.animated--grow-in(aria-labelledby='searchDropdown')
                            form.form-inline.mr-auto.w-100.navbar-search
                                .input-group
                                    input.form-control.bg-light.border-0.small(type='text' placeholder='Search for...' aria-label='Search' aria-describedby='basic-addon2')
                                    .input-group-append
                                        button.btn.btn-primary(type='button')
                                            i.fas.fa-search.fa-sm
                    li.nav-item.dropdown.no-arrow.mx-1
                        a#alertsDropdown.nav-link.dropdown-toggle(href='#' role='button' data-toggle='dropdown' aria-haspopup='true' aria-expanded='false')
                            i.fas.fa-bell.fa-fw
                            span.badge.badge-danger.badge-counter 3+
                        .dropdown-list.dropdown-menu.dropdown-menu-right.shadow.animated--grow-in(aria-labelledby='alertsDropdown')
                            h6.dropdown-header
                                | Alerts Center
                            a.dropdown-item.d-flex.align-items-center(href='#')
                                .mr-3
                                    .icon-circle.bg-primary
                                        i.fas.fa-file-alt.text-white
                                div
                                    .small.text-gray-500 December 12, 2019
                                    span.font-weight-bold A new monthly report is ready to download!
                            a.dropdown-item.d-flex.align-items-center(href='#')
                                .mr-3
                                    .icon-circle.bg-success
                                        i.fas.fa-donate.text-white
                                div
                                    .small.text-gray-500 December 7, 2019
                                    |                                         $290.29 has been deposited into your account!
                            a.dropdown-item.d-flex.align-items-center(href='#')
                                .mr-3
                                    .icon-circle.bg-warning
                                        i.fas.fa-exclamation-triangle.text-white
                                div
                                    .small.text-gray-500 December 2, 2019
                                    |                                         Spending Alert: We&apos;ve noticed unusually high spending for your account.
                            a.dropdown-item.text-center.small.text-gray-500(href='#') Show All Alerts
                    .topbar-divider.d-none.d-sm-block
                    li.nav-item.dropdown.no-arrow
                        a#userDropdown.nav-link.dropdown-toggle(href='#' role='button' data-toggle='dropdown' aria-haspopup='true' aria-expanded='false')
                            span.mr-2.d-none.d-lg-inline.text-gray-600.small #{user().getDisplay()}
                            if user().profileUrl
                                img.img-profile.rounded-circle(src=user().profileUrl)
                        .dropdown-menu.dropdown-menu-right.shadow.animated--grow-in(aria-labelledby='userDropdown')
                            //.dropdown-divider
                            a.dropdown-item(href='#' data-toggle='modal' data-target='#logoutModal')
                                i.fas.fa-sign-out-alt.fa-sm.fa-fw.mr-2.text-gray-400
                                | Logout
            .container-fluid#vue-wrapper
                cobalt-messages
                block content
        footer.sticky-footer.bg-white
            .container.my-auto
                .copyright.text-center.my-auto
                    span Copyright &copy; #{config('app.name')} #{(new Date).getFullYear()}
a.scroll-to-top.rounded(href='#page-top')
    i.fas.fa-angle-up
#logoutModal.modal.fade(tabindex='-1' role='dialog' aria-labelledby='exampleModalLabel' aria-hidden='true')
    .modal-dialog(role='document')
        .modal-content
            .modal-header
                h5#exampleModalLabel.modal-title Ready to Leave?
                button.close(type='button' data-dismiss='modal' aria-label='Close')
                    span(aria-hidden='true') &times;
            .modal-body Select &quot;Logout&quot; below if you are ready to end your current session.
            .modal-footer
                button.btn.btn-secondary(type='button' data-dismiss='modal') Cancel
                a.btn.btn-primary(href=named('@auth:coreid:logout')) Logout

block scripts
    script(src=asset('dash/vendor/jquery/jquery.min.js'))
    script(src=asset('dash/vendor/bootstrap/js/bootstrap.bundle.min.js'))
    script(src=asset('dash/vendor/jquery-easing/jquery.easing.min.js'))
    script(src=asset('vue.js'))
    script(src=asset('vues6.js') type='module')
    script(src=asset('dash/js/sb-admin-2.min.js'))
    script(src=asset('dash/vendor/chart.js/Chart.min.js'))
    script(src=asset('dash/js/demo/chart-area-demo.js'))
    script(src=asset('dash/js/demo/chart-pie-demo.js'))
    script(src=asset('dash/vendor/datatables2/jquery.dataTables.min.js'))
    script(src=asset('dash/vendor/datatables2/dataTables.bootstrap4.min.js'))
    script(src='https://unpkg.com/vue2-datepicker@latest')
    script.
        var require = { paths: { vs: "#{asset('monaco/package/min/vs')}" }}
    script(src=asset('monaco/package/min/vs/loader.js'))
    script(src=asset('monaco/package/min/vs/editor/editor.main.nls.js'))
    script(src=asset('monaco/package/min/vs/editor/editor.main.js'))
    script(type='module').
        import { Session } from "#{asset('cobalt/service/Session.service.js')}"
        import { EventBus } from "#{asset('cobalt/service/EventBus.service.js')}"
        import { Resource } from "#{asset('cobalt/Resource.js')}"
        Session.get().init(!{JSON.stringify(cobaltSession) || '\{\}'})
        window.session = Session.get()
        window.eventBus = EventBus.get()
        window.Resource = Resource

        import { components } from "#{asset('cobalt/components.js')}"
        import VuES6Loader from "#{asset('vues6.js')}";
        (new VuES6Loader(components)).load();

        new Vue({
            el: '#vue-wrapper',
            components: { DatePicker },
            data: !{JSON.stringify(cobaltState) || '\{\}'}
        })
