BEMificated classes and add title

This commit is contained in:
Ilya Daynatovich 2016-10-13 18:00:02 +03:00
parent c54938374d
commit 26792625f2
3 changed files with 47 additions and 19 deletions

View File

@ -21,7 +21,9 @@
margin-bottom: 35px; margin-bottom: 35px;
&__title { &__title {
text-align: center; text-align: left;
margin: 0;
padding: 0;
} }
&__content { &__content {

View File

@ -76,7 +76,7 @@ var JitsiPopover = (function () {
*/ */
JitsiPopover.prototype.createPopover = function () { JitsiPopover.prototype.createPopover = function () {
$("body").append(this.template); $("body").append(this.template);
$(".jitsipopover > .jitsipopover-content").html(this.options.content); $(".jitsipopover > .jitsipopover__content").html(this.options.content);
var self = this; var self = this;
$(".jitsipopover").on("mouseenter", function () { $(".jitsipopover").on("mouseenter", function () {
self.popoverIsHovered = true; self.popoverIsHovered = true;
@ -103,7 +103,7 @@ var JitsiPopover = (function () {
$(".jitsipopover").css( $(".jitsipopover").css(
{top: position.top, left: position.left, display: "table"}); {top: position.top, left: position.left, display: "table"});
$(".jitsipopover > .arrow").css({left: calcLeft}); $(".jitsipopover > .arrow").css({left: calcLeft});
$(".jitsipopover > .jitsiPopupmenuPadding").css( $(".jitsipopover > .jitsipopover__menu-padding").css(
{left: calcLeft - 50}); {left: calcLeft - 50});
} }
}); });

View File

@ -95,21 +95,47 @@ ConnectionIndicator.prototype.generateText = function () {
return `${width}x${height}`; return `${width}x${height}`;
}).join(', ') || 'N/A'; }).join(', ') || 'N/A';
var result = "<table style='width:100%'>" + let headerKey = 'connectionindicator.header';
"<tr>" + let result = (
"<td><span data-i18n='connectionindicator.bitrate'>" + `<table style='width:100%'>
translate("connectionindicator.bitrate") + "</span></td>" + <tr>
"<td><span class='jitsipopover__green'>&darr;</span>" + <td>
downloadBitrate + " <span class='jitsipopover__orange'>&uarr;</span>" + <span class="jitsipopover__title"
uploadBitrate + "</td>" + data-i18n="">${translate(headerKey)}</span>
"</tr><tr>" + </td>
"<td><span data-i18n='connectionindicator.packetloss'>" + </tr>
translate("connectionindicator.packetloss") + "</span></td>" + <tr>
"<td>" + packetLoss + "</td>" + <td>
"</tr><tr>" + <span data-i18n='connectionindicator.bitrate'>
"<td><span data-i18n='connectionindicator.resolution'>" + ${translate("connectionindicator.bitrate")}
translate("connectionindicator.resolution") + "</span></td>" + </span>
"<td>" + resolutionStr + "</td></tr></table>"; </td>
<td>
<span class='jitsipopover__green'>&darr;</span>
${downloadBitrate}
<span class='jitsipopover__orange'>&uarr;</span>
${uploadBitrate}
</td>
</tr>
<tr>
<td>
<span data-i18n='connectionindicator.packetloss'>
${translate("connectionindicator.packetloss")}
</span>
</td>
<td>${packetLoss}</td>
</tr>
<tr>
<td>
<span data-i18n='connectionindicator.resolution'>
${translate("connectionindicator.resolution")}
</span>
</td>
<td>
${resolutionStr}
</td>
</tr>
</table>`);
if(this.videoContainer.videoSpanId == "localVideoContainer") { if(this.videoContainer.videoSpanId == "localVideoContainer") {
result += "<a class=\"jitsipopover__showmore link\" " + result += "<a class=\"jitsipopover__showmore link\" " +
@ -232,7 +258,7 @@ ConnectionIndicator.prototype.generateText = function () {
result += transport + "</table>"; result += transport + "</table>";
} }
return result; return result;
}; };