black on white theme

functions.php

@@ -97,6 +97,18 @@ function wp386_scripts() {
 }
 add_action( 'wp_enqueue_scripts', 'wp386_scripts' );
 
+/**
+ * Gets blog options.
+ */
+function wp386_blog_options() {
+	$options = get_option('wp386_options', array());
+  $options = array_merge(array(
+    'color_combination' => 'default'
+  ), $options);
+
+  return $options;
+}
+
 /**
  * Custom template tags for this theme.
  */
@@ -112,6 +124,11 @@ require get_template_directory() . '/inc/extras.php';
  */
 require get_template_directory() . '/inc/customizer.php';
 
+/**
+ * Color theme support.
+ */
+require get_template_directory() . '/inc/theme-support.php';
+
 /**
  * Load Jetpack compatibility file.
  */

inc/customizer.php

@@ -13,7 +13,29 @@
 function wp386_customize_register( $wp_customize ) {
 	$wp_customize->get_setting( 'blogname' )->transport         = 'postMessage';
 	$wp_customize->get_setting( 'blogdescription' )->transport  = 'postMessage';
-	$wp_customize->get_setting( 'header_textcolor' )->transport = 'postMessage';
+
+  $options = wp386_blog_options();
+
+  $wp_customize->add_setting( 'wp386_options[color_combination]',
+    array(
+      'default' => $options['color_combination'],
+      'type' => 'option',
+      'capability' => 'edit_theme_options',
+      'transport' => 'postMessage'
+    )
+  );
+
+  $wp_customize->add_control( 'theme_color_combinations', array(
+    'label'      => __('Color Combinations', 'wp386'),
+    'section'    => 'colors',
+    'settings'   => 'wp386_options[color_combination]',
+    'priority'   => 10,
+    'type'       => 'radio',
+    'choices'    => array(
+      'default' => 'Default Color Scheme',
+      'blackonwhite' => 'Dark Text / Light Background'
+    ),
+  ) );
 }
 add_action( 'customize_register', 'wp386_customize_register' );
 

inc/theme-support.php

@@ -0,0 +1,14 @@
+<?php
+/**
+ * wp386 Color Theme Support
+ *
+ * @package wp386
+ */
+
+function wp386_color_theme_classes( $classes ) {
+  $options = wp386_blog_options();
+  $classes[] = 'theme-' . $options['color_combination'];
+  return $classes;
+}
+
+add_filter( 'body_class', 'wp386_color_theme_classes' );

js/customizer.js

@@ -5,10 +5,25 @@
  */
 
 ( function( $ ) {
+  "use strict";
+
 	// Site title and description.
 	wp.customize( 'blogname', function( value ) {
 		value.bind( function( to ) {
 			$( '#masthead a.brand' ).text( to );
 		} );
 	} );
+
+  wp.customize( 'wp386_options[color_combination]', function ( value ) {
+    value.bind( function( to ) {
+      var classes, $el;
+      $el = $('body');
+      classes = $el.attr("class").split(" ").filter(function(item) {
+        return item.indexOf("theme-") === -1 ? item : "";
+      });
+      classes.push('theme-' + to);
+      $el.attr("class", classes.join(" "));
+    } );
+  } );
+
 } )( jQuery );

sass/_bootstrap.scss

@@ -3252,7 +3252,8 @@ button.close {
   text-align: center;
   vertical-align: middle;
   cursor: pointer;
-  background: #bbbbbb;
+  background: #bbb;
+  color: #000;
   border: 0;
   border-width: 0;
   -webkit-border-radius: 0;

sass/style.scss

@@ -18,6 +18,8 @@ WP386: A theme to make your blog look like some sort of thing from the future. B
 @import './bootstrap';
 @import './bootstrap_additions';
 
+@import './themes/blackonwhite';
+
 /* Alignment */
 .alignleft {
   display: inline;

sass/themes/_blackonwhite.scss

@@ -0,0 +1,46 @@
+.theme-blackonwhite {
+  background-color: #fff;
+  color: #000;
+
+  a {
+    color: #0000AA;
+    text-decoration: none;
+  }
+
+  a:hover,
+  a:focus {
+    color: #FFFFFF;
+    background: #FF5555;
+  }
+
+  article.post.sticky {
+    .page-header {
+      background-color: #5F5;
+    }
+  }
+
+  .page-header, .entry-header {
+    background: #55FFFF;
+  }
+
+  h1, h2, h3, h4, h5, h6 {
+    color: #000;
+  }
+
+  h4 {
+    color: #AA00AA;
+  }
+
+  strong, em {
+    color: #000;
+  }
+
+  .wp-caption {
+    border-color: #000;
+  }
+
+  .sidebar-container {
+    background-color: #AAA;
+    color: #000;
+  }
+}