jenkins-bot has submitted this change and it was merged.
Change subject: Story 1347 2/2: Update this page has issues in beta
......................................................................
Story 1347 2/2: Update this page has issues in beta
This concludes the required style changes.
Moved existing images to issues folder
Change-Id: I29976d8201d7f426878fa1c7f31eff5f04dca8ee
---
M javascripts/modules/issues/issues.js
M less/common/OverlayNew.less
D less/modules/images/issues-blue.png
D less/modules/images/issues-gray.png
A less/modules/images/issues/blue-triangle.png
A less/modules/images/issues/blue-triangle.svg
A less/modules/images/issues/blue.png
A less/modules/images/issues/gray-triangle.png
A less/modules/images/issues/gray-triangle.svg
A less/modules/images/issues/gray.png
M less/modules/issues.less
M less/variables.less
M templates/overlays/cleanup.html
13 files changed, 79 insertions(+), 17 deletions(-)
Approvals:
Awjrichards: Looks good to me, approved
jenkins-bot: Verified
diff --git a/javascripts/modules/issues/issues.js
b/javascripts/modules/issues/issues.js
index 7c118d8..e1880f7 100644
--- a/javascripts/modules/issues/issues.js
+++ b/javascripts/modules/issues/issues.js
@@ -30,19 +30,23 @@
// clean it up a little
$metadata.find( '.NavFrame' ).remove();
$metadata.each( function() {
- var $this = $( this );
+ var $this = $( this ), issue;
if ( $( this ).find( 'table.ambox' ).length === 0 ) {
- issues.push( {
- // FIXME: [templates] might be
inconsistent
+ // FIXME: [templates] might be inconsistent
+ issue = {
// .ambox- is used e.g. on eswiki
- icon: $this.find( '.mbox-image img,
.ambox-image img' ).attr( 'src' ),
text: $this.find( '.mbox-text,
.ambox-text' ).html()
- } );
+ };
+ // new overlays have same icon for all issues
+ if ( !useNewOverlays ) {
+ issue.icon = $this.find( '.mbox-image
img, .ambox-image img' ).attr( 'src' );
+ }
+ issues.push( issue );
}
} );
- $link = $( '<a class="mw-mf-cleanup">' );
+ $link = $( '<a class="mw-mf-cleanup icon-24px">' );
if ( useNewOverlays ) {
overlay = new CleanupOverlayNew( {
parent: parentOverlay,
diff --git a/less/common/OverlayNew.less b/less/common/OverlayNew.less
index 0c924a1..5e5dbb5 100644
--- a/less/common/OverlayNew.less
+++ b/less/common/OverlayNew.less
@@ -1,6 +1,10 @@
// FIXME: merge with overlays.less when OverlayNew gets to stable
@import "../mixins.less";
+@headingMarginV: 1em;
+@headingFontSize: 1em;
+@buttonSize: @headingFontSize + @headingMarginV * 2 + @headerMargin;
+
.overlay-enabled {
#mw-mf-page-center {
overflow: hidden;
diff --git a/less/modules/images/issues-blue.png
b/less/modules/images/issues-blue.png
deleted file mode 100644
index 1630867..0000000
--- a/less/modules/images/issues-blue.png
+++ /dev/null
Binary files differ
diff --git a/less/modules/images/issues-gray.png
b/less/modules/images/issues-gray.png
deleted file mode 100644
index 18ce0b8..0000000
--- a/less/modules/images/issues-gray.png
+++ /dev/null
Binary files differ
diff --git a/less/modules/images/issues/blue-triangle.png
b/less/modules/images/issues/blue-triangle.png
new file mode 100644
index 0000000..30853ef
--- /dev/null
+++ b/less/modules/images/issues/blue-triangle.png
Binary files differ
diff --git a/less/modules/images/issues/blue-triangle.svg
b/less/modules/images/issues/blue-triangle.svg
new file mode 100644
index 0000000..ab6b2f0
--- /dev/null
+++ b/less/modules/images/issues/blue-triangle.svg
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version:
6.00 Build 0) -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd";>
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg";
xmlns:xlink="http://www.w3.org/1999/xlink"; x="0px" y="0px"
+ width="80px" height="80px" viewBox="0 0 80 80" enable-background="new
0 0 80 80" xml:space="preserve">
+<g>
+ <polygon fill="#3366BB" points="1.112,73.678 39.997,6.322 78.889,73.678
"/>
+ <path fill="#FFFFFF" d="M43.525,57.7v7.103h-6.823V57.7H43.525z
M41.496,51.795h-3.272L36.471,39.55v-7.854h6.824v7.854
+ L41.496,51.795z"/>
+</g>
+</svg>
diff --git a/less/modules/images/issues/blue.png
b/less/modules/images/issues/blue.png
new file mode 100644
index 0000000..0d9b1b3
--- /dev/null
+++ b/less/modules/images/issues/blue.png
Binary files differ
diff --git a/less/modules/images/issues/gray-triangle.png
b/less/modules/images/issues/gray-triangle.png
new file mode 100644
index 0000000..93edb39
--- /dev/null
+++ b/less/modules/images/issues/gray-triangle.png
Binary files differ
diff --git a/less/modules/images/issues/gray-triangle.svg
b/less/modules/images/issues/gray-triangle.svg
new file mode 100644
index 0000000..566bcac
--- /dev/null
+++ b/less/modules/images/issues/gray-triangle.svg
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version:
6.00 Build 0) -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd";>
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg";
xmlns:xlink="http://www.w3.org/1999/xlink"; x="0px" y="0px"
+ width="80px" height="80px" viewBox="0 0 80 80" enable-background="new
0 0 80 80" xml:space="preserve">
+<g>
+ <polygon fill="#CCCCCC" points="1.092,73.695 39.998,6.305 78.908,73.695
"/>
+ <path fill="#FFFFFF" d="M43.528,57.71v7.104h-6.829V57.71H43.528z
M41.498,51.802h-3.275l-1.754-12.253V31.69h6.828v7.858
+ L41.498,51.802z"/>
+</g>
+</svg>
diff --git a/less/modules/images/issues/gray.png
b/less/modules/images/issues/gray.png
new file mode 100644
index 0000000..f7fe899
--- /dev/null
+++ b/less/modules/images/issues/gray.png
Binary files differ
diff --git a/less/modules/issues.less b/less/modules/issues.less
index e829c5e..4e1e578 100644
--- a/less/modules/issues.less
+++ b/less/modules/issues.less
@@ -1,23 +1,30 @@
@import "../mixins.less";
-a.mw-mf-cleanup {
+@iconSize: 24px;
+.icon-24px {
+ .background-size( @iconSize, @iconSize );
+ background-repeat: no-repeat;
+}
+
+.mw-mf-cleanup {
display: block;
padding: 10px 15px 10px 44px;
- background-image: url(images/issues-blue.png);
- background-repeat: no-repeat;
+ background-image: url(images/issues/blue.png);
margin-bottom: 4px;
- .background-size( 24px, 24px );
background-position: 10px center;
+}
- &:hover {
- background-image: url(images/issues-gray.png);
- text-decoration: none;
- color: #565656;
- background-color: #f0f0f0;
+.stable {
+ .mw-mf-cleanup {
+ &:hover {
+ background-image: url(images/issues/gray.png);
+ text-decoration: none;
+ color: #565656;
+ background-color: #f0f0f0;
+ }
}
}
-.overlay,
.mw-mf-overlay {
.cleanup {
margin: @contentMargin @contentMargin 0 @contentMargin;
@@ -31,3 +38,22 @@
}
}
+.alpha,
+.beta {
+ .mw-mf-cleanup {
+ background-image: url(images/issues/blue-triangle.png);
+ }
+
+ // overlay styles
+ .overlay {
+ .cleanup {
+ margin: 0 @headerMargin;
+ li {
+ padding: @iconSize * 2.5 @headerMargin
@iconSize @headerMargin;
+ background-position: center @iconSize;
+ background-image:
url(images/issues/gray-triangle.png);
+ border-bottom: solid 1px @grayLight;
+ }
+ }
+ }
+}
diff --git a/less/variables.less b/less/variables.less
index 60b558c..ecfc430 100644
--- a/less/variables.less
+++ b/less/variables.less
@@ -23,6 +23,9 @@
// page actions
@watchStarSize: 22px;
+// overlays
+@headerMargin: .4em;
+
@contentMargin: 16px;
// colors
diff --git a/templates/overlays/cleanup.html b/templates/overlays/cleanup.html
index 0a0411e..70798b9 100644
--- a/templates/overlays/cleanup.html
+++ b/templates/overlays/cleanup.html
@@ -1,5 +1,8 @@
<ul class="cleanup">
{{#issues}}
- <li><img src="{{icon}}"> {{{text}}}</li>
+ <li class="icon-24px">
+ {{#icon}}<img src="{{icon}}"> {{/icon}}
+ {{{text}}}
+ </li>
{{/issues}}
</ul>
--
To view, visit https://gerrit.wikimedia.org/r/95453
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I29976d8201d7f426878fa1c7f31eff5f04dca8ee
Gerrit-PatchSet: 5
Gerrit-Project: mediawiki/extensions/MobileFrontend
Gerrit-Branch: master
Gerrit-Owner: Jdlrobson <[email protected]>
Gerrit-Reviewer: Awjrichards <[email protected]>
Gerrit-Reviewer: JGonera <[email protected]>
Gerrit-Reviewer: jenkins-bot
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
