Skip to content

Instantly share code, notes, and snippets.

@DanyF-github
Created March 24, 2022 10:53
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save DanyF-github/76e36b11c9f451d6cc5e116e43b324ab to your computer and use it in GitHub Desktop.
Save DanyF-github/76e36b11c9f451d6cc5e116e43b324ab to your computer and use it in GitHub Desktop.
.container {
max-width: 500 !important;
margin: auto;
margin-top: 4%;
letter-spacing: 0.5px;
}
.msg-header {
border: 1px solid #ccc;
width: 100%;
height: 10%;
border-bottom: none;
display: inline-block;
background-color: #007bff;
}
.active {
width: 120px;
float: left;
margin-top: 10px;
}
.active h4 {
font-size: 20px;
margin-left: 10px;
color: #fff;
}
.msg-inbox {
border: 1px solid #ccc;
overflow: hidden;
padding-bottom: 20px;
}
.chats {
padding: 30px 15px 0 25px;
}
.msg-page {
height: 400px;
overflow-y: auto;
}
.received-msg {
display: inline-block;
padding: 0 0 0 10px;
vertical-align: top;
width: 53%;
}
.received-msg p {
background: #efefef none repeat scroll;
border-radius: 10px;
color: #646464;
font-size: 14px;
margin: 0;
padding: 5px 10px 5px 12px;
width: 100%;
}
.time {
color: #777;
display: block;
font-size: 12px;
margin: 8px 0 0;
}
.outgoing-msg {
float: left;
width: 46%;
margin-left: 45%;
}
.outgoing-msg p {
background: #007bff none repeat scroll 0 0;
color: #fff;
border-radius: 10px;
font-size: 14px;
margin: 0;
padding: 5px 10px 5px 12px;
width: 100%;
}
.msg-bottom {
position: relative;
width: 100%;
height: 20%;
background: #007bff;
display: inline-block;
}
.input-group {
float: right;
margin: 10px 20px 10px 0;
outline: none !important;
border-radius: 20px;
width: 61% !important;
background-color: #fff;
}
.form-control {
border: none !important;
border-radius: 20px !important;
}
.input-group-text {
background: transparent !important;
border: none !important;
color: #007bff;
cursor: pointer;
}
.input-group-append {
display: flex;
flex-direction: column;
justify-content: flex-end;
}
.input-group .fa {
color: #007bff;
float: right;
}
.bottom-icons {
float: left;
margin-top: 17ox;
width: 30px !important;
margin-left: 22px;
}
.bottom-icons .fa {
color: #007bff;
padding: 5px;
}
.form-control:focus {
border-color: none !important;
box-shadow: none !important;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment