chat template and styling added

2018-11-19 17:25:35 +01:00 · 2018-11-19 17:25:35 +01:00 · 678082cd99
commit 678082cd99
parent 4a0164eac6
2 changed files with 381 additions and 1 deletions
--- a/public_html/css/style.css
+++ b/public_html/css/style.css
@ -0,0 +1,214 @@
+img {
+    max-width: 100%;
+}
+
+.container {
+    margin: auto;
+    max-width: 1170px;
+}
+
+.messaging {
+    padding: 0 0 50px 0;
+}
+
+.inbox_people {
+    background: #f8f8f8 none repeat scroll 0 0;
+    border-left: 1px solid #c4c4c4;
+    float: right;
+    overflow: hidden;
+    width: 40%;
+}
+
+.inbox_msg {
+    border: 1px solid #c4c4c4;
+    clear: both;
+    overflow: hidden;
+}
+
+.recent_heading {
+    float: left;
+    width: 40%;
+}
+
+.recent_heading h4 {
+    color: #05728f;
+    font-size: 21px;
+    margin: auto;
+}
+
+/*Search*/
+.heading_search {
+    padding: 10px 29px 10px 20px;
+    overflow: hidden;
+    border-bottom: 1px solid #c4c4c4;
+}
+
+.search_bar {
+    display: inline-block;
+    text-align: right;
+    width: 60%;
+}
+
+.search_bar input {
+    background:none;
+    border-bottom: 1px solid #cdcdcd;
+    width: 80%;
+    padding: 2px 0 4px 6px;
+}
+
+.search_bar .input-group-addon { 
+    margin: 0 0 0 -30px;
+}
+
+.search_bar .input-group-addon button {
+    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
+    border: medium none;
+    color: #707070;
+    font-size: 18px;
+    padding: 0;
+}
+
+.chat_ib h5 { 
+    color: #464646; 
+    font-size: 15px; 
+    margin: 0 0 8px 0;
+}
+
+.chat_ib h5 span { 
+    float: right;
+    font-size: 13px; 
+}
+
+.chat_ib p { 
+    font-size: 14px; 
+    color: #989898; 
+    margin: auto;
+}
+
+.chat_img {
+    float: left;
+    width: 11%;
+}
+
+.chat_ib {
+    float: left;
+    padding: 0 0 0 15px;
+    width: 88%;
+}
+
+.chat_people { 
+    overflow:hidden; 
+    clear:both;
+}
+
+.chat_list {
+    border-bottom: 1px solid #c4c4c4;
+    margin: 0;
+    padding: 18px 16px 10px;
+}
+
+.inbox_chat { 
+    height: 550px; 
+    overflow-y: scroll;
+}
+
+.active_chat { 
+    background:#ebebeb;
+}
+
+.incoming_msg_img {
+    display: inline-block;
+    width: 6%;
+}
+
+.received_msg {
+    display: inline-block;
+    padding: 0 0 0 10px;
+    vertical-align: top;
+    width: 92%;
+}
+
+.received_withd_msg {
+    width: 57%;
+}
+
+.received_withd_msg p {
+    background: #ebebeb none repeat scroll 0 0;
+    border-radius: 3px;
+    color: #646464;
+    font-size: 14px;
+    margin: 0;
+    padding: 5px 10px 5px 12px;
+    width: 100%;
+}
+
+.messages {
+    float: left;
+    padding: 30px 15px 0 25px;
+    width: 60%;
+}
+
+.time_date {
+    color: #747474;
+    display: block;
+    font-size: 12px;
+    margin: 8px 0 0;
+}
+
+.sent_msg {
+    float: right;
+    width: 46%;
+}
+
+.sent_msg p {
+    background: #05728f none repeat scroll 0 0;
+    border-radius: 3px;
+    font-size: 14px;
+    margin: 0; color:#fff;
+    padding: 5px 10px 5px 12px;
+    width:100%;
+}
+
+.outgoing_msg {
+    overflow: hidden;
+    margin: 26px 0 26px;
+}
+
+
+.input_msg_write input {
+    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
+    border: medium none;
+    color: #4c4c4c;
+    font-size: 15px;
+    min-height: 48px;
+    width: 100%;
+}
+
+.type_msg {
+    border-top: 1px solid #c4c4c4;
+    position: relative;
+}
+
+.msg_send_btn {
+    background: #05728f none repeat scroll 0 0;
+    border: medium none;
+    border-radius: 50%;
+    color: #fff;
+    cursor: pointer;
+    font-size: 17px;
+    height: 33px;
+    position: absolute;
+    right: 0;
+    top: 11px;
+    width: 33px;
+}
+
+
+.msg_history {
+    height: 516px;
+    overflow-y: auto;
+}
+
+.top_spac {
+    margin: 20px 0 0;
+}