definicao de layout
This commit is contained in:
310
public/assets/pug/pages/template/email-compose.pug
Normal file
310
public/assets/pug/pages/template/email-compose.pug
Normal file
@@ -0,0 +1,310 @@
|
||||
- var theme_customizer = true;
|
||||
- var ckeditor = true;
|
||||
- var email_app = true;
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper.horizontal-menu
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-header
|
||||
.row
|
||||
.col-lg-6
|
||||
h3
|
||||
| Email Compose
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
| Home
|
||||
li.breadcrumb-item Apps
|
||||
li.breadcrumb-item Email
|
||||
li.breadcrumb-item.active Email Compose
|
||||
.col-lg-6
|
||||
include ../../components/bookmark
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.email-wrap
|
||||
.row
|
||||
.col-xl-3.col-md-6.box-col-6
|
||||
.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(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.show(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.col-md-12
|
||||
.email-right-aside
|
||||
.card.email-body
|
||||
.row.email-profile
|
||||
.col-xl-4.col-md-6.box-md-12.pr-0
|
||||
.pe-0.b-r-light
|
||||
.email-top
|
||||
.row
|
||||
.col
|
||||
h5 Inbox
|
||||
.col.text-end
|
||||
.dropdown
|
||||
button#dropdownMenuButton.btn.bg-transparent.dropdown-toggle.p-0.font-primary.f-w-600(type='button', data-bs-toggle='dropdown', aria-haspopup='true', aria-expanded='false')
|
||||
| More
|
||||
.dropdown-menu(aria-labelledby='dropdownMenuButton')
|
||||
a.dropdown-item(href='javascript:void(0)') Action
|
||||
a.dropdown-item(href='javascript:void(0)') Another action
|
||||
a.dropdown-item(href='javascript:void(0)') 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 2024)
|
||||
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 2024)
|
||||
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 2024)
|
||||
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 2024)
|
||||
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 2024)
|
||||
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 2024)
|
||||
p Mattis luctus. Donec nisi diam,
|
||||
.col-xl-8.col-md-6.box-md-12.pl-0
|
||||
.email-right-aside
|
||||
.email-body.radius-left
|
||||
.ps-0
|
||||
.tab-content
|
||||
#pills-darkhome.tab-pane.fade(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.active.show(role='tabpanel', aria-labelledby='pills-darkprofile-tab')
|
||||
.email-content
|
||||
.email-top
|
||||
.row
|
||||
.col-xl-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-xl-6.xl-100.col-sm-12
|
||||
.email-right
|
||||
p.user-emailid
|
||||
| Lormlpsa
|
||||
span.digits 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.font-primary.f-w-600(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
|
||||
Reference in New Issue
Block a user