Changeset 20455

Timestamp:

04/12/2012 09:10:40 PM (14 years ago)

Author:

koopersmith

Message:

Theme list table style improvements. Make 'delete' link red and separate from other actions. New action separators. see #20403.

Location:

trunk/wp-admin

Files:

• css/wp-admin.dev.css (modified) (1 diff)
• includes/class-wp-themes-list-table.php (modified) (3 diffs)
• js/theme.dev.js (modified) (1 diff)

trunk/wp-admin/css/wp-admin.dev.css

@@ -4313 +4313 @@
 .available-theme .action-links {
         margin-top: 10px;
+        overflow: hidden;
+}
+
+.available-theme .action-links li {
+        float: left;
+        padding-right: 10px;
+        margin-right: 10px;
+        border-right: 1px solid #dfdfdf;
+}
+
+.available-theme .action-links li:last-child {
+        padding-right: 0;
+        margin-right: 0;
+        border-right: 0;
+}
+
+.available-theme .action-links .delete-theme {
+        float: right;
+        margin-right: 0;
+}
+
+.available-theme .action-links .delete-theme a {
+        color: red;
+        padding: 2px;
+}
+
+.available-theme .action-links .delete-theme a:hover {
+        background: red;
+        color: #fff;
+        text-decoration: none;
+}
+
+.available-theme .action-links p {
+        float: left;
 }
 

trunk/wp-admin/includes/class-wp-themes-list-table.php

@@ -142 +142 @@
                                 . '<a href="#" class="load-customize hide-if-no-js" ' . $customize_attributes . '>' . __( 'Customize' ) . '</a>';
                         if ( ! is_multisite() && current_user_can( 'delete_themes' ) )
-                                $actions[] = '<a class="submitdelete deletion" href="' . wp_nonce_url( "themes.php?action=delete&amp;template=$stylesheet", 'delete-theme_' . $stylesheet )
+                                $actions['delete'] = '<a class="submitdelete deletion" href="' . wp_nonce_url( "themes.php?action=delete&amp;template=$stylesheet", 'delete-theme_' . $stylesheet )
                                         . '" onclick="' . "return confirm( '" . esc_js( sprintf( __( "You are about to delete this theme '%s'\n  'Cancel' to stop, 'OK' to delete." ), $title ) )
                                         . "' );" . '">' . __( 'Delete' ) . '</a>';
 
-                        $actions = apply_filters( 'theme_action_links', $actions, $theme );
-
-                        $actions = implode ( ' | ', $actions );
+                        $actions       = apply_filters( 'theme_action_links', $actions, $theme );
+                        $delete_action = isset( $actions['delete'] ) ? '<div class="delete-theme">' . $actions['delete'] . '</div>' : '';
+                        unset( $actions['delete'] );
+
                         ?>
                         <a href="<?php echo $preview_link; ?>" class="load-customize screenshot" <?php echo $customize_attributes; ?>>
@@ -158 +159 @@
                         <div class="theme-author"><?php printf( __( 'By %s' ), $author ); ?></div>
                         <div class="action-links">
-                                <?php echo $actions; ?>
-                                <span class="separator hide-if-no-js">| </span><a href="#" class="theme-detail hide-if-no-js" tabindex='4'><?php _e('Details') ?></a>
+                                <ul>
+                                        <?php foreach ( $actions as $action ): ?>
+                                                <li><?php echo $action; ?></li>
+                                        <?php endforeach; ?>
+                                        <li class="hide-if-no-js"><a href="#" class="theme-detail" tabindex='4'><?php _e('Details') ?></a></li>
+                                </ul>
+                                <?php echo $delete_action; ?>
+
+                                <?php theme_update_available( $theme ); ?>
                         </div>
 
@@ -176 +184 @@
                         </div>
 
-                        <?php theme_update_available( $theme ); ?>
-
                         </div>
                 <?php

trunk/wp-admin/js/theme.dev.js

@@ -6 +6 @@
 jQuery( function($) {
         $('#availablethemes').on( 'click', '.theme-detail', function (event) {
-                $(this).parent().siblings('.themedetaildiv').toggle();
+                $(this).parents('.action-links').siblings('.themedetaildiv').toggle();
                 event.preventDefault();
         });