Theme editor restyling from hansengel. see #5871

git-svn-id: http://svn.automattic.com/wordpress/trunk@6878 1a063a9b-81f0-0310-95a4-ce76da25c4cd

wp-admin/css/theme-editor.css

@@ -0,0 +1,45 @@
+#template textarea {
+	font: small 'Courier New', Courier, monospace;
+	width: 97%;
+}
+
+#templateside {
+	float: right;
+	width: 200px;
+	overflow: hidden;
+	position: absolute;
+	right: 15%;
+	top: 250px;
+}
+
+#templateside h3, #postcustom p.submit {
+	margin: 0;
+}
+
+#templateside ol, #templateside ul {
+	list-style: none;
+	margin: .5em;
+	padding: 0;
+}
+
+#templateside ol li, #templateside ul li {
+	margin: 1px 0px;
+}
+
+#themeselector {
+	padding-right: 5px;
+	float: right;
+	position: relative;
+	bottom: 25px;
+}
+
+.nonessential {
+	font-size: small;
+	color: #999999;
+}
+
+.highlight {
+	background-color: #E4F2FD;
+	padding: 1px;
+	color: #d54e21;
+}

wp-admin/theme-editor.php

@@ -5,6 +5,7 @@ $title = __("Edit Themes");
 $parent_file = 'themes.php';
 
 wp_reset_vars(array('action', 'redirect', 'profile', 'error', 'warning', 'a', 'file', 'theme'));
+wp_admin_css( 'css/theme-editor' );
 
 $themes = get_themes();
 
@@ -78,42 +79,64 @@ default:
 	?>
 <?php if (isset($_GET['a'])) : ?>
  <div id="message" class="updated fade"><p><?php _e('File edited successfully.') ?></p></div>
-<?php endif; ?>
+<?php endif; 
- <div class="wrap">
-	<form name="theme" action="theme-editor.php" method="post">
-		<?php _e('Select theme to edit:') ?>
-		<select name="theme" id="theme">
-	<?php
-		foreach ($themes as $a_theme) {
-		$theme_name = $a_theme['Name'];
-		if ($theme_name == $theme) $selected = " selected='selected'";
-		else $selected = '';
-		$theme_name = attribute_escape($theme_name);
-		echo "\n\t<option value=\"$theme_name\" $selected>$theme_name</option>";
-	}
-?>
- </select>
- <input type="submit" name="Submit" value="<?php _e('Select &raquo;') ?>" class="button" />
- </form>
- </div>
 
- <div class="wrap">
+$description = get_file_description($file);
-  <?php
+$desc_header = ( $description != $file_show ) ? "$description</strong> (%s)" : "%s";
-	if ( is_writeable($real_file) ) {
+?>
-		echo '<h2>' . sprintf(__('Editing <code>%s</code>'), $file_show) . '</h2>';
+<div class="wrap">
-	} else {
+<div class="bordertitle">
-		echo '<h2>' . sprintf(__('Browsing <code>%s</code>'), $file_show) . '</h2>';
+	<h2 style="border: none; padding-bottom: 0px;">Theme Editor</h2>
-	}
+	<form id="themeselector" name="theme" action="theme-editor.php" method="post">
-	?>
+		<strong><?php _e('Select theme to edit: '); ?></strong>
+		<select name="theme" id="theme" style="margin: 0; padding: 0;">
+<?php
+	foreach ($themes as $a_theme) {
+	$theme_name = $a_theme['Name'];
+	if ($theme_name == $theme) $selected = " selected='selected'";
+	else $selected = '';
+	$theme_name = attribute_escape($theme_name);
+	echo "\n\t<option value=\"$theme_name\" $selected>$theme_name</option>";
+}
+?>
+		</select>
+		<input type="submit" name="Submit" value="<?php _e('Select') ?>" class="button" style="padding: 0px;" />
+	</form>
+</div>
+<br style="clear: both;" />
+<div class="tablenav" style="margin-right: 210px;">
+<div style="float: left;">
+<big><strong><?php echo sprintf($desc_header, $file_show); ?></big>
+</div>
+<br style="clear: both;" />
+</div>
+<br style="clear: both;" />
 	<div id="templateside">
-	<h3><?php printf(__("<strong>'%s'</strong> theme files"), $theme) ?></h3>
+	<h3 id="bordertitle" style="margin-bottom: 10px;"><?php _e("Theme Files"); ?></h3>
 
 <?php
 if ($allowed_files) :
 ?>
+	<h4 style="margin-bottom: 0px;"><?php _e('Templates'); ?></h4>
 	<ul>
-<?php foreach($allowed_files as $allowed_file) : ?>
+<?php foreach($themes[$theme]['Template Files'] as $template_file) :
-		 <li><a href="theme-editor.php?file=<?php echo "$allowed_file"; ?>&amp;theme=<?php echo urlencode($theme) ?>"><?php echo get_file_description($allowed_file); ?></a></li>
+		$description = get_file_description($template_file);
+		$template_show = basename($template_file);
+		$filedesc = ( $description != $template_file ) ? "$description <span class='nonessential'>($template_show)</span></small>" : "$description";
+		$filedesc = ( $template_file == $file ) ? "<span class='highlight'>$description <span class='nonessential'>($template_show)</span></span>" : $filedesc;
+		?>
+		<li><a href="theme-editor.php?file=<?php echo "$template_file"; ?>&amp;theme=<?php echo urlencode($theme) ?>"><?php echo $filedesc ?></a></li>
+<?php endforeach; ?>
+	</ul>
+	<h4 style="margin-bottom: 0px;"><?php _e('Styles'); ?></h4>
+	<ul>
+<?php foreach($themes[$theme]['Stylesheet Files'] as $style_file) : 
+		$description = get_file_description($style_file);
+		$style_show = basename($style_file);
+		$filedesc = ( $description != $style_file ) ? "$description <span class='nonessential'>($style_show)</span>" : "$description";
+		$filedesc = ( $style_file == $file ) ? "<span class='highlight'>$description <span class='nonessential'>($style_show)</span></span>" : $filedesc;
+		?>
+		<li><a href="theme-editor.php?file=<?php echo "$style_file"; ?>&amp;theme=<?php echo urlencode($theme) ?>"><?php echo $filedesc ?></a></li>
 <?php endforeach; ?>
 	</ul>
 <?php endif; ?>

wp-admin/wp-admin.css

@@ -380,27 +380,6 @@ input.delete:hover {
 	zoom: 1;
 }
 
-#template textarea {
-	font: small 'Courier New', Courier, monospace;
-	width: 97%;
-}
-
-#templateside {
-	float: right;
-	width: 170px;
-	overflow: hidden;
-}
-
-#templateside h3, #postcustom p.submit {
-	margin: 0;
-}
-
-#templateside ol, #templateside ul {
-	list-style: none;
-	margin: .5em;
-	padding: 0;
-}
-
 .active td {
 	background: #BEB;
 }
@@ -1219,6 +1198,11 @@ p#post-search {
 	padding: 0 0 .2em 1px;
 }
 
+.bordertitle {
+	padding-bottom: 5px;
+	border-bottom: 1px solid #dadada;
+}
+
 /* Global classes */
 .wp-hidden-children .wp-hidden-child { display: none; }
 .wp-no-js-hidden { display: none; }