[ADD] Added support for 960gs - TODO: add the clear div required by 960gs in the markup + test that no classes from the framework are conflicting with roots's existing css (2)

2011-03-31 19:01:31 +02:00
parent 8c4bfb8c1c
commit 5872c57923
15 changed files with 69 additions and 19 deletions
--- a/404.php
+++ b/404.php
@@ -1,5 +1,5 @@
 <?php get_header(); ?>
-		<div id="content" class="span-24">
+		<div id="content" class="<?php echo CONTAINER_CLASS; ?>">
 			<div id="main" role="main">
 				<div class="container">
 					<h1>File Not Found</h1>
--- a/archive.php
+++ b/archive.php
@@ -1,5 +1,5 @@
 <?php get_header(); ?>
-		<div id="content" class="span-24">	
+		<div id="content" class="<?php echo CONTAINER_CLASS; ?>">	
 			<div id="main" class="<?php echo get_option('roots_main_class'); ?>" role="main">
 				<div class="container">
 					<h1><?php single_cat_title(); ?></h1>
--- a/footer.php
+++ b/footer.php
@@ -1,4 +1,4 @@
-		<footer id="content-info" class="span-24" role="contentinfo">
+		<footer id="content-info" class="<?php echo CONTAINER_CLASS; ?>" role="contentinfo">
 			<div class="container">
 				<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar("Footer") ) : ?>
 				<?php endif; ?>
--- a/front-page.php
+++ b/front-page.php
@@ -1,5 +1,5 @@
 <?php get_header(); ?>
-		<div id="content" class="span-24">	
+		<div id="content" class="<?php echo CONTAINER_CLASS; ?>">	
 			<div id="main" class="<?php echo get_option('roots_main_class'); ?>" role="main">
 				<div class="container">
 					<?php get_template_part('loop', 'page'); ?>
--- a/functions.php
+++ b/functions.php
@@ -7,6 +7,47 @@ include_once('includes/roots-ob.php');			// output buffer
 include_once('includes/roots-cleanup.php');		// code cleanup/removal
 include_once('includes/roots-htaccess.php');	// h5bp htaccess

+// set the value of the main container class depending on the selected grid framework
+$roots_selected_css_framework = get_option('roots_css_framework');
+if (!defined('CONTAINER_CLASS')){
+	if ($roots_selected_css_framework === 'blueprint')
+		define('CONTAINER_CLASS', 'span-24');
+	elseif ($roots_selected_css_framework === '960gs_12')
+		define('CONTAINER_CLASS', 'container_12');
+	elseif ($roots_selected_css_framework === '960gs_16')
+		define('CONTAINER_CLASS', 'container_16');	
+	elseif ($roots_selected_css_framework === '960gs_24')
+		define('CONTAINER_CLASS', 'container_24');
+	else define('CONTAINER_CLASS', '');
+
+}
+
+function get_roots_css_framework_stylesheets(){
+	$roots_selected_css_framework = get_option('roots_css_framework');
+	if ($roots_selected_css_framework === 'blueprint'){
+		return '<link rel="stylesheet" href="/css/blueprint/screen.css">';
+	}
+	elseif ($roots_selected_css_framework === '960gs_12' || $roots_selected_css_framework === '960gs_16'){
+		return <<<EOD
+		<link rel="stylesheet" href="/css/960gs/reset.css">
+		<link rel="stylesheet" href="/css/960gs/text.css">
+		<link rel="stylesheet" href="/css/960gs/960.css">		
+EOD;
+	}
+	elseif ($roots_selected_css_framework === '960gs_24'){
+		return <<<EOD
+		<link rel="stylesheet" href=""$roots_style_sheet_uri"/css/960gs/reset.css">
+		<link rel="stylesheet" href=""$roots_style_sheet_uri"/css/960gs/text.css">
+		<link rel="stylesheet" href=""$roots_style_sheet_uri"/css/960gs/960_24_col.css">		
+EOD;
+	}
+	else {
+		return '';
+	}
+}
+
+
+	
 // set the maximum 'Large' image width to the Blueprint grid maximum width
 if (!isset($content_width)) $content_width = 950;

--- a/header.php
+++ b/header.php
@@ -10,7 +10,7 @@
 	
 	<meta name="viewport" content="width=device-width; initial-scale=1.0">

-	<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/css/blueprint/screen.css">
+	<?php echo get_roots_css_framework_stylesheets(); ?>
 <?php if (class_exists('RGForms')) { ?>
 	<link rel="stylesheet" href="<?php echo plugins_url(); ?>/gravityforms/css/forms.css">
 <?php } ?>
@@ -37,10 +37,10 @@
 </head>
 <body <?php $page_slug = $post->post_name; body_class($page_slug); ?>>
 	<div id="wrap" class="container" role="document">
-		<header id="banner" class="span-24" role="banner">
+		<header id="banner" class="<?php echo CONTAINER_CLASS; ?>" role="banner">
 			<div class="container">
 				<a id="logo" href="<?php site_url(); ?>/"><img src="<?php echo get_stylesheet_directory_uri(); ?>/img/logo.png" width="300" height="75" alt="<?php bloginfo('name'); ?>"></a>
-				<nav id="nav-main" class="span-24" role="navigation">
+				<nav id="nav-main" class="<?php echo CONTAINER_CLASS; ?>" role="navigation">
 					<?php wp_nav_menu(array('theme_location' => 'primary_navigation')); ?>
 				</nav>
 				<nav id="nav-utility">
