diff options
author | Daniel Calviño Sánchez <danxuliu@gmail.com> | 2019-08-26 03:44:30 +0300 |
---|---|---|
committer | Daniel Calviño Sánchez <danxuliu@gmail.com> | 2019-08-28 11:09:39 +0300 |
commit | 3e3506b11ba3d502114b1bac88ddcb2f0bd938c3 (patch) | |
tree | 8a7a6513c96327384a012be2319096d23acd8a5c | |
parent | b88d53d918cee60d0f1aac29dd2079f53a7e97c7 (diff) |
Replace "Copy link" tooltip with explicit label
Now that the management actions were moved to a menu there is enough
room to show a label for the "Copy link" button.
Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
-rw-r--r-- | css/style.scss | 32 | ||||
-rw-r--r-- | js/views/callinfoview.js | 13 | ||||
-rw-r--r-- | js/views/templates.js | 6 | ||||
-rw-r--r-- | js/views/templates/callinfoview.handlebars | 2 |
4 files changed, 40 insertions, 13 deletions
diff --git a/css/style.scss b/css/style.scss index 632f17036..42b69ed50 100644 --- a/css/style.scss +++ b/css/style.scss @@ -976,10 +976,30 @@ body:not(#body-public) .participantWithList > li > span:not(.currentUser):not(.g margin-left: auto; } - .clipboard-button .button, + .clipboard-button button { + display: flex; + align-items: center; + + > span { + cursor: pointer; + + /* Override reduced opacity set for button icons in server, as the + * button is already dimmed. */ + opacity: 1; + } + + /* Override appearance set for button text in server, as this button has + * no background. */ + padding: 0; + + > span { + color: var(--color-main-text); + font-weight: normal; + } + } + + .clipboard-button button, .room-moderation-button .button { - width: 44px; - height: 44px; background-color: transparent; border: none; margin: 0; @@ -992,6 +1012,12 @@ body:not(#body-public) .participantWithList > li > span:not(.currentUser):not(.g } } + .clipboard-button .icon, + .room-moderation-button .button { + width: 44px; + height: 44px; + } + .room-moderation-button .menu { /* Values copied from apps.scss in server. */ $popoveritem-height: 44px; diff --git a/js/views/callinfoview.js b/js/views/callinfoview.js index 096e1d76a..886390af6 100644 --- a/js/views/callinfoview.js +++ b/js/views/callinfoview.js @@ -54,6 +54,7 @@ showRoomModerationMenu: canModerate && (canFullModerate || isPublic), canFullModerate: canFullModerate, linkCheckboxLabel: t('spreed', 'Share link'), + copyLinkLabel: t('spreed', 'Copy link'), isPublic: isPublic, passwordInputPlaceholder: this.model.get('hasPassword')? t('spreed', 'Change password'): t('spreed', 'Set password'), isDeletable: canModerate && (Object.keys(this.model.get('participants')).length > 2 || this.model.get('numGuests') > 0) @@ -173,8 +174,8 @@ this.ui.clipboardButton.attr('data-clipboard-text', completeURL); this.ui.clipboardButton.tooltip({ placement: 'bottom', - trigger: 'hover', - title: t('spreed', 'Copy link') + trigger: 'manual', + title: t('core', 'Link copied!') }); this.initClipboard(); @@ -305,9 +306,7 @@ .tooltip({placement: 'bottom', trigger: 'manual'}) .tooltip('show'); _.delay(function() { - $input.tooltip('hide') - .attr('data-original-title', t('core', 'Copy link')) - .tooltip('_fixTitle'); + $input.tooltip('hide'); }, 3000); }); this._clipboard.on('error', function (e) { @@ -327,9 +326,7 @@ .tooltip({placement: 'bottom', trigger: 'manual'}) .tooltip('show'); _.delay(function () { - $input.tooltip('hide') - .attr('data-original-title', t('spreed', 'Copy link')) - .tooltip('_fixTitle'); + $input.tooltip('hide'); }, 3000); }); } diff --git a/js/views/templates.js b/js/views/templates.js index 1e0817c1d..e1c4004f2 100644 --- a/js/views/templates.js +++ b/js/views/templates.js @@ -48,7 +48,11 @@ templates['callinfoview'] = template({"1":function(container,depth0,helpers,part + alias4(((helper = (helper = helpers.fileLinkTitle || (depth0 != null ? depth0.fileLinkTitle : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"fileLinkTitle","hash":{},"data":data}) : helper))) + "\">\n <span class=\"icon icon-file\"></span>\n </a>\n"; },"3":function(container,depth0,helpers,partials,data) { - return " <div class=\"clipboard-button\"><button class=\"button icon-clippy\"></button></div>\n"; + var helper; + + return " <div class=\"clipboard-button\"><button><span class=\"icon icon-clippy\"/><span>" + + container.escapeExpression(((helper = (helper = helpers.copyLinkLabel || (depth0 != null ? depth0.copyLinkLabel : depth0)) != null ? helper : helpers.helperMissing),(typeof helper === "function" ? helper.call(depth0 != null ? depth0 : (container.nullContext || {}),{"name":"copyLinkLabel","hash":{},"data":data}) : helper))) + + "</span></button></div>\n"; },"5":function(container,depth0,helpers,partials,data) { var stack1, alias1=depth0 != null ? depth0 : (container.nullContext || {}); diff --git a/js/views/templates/callinfoview.handlebars b/js/views/templates/callinfoview.handlebars index 807ac107b..4a3e52dbe 100644 --- a/js/views/templates/callinfoview.handlebars +++ b/js/views/templates/callinfoview.handlebars @@ -9,7 +9,7 @@ <div class="call-controls-container"> <div class="call-button"></div> {{#if isPublic}} - <div class="clipboard-button"><button class="button icon-clippy"></button></div> + <div class="clipboard-button"><button><span class="icon icon-clippy"/><span>{{copyLinkLabel}}</span></button></div> {{/if}} {{#if showRoomModerationMenu}} <div class="room-moderation-button"> |