From 100081feeed1467231d23da95d7aa9cd3927a500 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benoi=CC=82t=20Chantre?= <mail@benoitchantre.com>
Date: Mon, 10 Jul 2017 18:03:55 +0200
Subject: [PATCH] =?UTF-8?q?Use=20full=20width=20layout=20when=20there?=
 =?UTF-8?q?=E2=80=99s=20no=20sidebar?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 README.md                         |  1 +
 inc/template-functions.php        |  5 +++++
 layouts/content-sidebar.css       |  9 +++++++++
 layouts/sidebar-content.css       |  9 +++++++++
 sass/layout/_content-sidebar.scss |  2 ++
 sass/layout/_no-sidebar.scss      | 11 +++++++++++
 sass/layout/_sidebar-content.scss |  2 ++
 sass/site/_site.scss              |  1 +
 8 files changed, 40 insertions(+)
 create mode 100644 sass/layout/_no-sidebar.scss

diff --git a/README.md b/README.md
index b7e78c0a..efd98e83 100644
--- a/README.md
+++ b/README.md
@@ -14,6 +14,7 @@ My ultra-minimal CSS might make me look like theme tartare but that means less s
 * Some small tweaks in `inc/template-functions.php` that can improve your theming experience.
 * A script at `js/navigation.js` that makes your menu a toggled dropdown on small screens (like your phone), ready for CSS artistry. It's enqueued in `functions.php`.
 * 2 sample CSS layouts in `layouts/` for a sidebar on either side of your content.
+Note: `.no-sidebar` styles are not automatically loaded.
 * Smartly organized starter CSS in `style.css` that will help you to quickly get your design off the ground.
 * Licensed under GPLv2 or later. :) Use it to make something cool.
 
diff --git a/inc/template-functions.php b/inc/template-functions.php
index 340e6775..a03ed3bd 100644
--- a/inc/template-functions.php
+++ b/inc/template-functions.php
@@ -17,6 +17,11 @@ function _s_body_classes( $classes ) {
 		$classes[] = 'hfeed';
 	}
 
+	// Adds a class of no-sidebar when there is no sidebar present.
+	if ( ! is_active_sidebar( 'sidebar-1' ) ) {
+		$classes[] = 'no-sidebar';
+	}
+
 	return $classes;
 }
 add_filter( 'body_class', '_s_body_classes' );
diff --git a/layouts/content-sidebar.css b/layouts/content-sidebar.css
index 1e25ae8b..60b85d0b 100644
--- a/layouts/content-sidebar.css
+++ b/layouts/content-sidebar.css
@@ -23,3 +23,12 @@
 	clear: both;
 	width: 100%;
 }
+
+.no-sidebar .content-area {
+	float: none;
+	margin-left: auto;
+	margin-right: auto;
+}
+.no-sidebar .site-main {
+	margin-right: 0;
+}
diff --git a/layouts/sidebar-content.css b/layouts/sidebar-content.css
index 66342d0f..0dda00ee 100644
--- a/layouts/sidebar-content.css
+++ b/layouts/sidebar-content.css
@@ -23,3 +23,12 @@
 	clear: both;
 	width: 100%;
 }
+
+.no-sidebar .content-area {
+	float: none;
+	margin-left: auto;
+	margin-right: auto;
+}
+.no-sidebar .site-main {
+	margin-right: 0;
+}
diff --git a/sass/layout/_content-sidebar.scss b/sass/layout/_content-sidebar.scss
index 2af13c9a..507cc595 100644
--- a/sass/layout/_content-sidebar.scss
+++ b/sass/layout/_content-sidebar.scss
@@ -18,3 +18,5 @@
 	clear: both;
 	width: $size__site-main;
 }
+
+@import "no-sidebar";
diff --git a/sass/layout/_no-sidebar.scss b/sass/layout/_no-sidebar.scss
new file mode 100644
index 00000000..ae44e48c
--- /dev/null
+++ b/sass/layout/_no-sidebar.scss
@@ -0,0 +1,11 @@
+.no-sidebar {
+	.content-area {
+		float: none;
+		margin-left: auto;
+		margin-right: auto;
+	}
+
+	.site-main {
+		margin-right: 0;
+	}
+}
diff --git a/sass/layout/_sidebar-content.scss b/sass/layout/_sidebar-content.scss
index 03eb2d84..e765590e 100644
--- a/sass/layout/_sidebar-content.scss
+++ b/sass/layout/_sidebar-content.scss
@@ -18,3 +18,5 @@
 	clear: both;
 	width: $size__site-main;
 }
+
+@import "no-sidebar";
diff --git a/sass/site/_site.scss b/sass/site/_site.scss
index 9e4b9db4..23408f0c 100644
--- a/sass/site/_site.scss
+++ b/sass/site/_site.scss
@@ -1,5 +1,6 @@
 // @import "../layout/content-sidebar";
 // @import "../layout/sidebar-content";
+
 /*--------------------------------------------------------------
 ## Posts and pages
 --------------------------------------------------------------*/