--- a/includes/roots-options.php
+++ b/includes/roots-options.php
@@ -16,6 +16,7 @@ function roots_create_menu() {

 function roots_register_settings() {
 	// register our settings
+	register_setting('roots-settings-group', 'roots_css_framework');	
 	register_setting('roots-settings-group', 'roots_main_class');
 	register_setting('roots-settings-group', 'roots_sidebar_class');
 	register_setting('roots-settings-group', 'roots_google_analytics');
@@ -31,6 +32,7 @@ function roots_register_settings() {
 	register_setting('roots-settings-group', 'roots_footer_vcard');
 	
 	// add default settings
+	add_option('roots_css_framework', 'blueprint');
 	add_option('roots_main_class', 'span-14 append-1');
 	add_option('roots_sidebar_class', 'span-8 prepend-1 last');	
 	add_option('roots_google_analytics', '');	
@@ -56,6 +58,13 @@ function roots_settings_page() { ?>
 			</ul>
 			<div id="general">
 				<ul class="options clearfix">	
+					<li>
+						<label class="settings-label">Css Grid Framework</label>
+						<input id="roots_blueprint" name="roots_css_framework" type="radio" <?php echo get_option('roots_css_framework') === 'blueprint' ?  'checked' : ''; ?> value="blueprint" /><label for="roots_blueprint">Blueprint</label>
+						<input id="roots_960gs_12" name="roots_css_framework" type="radio" <?php echo get_option('roots_css_framework') === '960gs_12' ?  'checked' : ''; ?> value="960gs_12" /><label for="roots_960gs_12">960gs (12 cols)</label>
+						<input id="roots_960gs_16" name="roots_css_framework" type="radio" <?php echo get_option('roots_css_framework') === '960gs_16' ?  'checked' : ''; ?> value="960gs_16" /><label for="roots_960gs_16">960gs (16 cols)</label>
+						<input id="roots_960gs_24" name="roots_css_framework" type="radio" <?php echo get_option('roots_css_framework') === '960gs_24' ?  'checked' : ''; ?> value="960gs_24" /><label for="roots_960gs_24">960gs (24 cols)</label>
+					</li>
 					<li>	
 						<label class="settings-label">Class for #main</label>
 						<input name="roots_main_class" type="text" value="<?php echo get_option('roots_main_class'); ?>" class="text" />
--- a/index.php
+++ b/index.php
@@ -1,5 +1,5 @@
 <?php get_header(); ?>
-		<div id="content" class="span-24">
+		<div id="content" class="<?php echo CONTAINER_CLASS; ?>">
 			<div id="main" class="<?php echo get_option('roots_main_class'); ?>" role="main">
 				<div class="container">
 					<h1>Latest Posts</h1>
--- a/page-custom.php
+++ b/page-custom.php
@@ -3,7 +3,7 @@
 Template Name: Custom
 */
 get_header(); ?>
-		<div id="content" class="span-24">	
+		<div id="content" class="<?php echo CONTAINER_CLASS; ?>">	
 			<div id="main" class="<?php echo get_option('roots_main_class'); ?>" role="main">
 				<div class="container">
 					<?php get_template_part('loop', 'page'); ?>
--- a/page-full.php
+++ b/page-full.php
@@ -3,8 +3,8 @@
 Template Name: Full Width
 */
 get_header(); ?>
-		<div id="content" class="span-24">	
-			<div id="main" class="span-24" role="main">
+		<div id="content" class="<?php echo CONTAINER_CLASS; ?>">	
+			<div id="main" class="<?php echo CONTAINER_CLASS; ?>" role="main">
 				<div class="container">
 					<?php get_template_part('loop', 'page'); ?>
 				</div>
--- a/page-sitemap.php
+++ b/page-sitemap.php
@@ -3,7 +3,7 @@
 Template Name: Sitemap
 */
 get_header(); ?>
-		<div id="content" class="span-24">	
+		<div id="content" class="<?php echo CONTAINER_CLASS; ?>">	
 			<div id="main" class="<?php echo get_option('roots_main_class'); ?>" role="main">
 				<div class="container">
 					<?php get_template_part('loop', 'page'); ?>
--- a/page-subpages.php
+++ b/page-subpages.php
@@ -3,7 +3,7 @@
 Template Name: List Subpages
 */
 get_header(); ?>
-		<div id="content" class="span-24">	
+		<div id="content" class="<?php echo CONTAINER_CLASS; ?>">	
 			<div id="main" class="<?php echo get_option('roots_main_class'); ?>" role="main">
 				<div class="container">
 					<?php get_template_part('loop', 'page'); ?>
--- a/page.php
+++ b/page.php
@@ -1,5 +1,5 @@
 <?php get_header(); ?>
-		<div id="content" class="span-24">	
+		<div id="content" class="<?php echo CONTAINER_CLASS; ?>">	
 			<div id="main" class="<?php echo get_option('roots_main_class'); ?>" role="main">
 				<div class="container">
 					<?php get_template_part('loop', 'page'); ?>
--- a/search.php
+++ b/search.php
@@ -1,5 +1,5 @@
 <?php get_header(); ?>
-		<div id="content" class="span-24">	
+		<div id="content" class="<?php echo CONTAINER_CLASS; ?>">	
 			<div id="main" class="<?php echo get_option('roots_main_class'); ?>">
 				<div class="container">
 					<h1>Search Results for <?php echo get_search_query(); ?></h1>				
--- a/single.php
+++ b/single.php
@@ -1,5 +1,5 @@
 <?php get_header(); ?>
-		<div id="content" class="span-24">	
+		<div id="content" class="<?php echo CONTAINER_CLASS; ?>">	
 			<div id="main" class="<?php echo get_option('roots_main_class'); ?>" role="main">
 				<div class="container">
 					<?php get_template_part('loop', 'single'); ?>