From d770f32bb974b9d97c3b22dd83dab0c01b8cdc28 Mon Sep 17 00:00:00 2001
From: Hakim El Hattab <hakim.elhattab@gmail.com>
Date: Wed, 17 May 2017 17:10:17 +0200
Subject: [PATCH] control layout tweaks

---
 css/reveal.css  | 29 ++++++++++++++++-------------
 css/reveal.scss | 30 +++++++++++++++++-------------
 2 files changed, 33 insertions(+), 26 deletions(-)

diff --git a/css/reveal.css b/css/reveal.css
index 9067fe42..84960824 100644
--- a/css/reveal.css
+++ b/css/reveal.css
@@ -354,24 +354,27 @@ body {
   .reveal .controls .enabled.fragmented:hover {
     opacity: 1; }
 
-.reveal:not(.has-vertical-slides) .controls .navigate-left,
-.reveal:not(.has-vertical-slides) .controls .navigate-right {
-  bottom: 10px; }
+.reveal:not(.has-vertical-slides) .controls .navigate-left {
+  bottom: 1.2em;
+  right: 5.8em; }
 
-.reveal:not(.has-horizontal-slides) .controls .navigate-up,
-.reveal:not(.has-horizontal-slides) .controls .navigate-down {
-  right: 10px; }
+.reveal:not(.has-vertical-slides) .controls .navigate-right {
+  bottom: 1.2em;
+  right: 1.2em; }
 
 .reveal:not(.has-horizontal-slides) .controls .navigate-up {
-  bottom: 3.9em; }
+  right: 1.2em;
+  bottom: 5.8em; }
 
-.reveal.has-dark-background .controls .pagination-arrow:after,
-.reveal.has-dark-background .controls .pagination-arrow:before {
-  background-color: #fff; }
+.reveal:not(.has-horizontal-slides) .controls .navigate-down {
+  right: 1.2em;
+  bottom: 1.2em; }
 
-.reveal.has-light-background .controls .pagination-arrow:after,
-.reveal.has-light-background .controls .pagination-arrow:before {
-  background-color: #000; }
+.reveal.has-dark-background .controls {
+  color: #fff; }
+
+.reveal.has-light-background .controls {
+  color: #000; }
 
 @media screen and (min-width: 500px) {
   .reveal .controls[data-controls-layout="edges"] {
diff --git a/css/reveal.scss b/css/reveal.scss
index 07483f60..2651772c 100644
--- a/css/reveal.scss
+++ b/css/reveal.scss
@@ -419,27 +419,31 @@ $controlArrowThickness: 0.5em;
 }
 
 // Adjust the layout when there are no vertical slides
-.reveal:not(.has-vertical-slides) .controls .navigate-left,
+.reveal:not(.has-vertical-slides) .controls .navigate-left {
+	bottom: 1.2em;
+	right: 2.2em + $controlArrowSize;
+}
+
 .reveal:not(.has-vertical-slides) .controls .navigate-right {
-	bottom: 10px;
+	bottom: 1.2em;
+	right: 1.2em;
 }
 
-.reveal:not(.has-horizontal-slides) .controls .navigate-up,
-.reveal:not(.has-horizontal-slides) .controls .navigate-down {
-	right: 10px;
-}
 .reveal:not(.has-horizontal-slides) .controls .navigate-up {
-	bottom: $controlArrowSpacing*1.5 + $controlArrowSize/2;
+	right: 1.2em;
+	bottom: 2.2em + $controlArrowSize;
+}
+.reveal:not(.has-horizontal-slides) .controls .navigate-down {
+	right: 1.2em;
+	bottom: 1.2em;
 }
 
-.reveal.has-dark-background .controls .pagination-arrow:after,
-.reveal.has-dark-background .controls .pagination-arrow:before {
-	background-color: #fff;
+.reveal.has-dark-background .controls {
+	color: #fff;
 }
 
-.reveal.has-light-background .controls .pagination-arrow:after,
-.reveal.has-light-background .controls .pagination-arrow:before {
-	background-color: #000;
+.reveal.has-light-background .controls {
+	color: #000;
 }
 
 // Edge aligned controls layout