Ticket #26459: 26459.2.diff

wp-admin/js/theme.js

@@ -250 +250 @@
                 this.activeTheme();
                 // Set up navigation events
                 this.navigation();
+                // Checks screenshot size
+                this.screenshotCheck( this.$el );
         },
 
         // Adds a class to the currently active theme
@@ -352 +354 @@
         previousTheme: function() {
                 var self = this;
                 self.trigger( 'theme:previous', self.model.cid );
+        },
+
+        // Checks if the theme screenshot is the old 300px width version
+        // and adds a corresponding class if it's true
+        screenshotCheck: function( el ) {
+                var screenshot, image, width;
+
+                screenshot = el.find( '.screenshot img' );
+                image = new Image();
+                image.src = screenshot.attr( 'src' );
+
+                // Width check
+                if ( image.width <= 300 ) {
+                        el.addClass( 'small-screenshot' );
+                }
         }
 });
 

wp-admin/css/wp-admin.css

@@ -6894 +6894 @@
         top: 0;
         width: 100%;
 }
+/* Handles old 300px screenshots */
+.theme-overlay.small-screenshot .theme-screenshots {
+        position: absolute;
+        width: 302px;
+}
+.theme-overlay.small-screenshot .theme-info {
+        margin-left: 350px;
+        width: auto;
+}
 
 /* Other screenshots, shown small and square */
 .theme-overlay .screenshot.thumb {
@@ -7162 +7171 @@
         .theme-browser .theme .theme-actions {
                 padding: 5px 10px 4px 10px;
         }
+        .theme-overlay.small-screenshot .theme-screenshots {
+                position: static;
+                float: none;
+                max-width: 302px;
+        }
+        .theme-overlay.small-screenshot .theme-info {
+                margin-left: 0;
+                width: auto;
+        }
 }
 
 @media only screen and (max-width: 480px) {