hide sound option. green 'in call' dot. tooltip

This commit is contained in:
Connor Turland 2016-03-21 13:08:34 -07:00
parent f055f4c7c5
commit 617dec72b9
3 changed files with 15 additions and 6 deletions

View file

@ -17,7 +17,7 @@ Metamaps.Views.chatView = (function () {
"<div class='chat-participant-name'>{{ username }} {{ selfName }}</div>" +
"<button type='button' class='button chat-participant-invite-call' onclick='Metamaps.Realtime.inviteACall({{ id}});'></button>" +
"<button type='button' class='button chat-participant-invite-join' onclick='Metamaps.Realtime.inviteToJoin({{ id}});'></button>" +
"<span class='chat-participant-participating'>IN CALL</span>" +
"<span class='chat-participant-participating'><div class='green-dot'></div></span>" +
"<div class='clearfloat'></div>" +
"</div>",
templates: function() {
@ -30,7 +30,7 @@ Metamaps.Views.chatView = (function () {
},
createElements: function() {
this.$unread = $('<div class="chat-unread"></div>');
this.$button = $('<div class="chat-button"></div>');
this.$button = $('<div class="chat-button"><div class="tooltips">Chat</div></div>');
this.$messageInput = $('<textarea placeholder="Send a message..." class="chat-input"></textarea>');
this.$juntoHeader = $('<div class="junto-header">PARTICIPANTS</div>');
this.$videoToggle = $('<div class="video-toggle"></div>');

View file

@ -456,7 +456,7 @@
}
.zoomExtents:hover .tooltips, .zoomIn:hover .tooltips, .zoomOut:hover .tooltips, .takeScreenshot:hover .tooltips, .sidebarFilterIcon:hover .tooltipsUnder, .sidebarForkIcon:hover .tooltipsUnder, .addMap:hover .tooltipsUnder, .authenticated .sidebarAccountIcon:hover .tooltipsUnder,
.mapInfoIcon:hover .tooltipsAbove, .openCheatsheet:hover .tooltipsAbove {
.mapInfoIcon:hover .tooltipsAbove, .openCheatsheet:hover .tooltipsAbove, .chat-button:hover .tooltips {
display: block;
}
@ -536,6 +536,10 @@
left: -11px;
}
.chat-button .tooltips {
top: 10px;
}
.openCheatsheet .tooltipsAbove {
left: -4px;
}
@ -545,7 +549,7 @@
margin-top: 40px;
}
.zoomExtents div::after, .zoomIn div::after, .zoomOut div::after, .takeScreenshot div:after {
.zoomExtents div::after, .zoomIn div::after, .zoomOut div::after, .takeScreenshot div:after, .chat-button div.tooltips::after {
content: '';
position: absolute;
top: 57%;

View file

@ -215,7 +215,6 @@
width: 32px;
height: 32px;
border-radius: 18px;
cursor: pointer;
}
.chat-box .participants .participant .chat-participant-name {
width: 53%;
@ -254,6 +253,12 @@
display: none;
margin-top: 14px;
}
.chat-box .participants .participant .chat-participant-participating .green-dot {
background: #4fc059;
width: 12px;
height: 12px;
border-radius: 6px;
}
.chat-box .participants .participant.active .chat-participant-participating {
display: block;
}
@ -268,6 +273,7 @@
box-shadow: 0px 6px 3px rgba(0, 0, 0, 0.23), 10px 10px 10px rgba(0, 0, 0, 0.19);
}
.chat-box .chat-header .sound-toggle {
display: none;
width: 24px;
height: 24px;
margin-right: 32px;
@ -327,7 +333,6 @@
width: 32px;
height: 32px;
border-radius: 18px;
cursor: pointer;
}
.chat-box .chat-messages .chat-message .chat-message-text {
width: 73%;