jenkins-bot has submitted this change and it was merged. (
https://gerrit.wikimedia.org/r/349344 )
Change subject: Generate cog icon via ResourceLoaderImage module
......................................................................
Generate cog icon via ResourceLoaderImage module
* Merge mwe-popups-icon with mwe-popups-settings-icon
* Remove PNG - now generated by the ResourceLoader module
* Adjust popup footer paddings/widths and store them in variables
* RTL and LTR compatible
Bug: T133956
Change-Id: I14ccd7b6731e9ec49f9959411fd17f7c9fdf43be
---
M extension.json
R resources/ext.popups.images/cog.svg
D resources/ext.popups/images/cog.png
M resources/ext.popups/styles/ext.popups.core.less
M resources/ext.popups/templates/preview.mustache
5 files changed, 21 insertions(+), 25 deletions(-)
Approvals:
jenkins-bot: Verified
Phuedx: Looks good to me, approved
diff --git a/extension.json b/extension.json
index 6f0a3e3..5067427 100644
--- a/extension.json
+++ b/extension.json
@@ -71,6 +71,7 @@
"class": "ResourceLoaderImageModule",
"prefix": "mw-ui",
"images": {
+ "popups-settings":
"resources/ext.popups.images/cog.svg",
"popups-close":
"resources/ext.popups.images/close.svg"
}
},
diff --git a/resources/ext.popups/images/cog.svg
b/resources/ext.popups.images/cog.svg
similarity index 100%
rename from resources/ext.popups/images/cog.svg
rename to resources/ext.popups.images/cog.svg
diff --git a/resources/ext.popups/images/cog.png
b/resources/ext.popups/images/cog.png
deleted file mode 100644
index c1242ac..0000000
--- a/resources/ext.popups/images/cog.png
+++ /dev/null
Binary files differ
diff --git a/resources/ext.popups/styles/ext.popups.core.less
b/resources/ext.popups/styles/ext.popups.core.less
index eadb951..4650ecd 100644
--- a/resources/ext.popups/styles/ext.popups.core.less
+++ b/resources/ext.popups/styles/ext.popups.core.less
@@ -5,6 +5,11 @@
* https://en.wikipedia.org/wiki/User:Yair_rand/NavPopupsRestyled.js
*/
+@popupPadding: 16px;
+@popupWidth: 300px;
+@popupTallWidth: 215px;
+@cogIconSize: 30px;
+
#mwe-popups-svg {
position: absolute;
top: -1000px;
@@ -32,18 +37,14 @@
left: @left;
}
-.mwe-popups-icon {
- display: inline-block;
- vertical-align: middle;
- cursor: pointer;
- margin: 0;
- margin-top: -5px;
- height: 24px;
- width: 30px;
+.mwe-popups-settings-icon {
+ // For purpose of active and hover states
border-radius: 2px;
- background-position: center center;
- background-repeat: no-repeat;
- background-size: 24px 24px;
+ // Icon sizes are relative to font size. Override any parents.
+ font-size: 16px;
+ // position icon
+ /* stylelint-disable value-keyword-case */
+ margin-right: -@iconSize / 2;
&:hover {
background-color: @colorGray14;
@@ -52,12 +53,6 @@
&:active {
background-color: @colorGray12;
}
-}
-
-.mwe-popups-settings-icon {
-
- // N.B. filenames are relative to the LESS file.
- .background-image-svg( '../images/cog.svg', '../images/cog.png' );
}
.mwe-popups-sade-face-icon {
@@ -93,7 +88,7 @@
text-decoration: none;
footer {
- padding: 16px;
+ padding: @popupPadding;
margin: 0;
font-size: 10px;
position: absolute;
@@ -101,7 +96,7 @@
/* @noflip */
left: 0;
- .mwe-popups-icon {
+ .mwe-popups-settings-icon {
float: right;
}
}
@@ -113,7 +108,7 @@
// SVG element is forced not to occlude the truncating
pseudo-element and
// the settings cog in IE9-11.
padding: 16px 0;
- margin: 0 16px;
+ margin: 0 @popupPadding;
display: block;
color: #000;
@@ -175,7 +170,7 @@
}
.mwe-popups-extract {
- width: 215px;
+ width: @popupTallWidth;
height: 142px;
overflow: hidden;
/* @noflip */
@@ -183,12 +178,12 @@
}
footer {
- width: 215px;
+ width: @popupTallWidth;
}
}
&.mwe-popups-is-not-tall {
- width: 300px;
+ width: @popupWidth;
.mwe-popups-extract {
max-height: 120px;
@@ -198,7 +193,7 @@
}
footer {
- width: 270px;
+ width: @popupWidth - @cogIconSize;
}
}
diff --git a/resources/ext.popups/templates/preview.mustache
b/resources/ext.popups/templates/preview.mustache
index 874aeca..8d242d7 100644
--- a/resources/ext.popups/templates/preview.mustache
+++ b/resources/ext.popups/templates/preview.mustache
@@ -6,7 +6,7 @@
{{/hasThumbnail}}
<a dir="{{languageDirection}}" lang="{{languageCode}}"
class="mwe-popups-extract" href="{{url}}"></a>
<footer>
- <a class="mwe-popups-icon mwe-popups-settings-icon"></a>
+ <a class="mwe-popups-settings-icon mw-ui-icon mw-ui-icon-element
mw-ui-icon-popups-settings"></a>
</footer>
</div>
</div>
--
To view, visit https://gerrit.wikimedia.org/r/349344
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I14ccd7b6731e9ec49f9959411fd17f7c9fdf43be
Gerrit-PatchSet: 5
Gerrit-Project: mediawiki/extensions/Popups
Gerrit-Branch: master
Gerrit-Owner: Jdlrobson <[email protected]>
Gerrit-Reviewer: Jdlrobson <[email protected]>
Gerrit-Reviewer: Phuedx <[email protected]>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
