definicao de layout
This commit is contained in:
350
public/assets/pug/pages/template/chat.pug
Normal file
350
public/assets/pug/pages/template/chat.pug
Normal file
@@ -0,0 +1,350 @@
|
||||
- var theme_customizer = true;
|
||||
- var fullscreen = 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-sm-6
|
||||
h3
|
||||
| Chat App
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
| Home
|
||||
li.breadcrumb-item Apps
|
||||
li.breadcrumb-item Chat
|
||||
li.breadcrumb-item.active Chat App
|
||||
.col-sm-6
|
||||
include ../../components/bookmark
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
.row
|
||||
.col.call-chat-sidebar
|
||||
.card
|
||||
.card-body.chat-body
|
||||
.chat-box
|
||||
// Chat left side Start
|
||||
.chat-left-aside
|
||||
.media
|
||||
img.rounded-circle.user-image(src='../assets/images/user/12.png', alt='')
|
||||
.media-body
|
||||
.about
|
||||
.name.f-w-600 Mark Jecno
|
||||
.status
|
||||
| Status...
|
||||
#people-list.people-list
|
||||
.search
|
||||
form.theme-form
|
||||
.form-group
|
||||
input.form-control(type='text', placeholder='search')
|
||||
i.fa.fa-search
|
||||
ul.list.custom-scrollbar
|
||||
li.clearfix
|
||||
.media
|
||||
img.rounded-circle.user-image(src='../assets/images/user/1.jpg', alt='')
|
||||
.status-circle.away
|
||||
.media-body
|
||||
.about
|
||||
.name Vincent Porter
|
||||
.status
|
||||
| Hello Name
|
||||
li.clearfix
|
||||
.media
|
||||
img.rounded-circle.user-image(src='../assets/images/user/2.png', alt='')
|
||||
.status-circle.online
|
||||
.media-body
|
||||
.about
|
||||
.name Aiden Chavez
|
||||
.status
|
||||
| Out is my favorite.
|
||||
li.clearfix
|
||||
.media
|
||||
img.rounded-circle.user-image(src='../assets/images/user/8.jpg', alt='')
|
||||
.status-circle.online
|
||||
.media-body
|
||||
.about
|
||||
.name Prasanth Anand
|
||||
.status
|
||||
| Change for anyone.
|
||||
li.clearfix
|
||||
.media
|
||||
img.rounded-circle.user-image(src='../assets/images/user/4.jpg', alt='')
|
||||
.status-circle.offline
|
||||
.media-body
|
||||
.about
|
||||
.name Venkata Satyamu
|
||||
.status
|
||||
| First bun like a sun.
|
||||
li.clearfix
|
||||
.media
|
||||
img.rounded-circle.user-image(src='../assets/images/user/5.jpg', alt='')
|
||||
.status-circle.online
|
||||
.media-body
|
||||
.about
|
||||
.name Ginger Johnston
|
||||
.status
|
||||
| it's my life. Mind it.
|
||||
li.clearfix
|
||||
.media
|
||||
img.rounded-circle.user-image(src='../assets/images/user/8.jpg', alt='')
|
||||
.status-circle.offline
|
||||
.media-body
|
||||
.about
|
||||
.name Kori Thomas
|
||||
.status
|
||||
| Change for anyone.
|
||||
li.clearfix
|
||||
.media
|
||||
img.rounded-circle.user-image(src='../assets/images/user/1.jpg', alt='')
|
||||
.status-circle.online
|
||||
.media-body
|
||||
.about
|
||||
.name Vincent Porter
|
||||
.status
|
||||
| Hello Name
|
||||
li.clearfix
|
||||
.media
|
||||
img.rounded-circle.user-image(src='../assets/images/user/8.jpg', alt='')
|
||||
.status-circle.online
|
||||
.media-body
|
||||
.about
|
||||
.name Kori Thomas
|
||||
.status
|
||||
| Change for anyone.
|
||||
// Chat left side Ends
|
||||
.col.call-chat-body
|
||||
.card
|
||||
.card-body.p-0
|
||||
.row.chat-box
|
||||
// Chat right side start
|
||||
.col.chat-right-aside
|
||||
// chat start
|
||||
.chat
|
||||
// chat-header start
|
||||
.media.chat-header.clearfix
|
||||
img.rounded-circle(src='../assets/images/user/8.jpg', alt='')
|
||||
.media-body
|
||||
.about
|
||||
.name
|
||||
| Kori Thomas
|
||||
span.font-primary.f-12 Typing...
|
||||
.status.digits
|
||||
| Last Seen 3:55 PM
|
||||
ul.list-inline.float-start.float-sm-end.chat-menu-icons
|
||||
li.list-inline-item
|
||||
a(href='javascript:void(0)')
|
||||
i.icon-search
|
||||
li.list-inline-item
|
||||
a(href='javascript:void(0)')
|
||||
i.icon-clip
|
||||
li.list-inline-item
|
||||
a(href='javascript:void(0)')
|
||||
i.icon-headphone-alt
|
||||
li.list-inline-item
|
||||
a(href='javascript:void(0)')
|
||||
i.icon-video-camera
|
||||
li.list-inline-item.toogle-bar
|
||||
a(href='javascript:void(0)')
|
||||
i.icon-menu
|
||||
// chat-header end
|
||||
.chat-history.chat-msg-box.custom-scrollbar
|
||||
ul
|
||||
li
|
||||
.message.my-message
|
||||
img.rounded-circle.float-start.chat-user-img.img-30(src='../assets/images/user/3.png', alt='')
|
||||
.message-data.text-end
|
||||
span.message-data-time 10:12 am
|
||||
| Are we meeting today? Project has been already finished and I have results to show you.
|
||||
li.clearfix
|
||||
.message.other-message.pull-right
|
||||
img.rounded-circle.float-end.chat-user-img.img-30(src='../assets/images/user/12.png', alt='')
|
||||
.message-data
|
||||
span.message-data-time 10:14 am
|
||||
| Well I am not sure. The rest of the team is not here yet. Maybe in an hour or so?
|
||||
li.clearfix
|
||||
.message.other-message.pull-right
|
||||
img.rounded-circle.float-end.chat-user-img.img-30(src='../assets/images/user/12.png', alt='')
|
||||
.message-data
|
||||
span.message-data-time 10:14 am
|
||||
| Well I am not sure. The rest of the team
|
||||
li
|
||||
.message.my-message.mb-0
|
||||
img.rounded-circle.float-start.chat-user-img.img-30(src='../assets/images/user/3.png', alt='')
|
||||
.message-data.text-end
|
||||
span.message-data-time 10:20 am
|
||||
| Actually everything was fine. I'm very excited to show this to our team.
|
||||
// end chat-history
|
||||
.chat-message.clearfix
|
||||
.row
|
||||
.col-xl-12.d-flex
|
||||
.smiley-box.bg-primary
|
||||
.picker
|
||||
img(src='../assets/images/smiley.png', alt='')
|
||||
.input-group.text-box
|
||||
input#message-to-send.form-control.input-txt-bx(type='text', name='message-to-send', placeholder='Type a message......')
|
||||
button.btn.btn-primary.input-group-text(type='button') SEND
|
||||
// end chat-message
|
||||
// chat end
|
||||
// Chat right side ends
|
||||
.col.chat-menu
|
||||
ul#info-tab.nav.nav-tabs.border-tab.nav-primary(role='tablist')
|
||||
li.nav-item
|
||||
a#info-home-tab.nav-link.active(data-bs-toggle='tab', href='#info-home', role='tab', aria-selected='true')
|
||||
| CALL
|
||||
.material-border
|
||||
li.nav-item
|
||||
a#profile-info-tab.nav-link(data-bs-toggle='tab', href='#info-profile', role='tab', aria-selected='false')
|
||||
| STATUS
|
||||
.material-border
|
||||
li.nav-item
|
||||
a#contact-info-tab.nav-link(data-bs-toggle='tab', href='#info-contact', role='tab', aria-selected='false')
|
||||
| PROFILE
|
||||
.material-border
|
||||
#info-tabContent.tab-content
|
||||
#info-home.tab-pane.fade.show.active(role='tabpanel', aria-labelledby='info-home-tab')
|
||||
.people-list
|
||||
ul.list.digits.custom-scrollbar
|
||||
li.clearfix
|
||||
.media
|
||||
img.rounded-circle.user-image(src='../assets/images/user/4.jpg', alt='')
|
||||
.media-body
|
||||
.about
|
||||
.name Erica Hughes
|
||||
.status
|
||||
i.fa.fa-share.font-success
|
||||
| 5 May, 4:40 PM
|
||||
li.clearfix
|
||||
.media
|
||||
img.rounded-circle.user-image.mt-0(src='../assets/images/user/1.jpg', alt='')
|
||||
.media-body
|
||||
.about
|
||||
.name Vincent Porter
|
||||
.status
|
||||
i.fa.fa-reply.font-danger
|
||||
| 5 May, 5:30 PM
|
||||
li.clearfix
|
||||
.media
|
||||
img.rounded-circle.user-image(src='../assets/images/user/8.jpg', alt='')
|
||||
.media-body
|
||||
.about
|
||||
.name Kori Thomas
|
||||
.status
|
||||
i.fa.fa-share.font-success
|
||||
| 1 Feb, 6:56 PM
|
||||
li.clearfix
|
||||
.media
|
||||
img.rounded-circle.user-image(src='../assets/images/user/2.png', alt='')
|
||||
.media-body
|
||||
.about
|
||||
.name Aiden Chavez
|
||||
.status
|
||||
i.fa.fa-reply.font-danger
|
||||
| 3 June, 1:22 PM
|
||||
li.clearfix
|
||||
.media
|
||||
img.rounded-circle.user-image(src='../assets/images/user/4.jpg', alt='')
|
||||
.media-body
|
||||
.about
|
||||
.name Erica Hughes
|
||||
.status
|
||||
i.fa.fa-share.font-success
|
||||
| 5 May, 4:40 PM
|
||||
li.clearfix
|
||||
.media
|
||||
img.rounded-circle.user-image.mt-0(src='../assets/images/user/1.jpg', alt='')
|
||||
.media-body
|
||||
.about
|
||||
.name Vincent Porter
|
||||
.status
|
||||
i.fa.fa-share.font-success
|
||||
| 5 May, 5:30 PM
|
||||
li.clearfix
|
||||
.media
|
||||
img.rounded-circle.user-image(src='../assets/images/user/8.jpg', alt='')
|
||||
.media-body
|
||||
.about
|
||||
.name Kori Thomas
|
||||
.status
|
||||
i.fa.fa-reply.font-danger
|
||||
| 1 Feb, 6:56 PM
|
||||
li.clearfix
|
||||
.media
|
||||
img.rounded-circle.user-image(src='../assets/images/user/4.jpg', alt='')
|
||||
.media-body
|
||||
.about
|
||||
.name Erica Hughes
|
||||
.status
|
||||
i.fa.fa-share.font-success
|
||||
| 5 May, 4:40 PM
|
||||
#info-profile.tab-pane.fade(role='tabpanel', aria-labelledby='profile-info-tab')
|
||||
.people-list
|
||||
.search
|
||||
form.theme-form
|
||||
.form-group
|
||||
input.form-control(type='text', placeholder='Write Status...')
|
||||
i.fa.fa-pencil
|
||||
.status
|
||||
p.font-primary.f-w-600 Active
|
||||
hr
|
||||
p
|
||||
| Established fact that a reader will be
|
||||
| distracted
|
||||
i.icofont.icofont-emo-heart-eyes.font-danger.f-20
|
||||
i.icofont.icofont-emo-heart-eyes.font-danger.f-20.m-l-5
|
||||
hr
|
||||
p
|
||||
| Dolore magna aliqua
|
||||
i.icofont.icofont-emo-rolling-eyes.font-success.f-20
|
||||
#info-contact.tab-pane.fade(role='tabpanel', aria-labelledby='contact-info-tab')
|
||||
.user-profile
|
||||
.image
|
||||
.avatar.text-center
|
||||
img(alt='', src='../assets/images/user/2.png')
|
||||
.icon-wrapper
|
||||
i.icofont.icofont-pencil-alt-5
|
||||
.user-content.text-center
|
||||
h5.text-uppercase mark jenco
|
||||
.social-list
|
||||
ul
|
||||
li
|
||||
a(href='javascript:void(0)')
|
||||
i.fa.fa-facebook
|
||||
li
|
||||
a(href='javascript:void(0)')
|
||||
i.fa.fa-google-plus
|
||||
li
|
||||
a(href='javascript:void(0)')
|
||||
i.fa.fa-twitter
|
||||
li
|
||||
a(href='javascript:void(0)')
|
||||
i.fa.fa-instagram
|
||||
li
|
||||
a(href='javascript:void(0)')
|
||||
i.fa.fa-rss
|
||||
.follow.text-center
|
||||
.row
|
||||
.col.border-right
|
||||
span Following
|
||||
.follow-num 236k
|
||||
.col
|
||||
span Follower
|
||||
.follow-num 3691k
|
||||
.text-center.digits
|
||||
p Mark.jecno23@gmail.com
|
||||
p +91 365 - 658 - 1236
|
||||
p Fax: 123-4560
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
Reference in New Issue
Block a user