Petar.petkovic has uploaded a new change for review. ( https://gerrit.wikimedia.org/r/384112 )
Change subject: Use upstream icon for refresh on CX dashboard ...................................................................... Use upstream icon for refresh on CX dashboard Change-Id: I0aad1d7b719deb6c15bf24d65d2f4f8c9bbb25af --- M extension.json M modules/dashboard/ext.cx.suggestionlist.js D modules/dashboard/images/refresh.png D modules/dashboard/images/refresh.svg M modules/dashboard/styles/ext.cx.suggestionlist.less 5 files changed, 39 insertions(+), 24 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/ContentTranslation refs/changes/12/384112/1 diff --git a/extension.json b/extension.json index 1da09f5..eab4bc5 100644 --- a/extension.json +++ b/extension.json @@ -941,7 +941,9 @@ "ext.cx.recommendtool.client", "ext.cx.util", "jquery.uls.data", - "mediawiki.storage" + "mediawiki.storage", + "oojs-ui-widgets", + "oojs-ui.styles.icons-interactions" ], "messages": [ "ellipsis", diff --git a/modules/dashboard/ext.cx.suggestionlist.js b/modules/dashboard/ext.cx.suggestionlist.js index 04e539c..5e99161 100644 --- a/modules/dashboard/ext.cx.suggestionlist.js +++ b/modules/dashboard/ext.cx.suggestionlist.js @@ -914,11 +914,15 @@ this.$refreshTrigger.show(); return; } - - this.$refreshTrigger = $( '<div>' ) - .addClass( 'cx-suggestionlist__refresh' ) - .text( mw.msg( 'cx-suggestionlist-refresh' ) ) - .on( 'click', this.refreshPublicLists.bind( this ) ); + this.$refreshTrigger = new OO.ui.ButtonWidget( { + framed: false, + classes: [ 'cx-suggestionlist__refresh' ], + flags: [ + 'progressive' + ], + icon: 'reload', + label: mw.msg( 'cx-suggestionlist-refresh' ) + } ).on( 'click', this.refreshPublicLists.bind( this ) ).$element; this.$publicCollectionContainer.append( this.$refreshTrigger ); }; diff --git a/modules/dashboard/images/refresh.png b/modules/dashboard/images/refresh.png deleted file mode 100644 index 96ee533..0000000 --- a/modules/dashboard/images/refresh.png +++ /dev/null Binary files differ diff --git a/modules/dashboard/images/refresh.svg b/modules/dashboard/images/refresh.svg deleted file mode 100644 index 8177d78..0000000 --- a/modules/dashboard/images/refresh.svg +++ /dev/null @@ -1 +0,0 @@ -<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><title>refresh</title><path fill="#36C" fill-rule="evenodd" d="M11.806 8.147L20 12.335v-8.92l-3.06 1.768C15.255 2.6 12.375 1 9.218 1 4.128 1 0 5.127 0 10.218c0 5.09 4.127 9.218 9.218 9.218 2.638 0 5.1-1.116 6.836-3.034l-1.536-1.39c-1.347 1.49-3.253 2.353-5.3 2.353-3.947 0-7.147-3.2-7.147-7.147S5.27 3.07 9.22 3.07c2.41 0 4.61 1.203 5.925 3.15l-3.337 1.927z"/></svg> \ No newline at end of file diff --git a/modules/dashboard/styles/ext.cx.suggestionlist.less b/modules/dashboard/styles/ext.cx.suggestionlist.less index 7fb6ec8..e892bfc 100644 --- a/modules/dashboard/styles/ext.cx.suggestionlist.less +++ b/modules/dashboard/styles/ext.cx.suggestionlist.less @@ -58,8 +58,7 @@ } .cx-suggestionlist__collapse, -.cx-suggestionlist__expand, -.cx-suggestionlist__refresh { +.cx-suggestionlist__expand { .mw-ui-one-whole; background-color: #fff; border: 1px solid @colorGray12; @@ -74,27 +73,38 @@ } .cx-suggestionlist__refresh { - color: @colorProgressive; + background-color: #fff; + width: 100%; margin-top: -10px; + border: 1px solid @colorGray12; border-width: 1px 0; border-radius: 0 0 @borderRadius @borderRadius; - padding: 20px; .box-shadow-card; - font-weight: bold; + text-align: center; - &:before { - @iconSize: 16px; + &:hover { + background-color: #eff3fb; + } - content: ''; - .background-image-svg('../images/refresh.svg', '../images/refresh.png'); - background-repeat: no-repeat; - background-size: @iconSize; - display: inline-block; - position: relative; - top: 2px; - width: @iconSize; - height: @iconSize; - margin-right: 8px; + > .oo-ui-buttonElement-button { + width: 100%; + border: 0; + + .oo-ui-iconElement-icon, + .oo-ui-labelElement-label { + display: inline-block; + position: static; + vertical-align: middle; + } + + .oo-ui-iconElement-icon { + min-height: 20px; + } + } + + // Needed to beat specificity for padding + &.oo-ui-buttonElement-frameless.oo-ui-labelElement.oo-ui-iconElement > .oo-ui-buttonElement-button { + padding: 20px; } } -- To view, visit https://gerrit.wikimedia.org/r/384112 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: I0aad1d7b719deb6c15bf24d65d2f4f8c9bbb25af Gerrit-PatchSet: 1 Gerrit-Project: mediawiki/extensions/ContentTranslation Gerrit-Branch: master Gerrit-Owner: Petar.petkovic <ppetko...@wikimedia.org> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits