Changeset 17732

Timestamp:

04/27/2011 11:03:27 PM (12 years ago)

Author:

lancewillett

Message:

Twenty Eleven: theme options - see #17198

• First pass at Link Color CSS rules
• Add new function to return default values
• Implement better validation for hex color value
• Fix missing esc_attr()

Location:

trunk/wp-content/themes/twentyeleven

Files:

• inc/theme-options/theme-options.php (modified) (5 diffs)
• style.css (modified) (24 diffs)

trunk/wp-content/themes/twentyeleven/inc/theme-options/theme-options.php

@@ -77 +77 @@
 
 /**
- *  Return the current Twenty Eleven theme options, with default values as fallback
- */
-function twentyeleven_get_theme_options() {
-    $defaults = array(
+ *  Return the default Twenty Eleven theme option values
+ */
+function twentyeleven_get_default_theme_options() {
+    return array(
         'color_scheme' => 'light',
-        'link_color' => '1b8be0',
+        'link_color' => '#1b8be0',
         'theme_layout' => 'content-sidebar',
     );
+}
+
+/**
+ *  Return the current Twenty Eleven theme options, with default values as fallback
+ */
+function twentyeleven_get_theme_options() {
+    $defaults = twentyeleven_get_default_theme_options();
     $options = get_option( 'twentyeleven_theme_options', $defaults );
 
@@ -206 +213 @@
 
             <p class="submit">
-                <input type="submit" class="button-primary" value="<?php _e( 'Save Options', 'twentyeleven' ); ?>" />
+                <input type="submit" class="button-primary" value="<?php esc_attr_e( 'Save Options', 'twentyeleven' ); ?>" />
             </p>
         </form>
@@ -215 +222 @@
 /**
  * Sanitize and validate input. Accepts an array, return a sanitized array.
+ *
+ * todo set up Reset Options action
  */
 function twentyeleven_theme_options_validate( $input ) {
-    // todo get defaults, and use insteadd of null for fallback
-    // could also be used to trigger a Reset Options action
-
-    // Our color scheme option must actually be in our array of color scheme options
-    if ( ! isset( $input['color_scheme'] ) )
-        $input['color_scheme'] = null;
-    if ( ! array_key_exists( $input['color_scheme'], twentyeleven_color_schemes() ) )
-        $input['color_scheme'] = null;
-
-    // Our link color option must be safe text with no HTML tags
-    $input['link_color'] = wp_filter_nohtml_kses( $input['link_color'] );
-
-    // Our theme layout option must actually be in our array of theme layout options
-    if ( ! isset( $input['theme_layout'] ) )
-        $input['theme_layout'] = null;
-    if ( ! array_key_exists( $input['theme_layout'], twentyeleven_layouts() ) )
-        $input['theme_layout'] = null;
+    $defaults = twentyeleven_get_default_theme_options();
+
+    // Color scheme must be in our array of color scheme options
+    if ( ! isset( $input['color_scheme'] ) || ! array_key_exists( $input['color_scheme'], twentyeleven_color_schemes() ) )
+        $input['color_scheme'] = $defaults['color_scheme'];
+
+    // Link color must be 3 or 6 hexadecimal characters
+    if ( ! isset( $input[ 'link_color' ] ) ) {
+        $input['link_color'] = $defaults['link_color'];
+    } else {
+        if ( preg_match( '/^#?([a-f0-9]{3}){1,2}$/i', $input['link_color'] ) ) {
+            $link_color = $input['link_color'];
+            // If color value doesn't have a preceding hash, add it
+            if ( false === strpos( $link_color, '#' ) )
+                $link_color = '#' . $link_color;
+        } else {
+            $input['link_color'] = $defaults['link_color'];
+        }
+    }
+
+    // Theme layout must be in our array of theme layout options
+    if ( ! isset( $input['theme_layout'] ) || ! array_key_exists( $input['theme_layout'], twentyeleven_layouts() ) )
+        $input['theme_layout'] = $defaults['theme_layout'];
 
     return $input;
@@ -287 +302 @@
 
     // Is the link color just the default color?
-    if ( '1b8be0' == $current_link_color ) :
+    if ( '#1b8be0' == $current_link_color ) :
         return; // we don't need to do anything then
-
     else :
         ?>
@@ -296 +310 @@
                 a,
                 .entry-title a:hover {
-                    color: <?php echo $current_link_color ?>;
+                    color: <?php echo $current_link_color; ?>;
                 }
             </style>

trunk/wp-content/themes/twentyeleven/style.css

@@ -311 +311 @@
 /* Links */
 a {
-    color: #444;
+    color: #1B8BE0;
+    text-decoration: none;
 }
 a:visited {
-    color: #444;
 }
 a:focus,
 a:active,
 a:hover {
-    color: #1b8be0;
+    text-decoration: underline;
 }
 
@@ -455 +455 @@
 #branding #s {
     background: url(images/search.png) no-repeat 5px 6px;
+    -moz-border-radius: 2px;
+    border-radius: 2px;
     float: right;
     font-size: 14px;
@@ -516 +518 @@
     font-weight: bold;
     letter-spacing: 0;
-    text-decoration: none;
     text-transform: none;
 }
@@ -557 +558 @@
 }
 .entry-meta a {
-    color: #222;
-    font-weight: bold;
-    text-decoration: none;
+    font-weight: bold;
 }
 .entry-meta a:focus,
 .entry-meta a:active,
 .entry-meta a:hover {
-    color: #1b8be0;
 }
 .entry-content,
@@ -586 +584 @@
 }
 .entry-content a {
-    color: #1b8be0;
 }
 .entry-content a:hover {
-    color: #ff4b33;
 }
 .entry-content table,
@@ -643 +639 @@
 }
 .page-link a:hover {
-    background: #1b8be0;
-    color: #bfddf3;
+    background: #777;
+    color: #fff;
     font-weight: bold;
 }
