Changed img to username, set user list to left again, adjusted stylings
This commit is contained in:
parent
ee80ee45d6
commit
89c18b7c4c
|
|
@ -1,3 +1,8 @@
|
|||
body {
|
||||
font-family: Roboto,sans-serif;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
|
@ -20,6 +25,16 @@ img {
|
|||
overflow: hidden;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.messaging_heading {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#sidebarCollapse {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.inbox_msg {
|
||||
border: 1px solid #c4c4c4;
|
||||
clear: both;
|
||||
|
|
@ -45,10 +60,11 @@ img {
|
|||
@media (min-width: 768px) {
|
||||
#sidebar {
|
||||
border-left: 1px solid #c4c4c4;
|
||||
/*float: right;*/
|
||||
/*position: relative;*/
|
||||
float: left;
|
||||
overflow: hidden;
|
||||
/*width: 40%;*/
|
||||
position: relative;
|
||||
transform: none;
|
||||
width: 40%;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -86,15 +102,22 @@ img {
|
|||
width: 60%;
|
||||
}
|
||||
|
||||
.search_bar .stylish-input-group {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.search_bar input {
|
||||
background: none;
|
||||
border-bottom: 1px solid #cdcdcd;
|
||||
font-size: 1rem;
|
||||
height: 25px;
|
||||
padding: 2px 30px 4px 6px;
|
||||
width: 80%;
|
||||
padding: 2px 0 4px 6px;
|
||||
}
|
||||
|
||||
.search_bar .input-group-addon {
|
||||
margin: 0 0 0 -30px;
|
||||
.search_bar .input-group-addon {
|
||||
position: absolute;
|
||||
right: 28px;
|
||||
}
|
||||
|
||||
.search_bar .input-group-addon button {
|
||||
|
|
@ -103,12 +126,17 @@ img {
|
|||
color: #707070;
|
||||
font-size: 18px;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.search_bar .input-group-addon button svg {
|
||||
padding-top: 5px;
|
||||
}
|
||||
|
||||
.chat_ib {
|
||||
float: left;
|
||||
padding: 0 0 0 15px;
|
||||
width: 88%;
|
||||
width: 75%;
|
||||
}
|
||||
|
||||
.chat_ib h5 {
|
||||
|
|
@ -145,7 +173,7 @@ img {
|
|||
}
|
||||
|
||||
.inbox_chat {
|
||||
height: 550px;
|
||||
height: 540px;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
|
|
@ -153,14 +181,15 @@ img {
|
|||
background: #ebebeb;
|
||||
}
|
||||
|
||||
.incoming_msg_img {
|
||||
display: inline-block;
|
||||
width: 6%;
|
||||
h5.incoming_msg_user {
|
||||
color: #464646;
|
||||
font-size: 15px;
|
||||
margin: 0 0 8px 30px;
|
||||
}
|
||||
|
||||
.received_msg {
|
||||
display: inline-block;
|
||||
padding: 0 0 0 10px;
|
||||
padding-left: 30px;
|
||||
vertical-align: top;
|
||||
width: 92%;
|
||||
}
|
||||
|
|
@ -180,15 +209,13 @@ img {
|
|||
}
|
||||
|
||||
.messages {
|
||||
padding: 30px 15px 0 25px;
|
||||
padding: 30px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.messages {
|
||||
/*float: left;*/
|
||||
padding: 30px 15px 0 25px;
|
||||
/*width: 60%;*/
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -199,6 +226,7 @@ img {
|
|||
margin: 8px 0 0;
|
||||
}
|
||||
|
||||
/*Messages*/
|
||||
.sent_msg {
|
||||
float: right;
|
||||
width: 46%;
|
||||
|
|
@ -210,7 +238,7 @@ img {
|
|||
font-size: 14px;
|
||||
margin: 0; color:#fff;
|
||||
padding: 5px 10px 5px 12px;
|
||||
width: 100%;
|
||||
/*width: 100%;*/
|
||||
}
|
||||
|
||||
.outgoing_msg {
|
||||
|
|
@ -224,12 +252,15 @@ img {
|
|||
color: #4c4c4c;
|
||||
font-size: 15px;
|
||||
min-height: 48px;
|
||||
padding-left: 30px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.type_msg {
|
||||
border-top: 1px solid #c4c4c4;
|
||||
float: left;
|
||||
position: relative;
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
.msg_send_btn {
|
||||
|
|
@ -242,12 +273,13 @@ img {
|
|||
height: 33px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 11px;
|
||||
top: 8px;
|
||||
width: 33px;
|
||||
}
|
||||
|
||||
.msg_send_btn svg {
|
||||
fill: #ffffff;
|
||||
padding-top: 4px;
|
||||
}
|
||||
|
||||
.msg_history {
|
||||
|
|
|
|||
|
|
@ -118,7 +118,7 @@
|
|||
<div class="messages">
|
||||
<div class="msg_history">
|
||||
<div class="incoming_msg">
|
||||
<div class="incoming_msg_img"> <img src="https://ptetutorials.com/images/user-profile.png" alt="sunil"> </div>
|
||||
<h5 class="incoming_msg_user">Sunil Rajput</h5>
|
||||
<div class="received_msg">
|
||||
<div class="received_withd_msg">
|
||||
<p>Test which is a new approach to have all
|
||||
|
|
@ -134,7 +134,7 @@
|
|||
<span class="time_date"> 11:01 AM | June 9</span> </div>
|
||||
</div>
|
||||
<div class="incoming_msg">
|
||||
<div class="incoming_msg_img"> <img src="https://ptetutorials.com/images/user-profile.png" alt="sunil"> </div>
|
||||
<h5 class="incoming_msg_user">Sunil Rajput</h5>
|
||||
<div class="received_msg">
|
||||
<div class="received_withd_msg">
|
||||
<p>Test, which is a new approach to have</p>
|
||||
|
|
@ -148,7 +148,7 @@
|
|||
<span class="time_date"> 11:01 AM | Today</span> </div>
|
||||
</div>
|
||||
<div class="incoming_msg">
|
||||
<div class="incoming_msg_img"> <img src="https://ptetutorials.com/images/user-profile.png" alt="sunil"> </div>
|
||||
<h5 class="incoming_msg_user">Sunil Rajput</h5>
|
||||
<div class="received_msg">
|
||||
<div class="received_withd_msg">
|
||||
<p>We work directly with our designers and suppliers,
|
||||
|
|
|
|||
Loading…
Reference in New Issue