Jdlrobson has uploaded a new change for review.

  https://gerrit.wikimedia.org/r/95453


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
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 templates/overlays/cleanup.html
11 files changed, 76 insertions(+), 25 deletions(-)


  git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MobileFrontend 
refs/changes/53/95453/1

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/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 51cb881..46f1580 100644
--- a/less/modules/issues.less
+++ b/less/modules/issues.less
@@ -1,33 +1,55 @@
 @import "../mixins.less";
 
-a.mw-mf-cleanup {
-       display: block;
-       padding: 10px 15px 10px 44px;
-       background-image: url(images/issues-blue.png);
+@iconSize: 24px;
+.icon-24px {
+       .background-size( @iconSize, @iconSize );
        background-repeat: no-repeat;
-       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;
-       }
 }
 
-.overlay,
-.mw-mf-overlay {
-       .cleanup {
-               margin: @contentMarginRight @contentMarginRight 0 
@contentMarginRight;
+.mw-mf-cleanup {
+       display: block;
+       padding: 10px 15px 10px 44px;
+       background-image: url(images/issues/blue.png);
+       margin-bottom: 4px;
+       background-position: 10px center;
+}
+
+.stable {
+       .mw-mf-cleanup {
+
+               &:hover {
+                       background-image: url(images/issues/gray.png);
+                       text-decoration: none;
+                       color: #565656;
+                       background-color: #f0f0f0;
+               }
        }
 }
 
 .mw-mf-overlay .cleanup {
+       margin: @contentMarginRight @contentMarginRight 0 @contentMarginRight;
        img {
                display: block;
                margin: 0 auto 1em auto;
        }
 }
 
+.alpha,
+.beta {
+       .mw-mf-cleanup {
+               background-image: url(images/issues/blue-triangle.png);
+       }
+
+       // overlay styles
+       .overlay {
+               .cleanup {
+                       margin: 0 @overlayHeadingIndent;
+                       li {
+                               padding: @iconSize * 2.5 @contentMarginRight 
@iconSize @contentMarginRight;
+                               background-position: center @iconSize;
+                               background-image: 
url(images/issues/gray-triangle.png);
+                               border-bottom: solid 1px @grayLight;
+                       }
+               }
+       }
+}
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: newchange
Gerrit-Change-Id: I29976d8201d7f426878fa1c7f31eff5f04dca8ee
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/MobileFrontend
Gerrit-Branch: master
Gerrit-Owner: Jdlrobson <[email protected]>

_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits

Reply via email to