From 662f6dfc79a8cbf68cd5198302e8cba38dcde701 Mon Sep 17 00:00:00 2001
From: rsiddharth <rsd@gnu.org>
Date: Sun, 12 Aug 2018 21:34:53 +0000
Subject: [PATCH] 2019: Fix carousel chevron position on smaller screens.

* 2019/assets/css/custom.css: Add styling for carousel's chevron on
smaller screents.
* 2019/index.html: Move carousel chevrons inside the carousel div.
---
 2019/assets/css/custom.css | 18 ++++++++++++++++++
 2019/index.html            | 15 ++++++++-------
 2 files changed, 26 insertions(+), 7 deletions(-)

diff --git a/2019/assets/css/custom.css b/2019/assets/css/custom.css
index 20c029a7..59472be9 100644
--- a/2019/assets/css/custom.css
+++ b/2019/assets/css/custom.css
@@ -412,6 +412,24 @@ hr {
   display: none;
 }
 
+@media (min-width: 375px) and (max-width: 767px) {
+    .carousel-control .icon-prev,
+    .carousel-control .icon-next,
+    .carousel-control .glyphicon-chevron-left,
+    .carousel-control .glyphicon-chevron-right {
+        top: 60%;
+    }
+}
+
+@media (max-width: 374px) {
+    .carousel-control .icon-prev,
+    .carousel-control .icon-next,
+    .carousel-control .glyphicon-chevron-left,
+    .carousel-control .glyphicon-chevron-right {
+        top: 70%;
+    }
+}
+
 .carousel-caption-tr {
   position: absolute;
   font-size: 1.1em;
diff --git a/2019/index.html b/2019/index.html
index 5ef5989c..2d7c45c9 100755
--- a/2019/index.html
+++ b/2019/index.html
@@ -38,17 +38,18 @@
 
         </li>
     </ul>
+
+    <!-- These are the controls for the carousel. Comment them in if you want the little navigation chevrons and the skrims that appear when you mouse over the edges of the active image.-->
+    <a class="left carousel-control" href="#lpc-carousel" data-slide="prev">
+	<span class="glyphicon glyphicon-chevron-left"></span>
+    </a>
+    <a class="right carousel-control" href="#lpc-carousel" data-slide="next">
+	<span class="glyphicon glyphicon-chevron-right"></span>
+    </a>  <!--end of carousel -->
 </div>
 
 
-<!-- These are the controls for the carousel. Comment them in if you want the little navigation chevrons and the skrims that appear when you mouse over the edges of the active image.-->
 
-<a class="left carousel-control" href="#lpc-carousel" data-slide="prev">
-	<span class="glyphicon glyphicon-chevron-left"></span>
-</a>
-<a class="right carousel-control" href="#lpc-carousel" data-slide="next">
-	<span class="glyphicon glyphicon-chevron-right"></span>
-</a>  <!--end of carousel -->
 
 <div class="col-sm-12">
     <!--#include virtual="/2019/includes/home-content.html"-->
-- 
2.25.1