Restyled chatbar
This commit is contained in:
parent
029b90f2b1
commit
840c4965a5
@ -27,9 +27,9 @@
|
||||
margin: 0px;
|
||||
padding: 15px;
|
||||
word-wrap: break-word;
|
||||
&:nth-child(even) {
|
||||
background-color: rgb(245,245,245);
|
||||
}
|
||||
// &:nth-child(even) {
|
||||
// background-color: rgb(245,245,245);
|
||||
// }
|
||||
table {
|
||||
width: 100%;
|
||||
}
|
||||
@ -39,7 +39,7 @@
|
||||
|
||||
#chatbody {
|
||||
@media @landscape {
|
||||
height: calc(~'100% - 121px');
|
||||
height: calc(~'100% - 70px');
|
||||
}
|
||||
overflow-y: scroll;
|
||||
padding-left: 0px;
|
||||
@ -165,9 +165,13 @@
|
||||
float: left;
|
||||
width: 75%;
|
||||
resize: none;
|
||||
padding:5px;
|
||||
border-radius:4px;
|
||||
border-bottom-left-radius: 10px;
|
||||
border-top-left-radius: 10px;
|
||||
border-bottom-right-radius: 0px;
|
||||
border-top-right-radius: 0px;
|
||||
|
||||
border:1px solid extract(@lightGrey, 3);
|
||||
margin: 0px;
|
||||
|
||||
@media @landscape {
|
||||
height: 40px; /* same height as send button */
|
||||
@ -201,9 +205,10 @@
|
||||
|
||||
.panel-footer {
|
||||
bottom: 0px;
|
||||
/* padding: 10px; TODO: investigate (causes the overflow in the chat's title) */
|
||||
position: relative;
|
||||
background: extract(@white, 1);
|
||||
padding: 0;
|
||||
border-top: 1px solid extract(@lightGrey, 3);
|
||||
}
|
||||
|
||||
.private-chat-user-box {
|
||||
@ -220,34 +225,37 @@
|
||||
}
|
||||
|
||||
#sendMessageButton {
|
||||
background-color: extract(@azure, 1);
|
||||
width: 20%; /* 75% for the message input, 5% margin between the two */
|
||||
color: extract(@white, 1);
|
||||
color: extract(@black, 1);
|
||||
background-color: extract(@white, 1);
|
||||
font-weight: bold;
|
||||
height: 50px;
|
||||
margin: 0px;
|
||||
|
||||
border: 1px solid extract(@lightGrey, 3);
|
||||
border-bottom-left-radius: 00px;
|
||||
border-top-left-radius: 0px;
|
||||
border-top-right-radius: 10px;
|
||||
border-bottom-right-radius: 10px;
|
||||
|
||||
@media @desktop-portrait {
|
||||
width: 20%; /* 75% for the message input, 5% margin between the two */
|
||||
font-size: 30px;
|
||||
height: 60px;
|
||||
margin-left: 5%;
|
||||
}
|
||||
@media @mobile-portrait {
|
||||
width: 15vw;
|
||||
height: 8vw;
|
||||
font-size: 4vw;
|
||||
margin-left: 5%;
|
||||
}
|
||||
@media @mobile-portrait-with-keyboard {
|
||||
width: 19vw;
|
||||
height: 21vh;
|
||||
font-size: 3vh;
|
||||
margin-left: 1%;
|
||||
margin-right: 1%;
|
||||
marigin-top: 2vh;
|
||||
margin-bottom: 2vh;
|
||||
}
|
||||
@media @landscape {
|
||||
height: 40px;
|
||||
height: 50px;
|
||||
padding: 0px;
|
||||
margin-left: 5%;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -186,10 +186,6 @@ body {
|
||||
background: extract(@darkGrey, 4);
|
||||
}
|
||||
|
||||
.panel-footer {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.recordingStatus {
|
||||
background: none!important;
|
||||
border: none;
|
||||
|
@ -26,24 +26,25 @@
|
||||
{{#if privateChatDisabled}}
|
||||
<textarea id="newMessageInput" class="disabledChat" placeholder="Private chat is temporarily locked (disabled)" rel="tooltip" data-placement="top" title="Private chat is temporarily locked" disabled></textarea>
|
||||
{{else}}
|
||||
<textarea id="newMessageInput" placeholder="Write a message..." rel="tooltip" data-placement="top" title="Write a new message"></textarea>
|
||||
<button type="submit" id="sendMessageButton" class="btn" rel="tooltip" data-placement="top">
|
||||
Send
|
||||
</button>
|
||||
{{> chatInputControls}}
|
||||
{{/if}}
|
||||
{{else}}
|
||||
{{#if publicChatDisabled}}
|
||||
<textarea id="newMessageInput" class="disabledChat" placeholder="Public chat is temporarily locked (disabled)" rel="tooltip" data-placement="top" title="Public chat is temporarily locked" disabled></textarea>
|
||||
{{else}}
|
||||
<textarea id="newMessageInput" placeholder="Write a message..." rel="tooltip" data-placement="top" title="Write a new message"></textarea>
|
||||
<button type="submit" id="sendMessageButton" class="btn" rel="tooltip" data-placement="top">
|
||||
Send
|
||||
</button>
|
||||
{{> chatInputControls}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template name="chatInputControls">
|
||||
<textarea id="newMessageInput" rel="tooltip" data-placement="top" title="Write a new message"></textarea>
|
||||
<button type="submit" id="sendMessageButton" class="btn" rel="tooltip" data-placement="top">
|
||||
Send
|
||||
</button>
|
||||
</template>
|
||||
|
||||
<template name="chatOptions">
|
||||
<p>Chat Options:</p>
|
||||
{{> optionsFontSize}}
|
||||
|
Loading…
Reference in New Issue
Block a user