@@ -730 +726 @@
 }
 .entry-header .comments-link a:hover {
-    background: #1b8be0;
-    border-color: #0861a5;
-    color: #bfddf3;
+    background: #777;
+    color: #fff;
+    border-color: #555;
 }
 .entry-header .comments-link .leave-reply {
@@ -767 +763 @@
 }
 .singular .entry-header a {
-    color: #1b8be0;
 }
 .singular .entry-header a:hover {
-    color: #ff4b33;
 }
 .singular footer.entry-meta {
@@ -791 +785 @@
 }
 .singular .entry-meta .edit-link a {
+    color: #fff;
     position: absolute;
     bottom: auto;
@@ -1219 +1214 @@
 }
 #content nav a {
-    color: #1b8be0;
     font-size: 12px;
     font-weight: bold;
     line-height: 2.2em;
-    text-decoration: none;
 }
 #content nav a:focus,
 #content nav a:active,
 #content nav a:hover {
-    color: #ff4b33;
 }
 #nav-above {
@@ -1293 +1285 @@
 }
 .widget a {
-    color: #1b8be0;
     font-weight: bold;
     text-decoration: none;
 }
 .widget a:hover {
-    color: #ff4b33;
+    text-decoration: underline;
 }
 
@@ -1474 +1465 @@
 }
 .comment-meta a {
-    color: #1b8be0;
-    text-decoration: none;
     font-weight: bold;
 }
@@ -1481 +1470 @@
 .comment-meta a:active,
 .comment-meta a:hover {
-    color: #ff4b33;
 }
 .commentlist .avatar {
@@ -1513 +1501 @@
 .commentlist .children .bypostauthor > article .comment-meta .vcard .avatar {
 }
-.comment-reply-link {
-    color: #1778c2;
+a.comment-reply-link {
     font-size: 12px;
     font-weight: bold;
-    text-decoration: none;
-}
-.comment-reply-link:hover {
+}
+.comment-reply-link:hover,
+.comment-reply-link:active,
+.comment-reply-link:focus {
 }
 
@@ -1532 +1520 @@
 }
 .commentlist > li.bypostauthor .comment-meta a {
-    color: #ccc;
-    text-decoration: none;
     font-weight: bold;
 }
@@ -1539 +1525 @@
 .commentlist > li.bypostauthor .comment-meta a:active,
 .commentlist > li.bypostauthor .comment-meta a:hover {
-    color: #ff4b33;
 }
 .commentlist > li.bypostauthor:before {
@@ -1545 +1530 @@
 }
 .commentlist > li.bypostauthor .comment-content a {
-    color: #1b8be0;
 }
 .commentlist > li.bypostauthor .comment-content a:focus,
 .commentlist > li.bypostauthor .comment-content a:active,
 .commentlist > li.bypostauthor .comment-content a:hover {
-    color: #ff4b33;
 }
 .commentlist > li.bypostauthor .comment-reply-link {
-    color: #ccc;
 }
 .commentlist > li.bypostauthor .comment-reply-link:focus,
 .commentlist > li.bypostauthor .comment-reply-link:active,
 .commentlist > li.bypostauthor .comment-reply-link:hover {
-    color: #ff4b33;
 }
 
@@ -1566 +1547 @@
 .commentlist > li.bypostauthor .children .comment-meta a,
 .commentlist > li.bypostauthor .children .comment-reply-link {
-    color: #333;
 }
 .commentlist > li.bypostauthor .children .comment-meta a:focus,
 .commentlist > li.bypostauthor .children .comment-meta a:active,
 .commentlist > li.bypostauthor .children .comment-meta a:hover {
-    color: #ff4b33;
 }
 .commentlist .children > li.bypostauthor {
@@ -1582 +1561 @@
 }
 .commentlist .children > li.bypostauthor > article .comment-meta a {
-    color: #ccc;
-    text-decoration: none;
     font-weight: bold;
 }
@@ -1595 +1572 @@
 .commentlist .children > li.bypostauthor > article .comment-reply-link:active,
 .commentlist .children > li.bypostauthor > article .comment-reply-link:hover {
-    color: #ff4b33;
 }
 .commentlist .children > li.bypostauthor > article .comment-content a {
@@ -1603 +1579 @@
 .commentlist .children > li.bypostauthor > article .comment-content a:active,
 .commentlist .children > li.bypostauthor > article .comment-content a:hover {
-    color: #ff4b33;
 }
 
@@ -1619 +1594 @@
 }
 #respond a {
-    color: #ccc;
 }
 #respond a:focus,
 #respond a:active,
 #respond a:hover {
-    color: #ff4b33;
 }
 #respond input[type="text"],
@@ -1687 +1660 @@
 }
 #respond .logged-in-as a {
-    color: #478fa2;
-    font-weight: bold;
-    text-decoration: none;
 }
 #respond p {
@@ -1817 +1787 @@
 }
 #site-generator a {
-    text-decoration: none;
     font-weight: bold;
 }