From e03c561079d80d3a883381d1e7a72e6d3c56c139 Mon Sep 17 00:00:00 2001
From: Ezra <ezra96@outlook.com>
Date: Thu, 20 May 2021 17:01:44 -0500
Subject: [PATCH] Arrow button fixes

---
 app/components/scripture-nav-bar.hbs | 40 +++++++++++++++++-----------
 app/styles/components/verse.scss     | 14 +++-------
 app/templates/verse.hbs              | 12 +--------
 3 files changed, 29 insertions(+), 37 deletions(-)

diff --git a/app/components/scripture-nav-bar.hbs b/app/components/scripture-nav-bar.hbs
index f105f25..756ca78 100644
--- a/app/components/scripture-nav-bar.hbs
+++ b/app/components/scripture-nav-bar.hbs
@@ -1,19 +1,29 @@
 <nav class="scripture-menu navbar navbar-dark sticky-top">
-  <div class="container">
-    <Scrollmenu @visible="true">
-      {{#each this.books as |book|}}
-        <Book @book={{book}} @showChapters={{this.showChapters}} />
-      {{/each}}
-    </Scrollmenu>
+  <a href="#" title="Go to the previous verse">
+  <svg xmlns="http://www.w3.org/2000/svg" fill="#dadada" class="bi bi-arrow-left-square ml-auto" viewBox="0 0 16 16">
+  <path fill-rule="evenodd" d="M15 2a1 1 0 0 0-1-1H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2zM0 2a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V2zm11.5 5.5a.5.5 0 0 1 0 1H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5H11.5z"/>
+  </svg>
+  </a> 
+    <div class="container w-75">
+      <Scrollmenu @visible="true">
+        {{#each this.books as |book|}}
+          <Book @book={{book}} @showChapters={{this.showChapters}} />
+        {{/each}}
+      </Scrollmenu>
 
-    <ChapterNav @book={{this.currentBook}}
-                @showVerses={{this.showVerses}}
-                @visible={{this.chaptersVisible}} />
+      <ChapterNav @book={{this.currentBook}}
+                  @showVerses={{this.showVerses}}
+                  @visible={{this.chaptersVisible}} />
 
-    <VerseNav @book={{this.currentBook}}
-              @chapter={{this.currentChapter}}
-              @verses={{this.currentChapter.verses}}
-              @verseSelected={{this.verseSelected}}
-              @visible={{this.versesVisible}} />
-  </div>
+      <VerseNav @book={{this.currentBook}}
+                @chapter={{this.currentChapter}}
+                @verses={{this.currentChapter.verses}}
+                @verseSelected={{this.verseSelected}}
+                @visible={{this.versesVisible}} />
+    </div>
+  <a href="#" title="Go to the next verse">
+  <svg xmlns="http://www.w3.org/2000/svg" fill="#dadada" class="bi bi-arrow-right-square mr-auto" viewBox="0 0 16 16">
+  <path fill-rule="evenodd" d="M15 2a1 1 0 0 0-1-1H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2zM0 2a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V2zm4.5 5.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z"/>
+  </svg>
+  </a>
 </nav>
\ No newline at end of file
diff --git a/app/styles/components/verse.scss b/app/styles/components/verse.scss
index 289e513..972763c 100644
--- a/app/styles/components/verse.scss
+++ b/app/styles/components/verse.scss
@@ -1,15 +1,11 @@
 .bi-arrow-left-square {
-	float:left;
 	width:2rem;
-    margin-top: .5rem;
-    margin-right: .75rem;
+	height: 2rem;
 }
 
 .bi-arrow-right-square {
-	float:right;
 	width:2rem;
-    margin-top: .5rem;
-    margin-left: .75rem;
+	height: 2rem;
 }
 
 a .bi-arrow-left-square, a .bi-arrow-right-square {
@@ -17,9 +13,5 @@ a .bi-arrow-left-square, a .bi-arrow-right-square {
 }
 
 .bi-arrow-left-square:hover,.bi-arrow-right-square:hover {
-	color:darkgrey;
-}
-
-h1#verse-ref {
-    display: inline-block;
+	fill:darkgrey;
 }
\ No newline at end of file
diff --git a/app/templates/verse.hbs b/app/templates/verse.hbs
index e49695c..71ff761 100644
--- a/app/templates/verse.hbs
+++ b/app/templates/verse.hbs
@@ -1,15 +1,5 @@
 <div class="container pt-4 text-center">
-  <a href="#" title="Go to the previous verse">
-  <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="bi bi-arrow-left-square" viewBox="0 0 16 16">
-  <path fill-rule="evenodd" d="M15 2a1 1 0 0 0-1-1H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2zM0 2a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V2zm11.5 5.5a.5.5 0 0 1 0 1H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5H11.5z"/>
-  </svg>
-  </a>
-    <h1 id="verse-ref">{{model.reference}}</h1>
-  <a href="#" title="Go to the next verse">
-  <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="bi bi-arrow-right-square" viewBox="0 0 16 16">
-  <path fill-rule="evenodd" d="M15 2a1 1 0 0 0-1-1H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2zM0 2a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V2zm4.5 5.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z"/>
-  </svg>
-  </a>
+  <h1 id="verse-ref">{{model.reference}}</h1>
 </div>
 <div class="container">
   <div class="row">