add help button and modal

This commit is contained in:
Ezra 2021-04-30 15:23:08 -05:00
parent d22f71064f
commit 7fb92e4b6b
2 changed files with 25 additions and 0 deletions

View File

@ -0,0 +1,19 @@
<div class="modal fade" id="helpModal" tabindex="-1" aria-labelledby="HelpScreen" aria-hidden="true">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="HelpScreen">How To Use This Site</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div class="desktop-img"></div>
<div class="mobile-img"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>

View File

@ -24,10 +24,16 @@
<a class="nav-link" href="/contact-us">Contact Us</a>
</li>
</ul>
<a href="#" data-toggle="modal" data-target="#helpModal"><div id="help-button-desktop" title="Get Help">?</div></a>
</div>
</nav>
<ScriptureNavBar/>
<a href="#" data-toggle="modal" data-target="#helpModal"><div id="help-button-mobile" title="Get Help">?</div></a>
<HelpModal/>
{{outlet}}
<footer class="card-fluid bg-dark mt-5">