Ticket #26192: 26192.3.diff

src/wp-admin/css/wp-admin.css

@@ -6767 +6767 @@
 .theme-overlay .theme-wrap {
         clear: both;
         position: fixed;
-        top: 120px;
+        top: 9%;
         left: 190px;
-        right: 40px;
-        bottom: 80px;
+        right: 3%;
+        bottom: 5%;
         overflow: auto;
         background: #fff;
-        padding: 88px 40px 110px 40px;
-        -webkit-box-shadow: 0 1px 20px 5px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0,0,0,0.1);
-        box-shadow:         0 1px 20px 5px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0,0,0,0.1);
+        padding: 88px 40px 40px 40px;
+        -webkit-box-shadow: 0 1px 20px 5px rgba(0, 0, 0, 0.1);
+        box-shadow:         0 1px 20px 5px rgba(0, 0, 0, 0.1);
         z-index: 20;
+        margin-bottom: 69px;
+        box-sizing: border-box;
 }
 
 .theme-overlay .theme-wrap:after {
@@ -6790 +6792 @@
 .theme-overlay .theme-actions {
         position: fixed;
         text-align: center;
-        bottom: 80px;
+        bottom: 5%;
         left: 190px;
-        right: 40px;
+        right: 3%;
         padding: 20px 25px;
-        background: rgba(243, 243, 243 ,0.9);
-        border-top: 1px solid rgba(0,0,0,0.1);
+        background: #f3f3f3;
         z-index: 30;
+        box-sizing: border-box;
+        border: 1px solid #cacaca;
 }
 
+body.folded .theme-overlay .theme-wrap,
+body.folded .theme-overlay .theme-actions {
+        left: 70px;
+}
+
 .theme-overlay .theme-actions a {
         margin-right: 5px;
         margin-bottom: 0;
-        font-size: 16px;
-        line-height: 37px;
-        height: 37px;
-        padding: 0 20px 1px 20px;
 }
 
 .theme-overlay .theme-actions .delete-theme {
-        border-radius: 2px;
         color: #a00;
-        font-size: 14px;
-        padding: 0 10px;
         position: absolute;
         right: 10px;
         bottom: 20px;
         text-decoration: none;
+        border-color: transparent;
+        box-shadow: none;
+        background: transparent;
 }
 
 .theme-overlay .theme-actions .delete-theme:hover {
         background: #d54e21;
         color: #fff;
+        border-color: #d54e21;
 }
 
 .theme-overlay .theme-actions .active-theme,
@@ -7043 +7048 @@
                 margin-right: 0;
         }
 
+        body.folded .theme-overlay .theme-wrap,
+        body.folded .theme-overlay .theme-actions,
         .theme-overlay .theme-wrap,
         .theme-overlay .theme-actions {
                 right: 15%;
@@ -7079 +7086 @@
                 margin-right: -3px
         }
 
+        body.folded .theme-overlay .theme-wrap,
         .theme-overlay .theme-wrap {
                 top: 45px;
                 right: 0;
                 bottom: 0;
                 left: 0;
-                padding: 70px 20px 100px;
+                padding: 70px 20px 20px;
+                margin-bottom: 75px;
+                border: none;
         }
 
+        body.folded .theme-overlay .theme-actions,
         .theme-overlay .theme-actions {
                 right: 0;
                 bottom: 0;
                 left: 0;
-                padding: 10px;
+                border-left: none;
+                border-right: none;
+                border-bottom: none;
         }
 
         .theme-overlay .theme-screenshots {
@@ -7101 +7114 @@
         .theme-overlay .theme-info {
                 width: 50%;
         }
-
-        .theme-overlay .theme-actions .delete-theme {
-                bottom: 10px;
-        }
 }
 
 @media only screen and (max-width: 650px) {

src/wp-admin/themes.php

@@ -310 +310 @@
                 </div>
 
                 <# if ( ! data.active && data.actions.delete ) { #>
-                        <a href="{{{ data.actions.delete }}}" class="delete-theme"><?php _e( 'Delete' ); ?></a>
+                        <a href="{{{ data.actions.delete }}}" class="button button-secondary delete-theme"><?php _e( 'Delete' ); ?></a>
                 <# } #>
         </div>
 </script>