From 5c9cb9a0370927b49ae33ec9febb93181dcf458f Mon Sep 17 00:00:00 2001
From: =?utf8?q?Vladim=C3=ADr=20Vondru=C5=A1?= <mosra@centrum.cz>
Date: Mon, 11 Sep 2017 13:17:59 +0200
Subject: [PATCH] css: remove top/bottom padding of .m-container, make it more
 flexible.

Updated padding of other elements accordingly, added new .m-nopad*
classes to make things easier for the templates.
---
 css/m-components.css | 15 ++++++++++++---
 css/m-grid.css       | 15 ++++++++++++---
 2 files changed, 24 insertions(+), 6 deletions(-)

diff --git a/css/m-components.css b/css/m-components.css
index f7078747..39e51b5a 100644
--- a/css/m-components.css
+++ b/css/m-components.css
@@ -146,7 +146,7 @@ body > header > nav ol {
   padding-left: 1rem;
   margin: 0;
 }
-body > header > nav .m-container, body > header > nav [class*='m-col-'] {
+body > header > nav [class*='m-col-'] {
   padding-top: 0;
   padding-bottom: 0;
 }
@@ -234,6 +234,8 @@ body > footer {
   width: 100%;
 }
 body > footer > nav {
+  padding-top: 1rem;
+  padding-bottom: 1rem;
   font-size: var(--footer-font-size);
   text-align: center;
   color: var(--footer-color);
@@ -257,6 +259,12 @@ body > footer > nav a:hover, body > footer > nav a:focus, body > footer > nav a:
   color: var(--footer-link-active-color);
 }
 
+/* Main content */
+body > main {
+  padding-top: 1rem;
+  padding-bottom: 1rem;
+}
+
 /* Article elements */
 article > header h1 {
   font-size: 2rem;
@@ -335,8 +343,8 @@ article section:target {
 }
 
 /* Jumbo article */
-article.m-jumbo, article.m-jumbo > header {
-  margin-bottom: 0;
+article.m-jumbo {
+  margin-top: -1rem;
 }
 article.m-jumbo > header .m-jumbo-image {
   background-size: cover;
@@ -346,6 +354,7 @@ article.m-jumbo > header .m-jumbo-image {
   font-size: 2.5vh;
   height: 60vh;
   margin-bottom: 1rem;
+  padding-top: 1rem;
 }
 article.m-jumbo > header .m-jumbo-cover {
   background: linear-gradient(transparent 0%, transparent 50%, var(--background-color) 100%);
diff --git a/css/m-grid.css b/css/m-grid.css
index 64cfdb25..07c91ef8 100644
--- a/css/m-grid.css
+++ b/css/m-grid.css
@@ -12,7 +12,8 @@ body {
 .m-container {
   width: 100%;
   margin: auto;
-  padding: 1rem;
+  padding-left: 1rem;
+  padding-right: 1rem;
 }
 .m-row {
   margin-left: -1rem;
@@ -48,12 +49,20 @@ body {
   margin-right: 0;
 }
 
-.m-container.m-nopad, [class*='m-col-'].m-nopad, .m-container.m-nopadx, [class*='m-col-'].m-nopadx {
+.m-container.m-nopad, [class*='m-col-'].m-nopad,
+.m-container.m-nopadx, [class*='m-col-'].m-nopadx,
+.m-container.m-nopadl, [class*='m-col-'].m-nopadl {
   padding-left: 0;
+}
+.m-container.m-nopad, [class*='m-col-'].m-nopad,
+.m-container.m-nopadx, [class*='m-col-'].m-nopadx,
+.m-container.m-nopadr, [class*='m-col-'].m-nopadr {
   padding-right: 0;
 }
-.m-container.m-nopad, [class*='m-col-'].m-nopad, .m-container.m-nopady, [class*='m-col-'].m-nopady {
+[class*='m-col-'].m-nopad, [class*='m-col-'].m-nopady, [class*='m-col-'].m-nopadt {
   padding-top: 0;
+}
+[class*='m-col-'].m-nopad, [class*='m-col-'].m-nopady, [class*='m-col-'].m-nopadb {
   padding-bottom: 0;
 }
 
-- 
2.30.2