- var theme_customizer      = true;
- var ckeditor              = true;
- var email_app             = true;
- var sidebar               = true;
- var slick                 = true;
- var header_slider         = true;
- var animate               = true;
- var scrollbar             = true;
doctype html
html(lang='en')
  include ../../components/header-files
  body
    include ../../components/loader
    include ../../components/taptop
    // page-wrapper Start
    #pageWrapper.page-wrapper.compact-wrapper
      include ../../components/header
      // Page Body Start
      .page-body-wrapper
        include ../../components/sidebar
        .page-body
          .container-fluid
            .page-title
              .row
                .col-6
                  h3
                    | Email Compose

                .col-6
                  ol.breadcrumb
                    li.breadcrumb-item
                      a(href='index.html')                                        
                        svg.stroke-icon
                          use(href='../assets/svg/icon-sprite.svg#stroke-home')
                    li.breadcrumb-item Email
                    li.breadcrumb-item.active  Email Compose
          // Container-fluid starts
          .container-fluid
            .email-wrap
              .row
                .col-xl-3.box-col-12
                  .md-sidebar
                    a.btn.btn-primary.md-sidebar-toggle(href='javascript:void(0)') email filter
                    .md-sidebar-aside.job-left-aside.custom-scrollbar
                      .email-left-aside
                        .card
                          .card-body
                            .email-app-sidebar
                              .media
                                .media-size-email
                                  img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                                .media-body
                                  h6.f-w-600 MARKJENCO
                                  p Markjecno@gmail.com
                              ul.nav.main-menu(role='tablist')
                                li.nav-item
                                  a#pills-darkhome-tab.btn-primary.btn-block.btn-mail.show(data-bs-toggle='pill', href='#pills-darkhome', role='tab', aria-controls='pills-darkhome', aria-selected='true')
                                    i.icofont.icofont-envelope.me-2
                                    |  NEW MAIL
                                li.nav-item
                                  a#pills-darkprofile-tab(data-bs-toggle='pill', href='#pills-darkprofile', role='tab', aria-controls='pills-darkprofile', aria-selected='false')
                                    span.title
                                      i.icon-import
                                      |  Inbox
                                    span.badge.pull-right (236)
                                li
                                  a(href='#')
                                    span.title
                                      i.icon-folder
                                      |  All mail
                                li
                                  a(href='#')
                                    span.title
                                      i.icon-new-window
                                      |  Sent
                                    span.badge.pull-right (69)
                                li
                                  a(href='#')
                                    span.title
                                      i.icon-pencil-alt
                                      |  DRAFT
                                    span.badge.pull-right (59)
                                li
                                  a(href='#')
                                    span.title
                                      i.icon-trash
                                      |  TRASH
                                    span.badge.pull-right (99)
                                li
                                  a(href='#')
                                    span.title
                                      i.icon-info-alt
                                      |  IMPORTANT
                                li
                                  a(href='#')
                                    span.title
                                      i.icon-star
                                      |  Starred
                                li
                                  hr
                                li
                                  a(href='#')
                                    span.title
                                      i.icon-email
                                      |  UNREAD
                                li
                                  a(href='#')
                                    span.title
                                      i.icon-export
                                      |  SPAM
                                li
                                  a(href='#')
                                    span.title
                                      i.icon-share
                                      |  OUTBOX
                                li
                                  a(href='#')
                                    span.title
                                      i.icon-file
                                      |  UPDATE
                                li
                                  a(href='#')
                                    span.title
                                      i.icon-bell
                                      |  ALERT
                                li
                                  a(href='#')
                                    span.title
                                      i.icon-notepad
                                      |  NOTES
                                    span.badge.pull-right (20)
                .col-xl-9.box-col-12
                  .email-right-aside
                    .card.email-body
                      .row
                        .col-xl-4.col-md-12.box-md-12.pr-0
                          .pe-0.b-r-light
                          .email-top
                            .row
                              .col
                                h5 Inbox
                              .col.text-end
                                .dropdown
                                  button#dropdownMenuButton.btn.dropdown-toggle(type='button', data-bs-toggle='dropdown', aria-expanded='false')
                                    | More
                                  .dropdown-menu.dropdown-menu-end(aria-labelledby='dropdownMenuButton')
                                    a.dropdown-item(href='#') Action
                                    a.dropdown-item(href='#') Another action
                                    a.dropdown-item(href='#') Something else here
                          .inbox
                            .media
                              .media-size-email
                                img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                              .media-body
                                h6
                                  | Pork Lorn  
                                  small
                                    span (15
                                    |  July 
                                    span 2018)
                                p Mattis luctus. Donec nisi diam,
                            .media.active
                              .media-size-email
                                img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                              .media-body
                                h6
                                  | Lorm lpsa  
                                  small
                                    span (20
                                    |  January)
                                p Mattis luctus. Donec nisi diam,
                            .media
                              .media-size-email
                                img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                              .media-body
                                h6
                                  | Hileri makr  
                                  small
                                    span (20
                                    |  Aug
                                    span  2018)
                                p Mattis luctus. Donec nisi diam,
                            .media
                              .media-size-email
                                img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                              .media-body
                                h6
                                  | Lion Lorpa  
                                  small
                                    span (02
                                    |  Jun 
                                    span 2016)
                                p Mattis luctus. Donec nisi diam,
                            .media
                              .media-size-email
                                img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                              .media-body
                                h6.mt-0
                                  | Solvn Relto  
                                  small
                                    span (25
                                    |  July 
                                    span 2015)
                                p Mattis luctus. Donec nisi diam,
                            .media
                              .media-size-email
                                img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                              .media-body
                                h6
                                  | Repro Soft  
                                  small
                                    span (15
                                    |  July 
                                    span 2018)
                                p Mattis luctus. Donec nisi diam,
                            .media.media-size-email
                              img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                              .media-body
                                h6
                                  | Lion Lorpa  
                                  small
                                    span (02
                                    |  Jun 
                                    span 2016)
                                p Mattis luctus. Donec nisi diam,
                        .col-xl-8.col-md-12.box-md-12.pl-0
                          .email-right-aside
                            .email-body.radius-left
                              .ps-0
                                .tab-content
                                  #pills-darkhome.tab-pane.fade.active.show(role='tabpanel', aria-labelledby='pills-darkhome-tab')
                                    .email-compose
                                      .email-top.compose-border
                                        .row
                                          .col-sm-8.xl-50
                                            h4.mb-0 New Message
                                          .col-sm-4.btn-middle.xl-50
                                            button.btn.btn-primary.btn-block.btn-mail.text-center.mb-0.mt-0.w-100(type='button')
                                              i.fa.fa-paper-plane.me-2
                                              |  SEND
                                      .email-wrapper
                                        form.theme-form
                                          .mb-3
                                            label.col-form-label.pt-0(for='exampleInputEmail1') To
                                            input#exampleInputEmail1.form-control(type='email')
                                          .mb-3
                                            label(for='exampleInputPassword1') Subject
                                            input#exampleInputPassword1.form-control(type='text')
                                          div
                                            label.text-muted Message
                                            textarea#text-box(name='text-box', cols='10', rows='2')                                                             
                                  #pills-darkprofile.tab-pane.fade(role='tabpanel', aria-labelledby='pills-darkprofile-tab')
                                    .email-content
                                      .email-top
                                        .row
                                          .col-md-6.xl-100.col-sm-12
                                            .media
                                              img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                                              .media-body
                                                h6
                                                  | Lorm lpsa  
                                                  small
                                                    span (20
                                                    |  January) 
                                                    span 6:00
                                                    |  AM
                                                p Mattis luctus. Donec nisi diam text.
                                          .col-md-6.col-sm-12.xl-100
                                            .float-end.d-flex
                                              p.user-emailid
                                                | Lormlpsa
                                                span 23
                                                | @company.com
                                              i.fa.fa-star-o.f-18.mt-1
                                      .email-wrapper
                                        p Hello
                                        p Dear Sir Good Morning,
                                        h5 Elementum varius nisi vel tempus. Donec eleifend egestas viverra.
                                        p.m-b-20
                                          | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur non diam facilisis, commodo libero et, commodo sapien. Pellentesque sollicitudin massa sagittis dolor facilisis, sit amet vulputate nunc molestie. Pellentesque maximus nibh id luctus porta. Ut consectetur dui nec nulla mattis luctus. Donec nisi diam, congue vitae felis at, ullamcorper bibendum tortor. Vestibulum pellentesque felis felis. Etiam ac tortor felis. Ut elit arcu, rhoncus in laoreet vel, gravida sed tortor.
                                        p
                                          | In elementum varius nisi vel tempus. Donec eleifend egestas viverra. Donec dapibus sollicitudin blandit. Donec scelerisque purus sit amet feugiat efficitur. Quisque feugiat semper sapien vel hendrerit. Mauris lacus felis, consequat nec pellentesque viverra, venenatis a lorem. Sed urna
                                        hr
                                        .d-inline-block
                                          h6.text-muted
                                            i.icofont.icofont-clip
                                            |  ATTACHMENTS
                                          a.text-muted.text-end.right-download(href='#')
                                            i.fa.fa-long-arrow-down.me-2
                                            | Download All
                                          .clearfix
                                        .attachment
                                          ul.list-inline
                                            li.list-inline-item
                                              img.img-fluid(src='../assets/images/email/1.jpg', alt='')
                                            li.list-inline-item
                                              img.img-fluid(src='../assets/images/email/2.jpg', alt='')
                                            li.list-inline-item
                                              img.img-fluid(src='../assets/images/email/3.jpg', alt='')
                                        hr
                                        .action-wrapper
                                          ul.actions
                                            li
                                              a.text-muted(href='#')
                                                i.fa.fa-reply.me-2
                                                | Reply
                                            li
                                              a.text-muted(href='#')
                                                i.fa.fa-reply-all.me-2
                                                | Reply All
                                            li
                                              a.text-muted(href='#')
                                                i.fa.fa-share.me-2
                                              | Forward
        // Container-fluid Ends
        include ../../components/footer
    include ../../components/footer-files