Skip to content

Commit

Permalink
Search modal with autocomplete givanz/VvvebJs#383
Browse files Browse the repository at this point in the history
  • Loading branch information
@givanz
givanz committed Sep 30, 2024
1 parent 3096991 commit 550cab8
Show file tree
Hide file tree
Showing 67 changed files with 3,694 additions and 1,472 deletions.
62 changes: 48 additions & 14 deletions about.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -628,20 +628,27 @@ <h4>Features</h4>
</li>
</ul>

<div class="search-area toggle-hover">
<form action="/search" method="get" data-v-action="/search">
<input type="hidden" name="route" value="search">
<div class="input-group">
<input type="search" name="search" class="form-control" id="headerSearch" placeholder="Type for search" data-v-vvveb-action="search" data-v-vvveb-on="keyup">
<button class="btn border-0" type="submit" title="Search">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>
</div>
</form>
</div>

<button class="btn btn-outline-secondary border-0" type="submit" title="Search" data-bs-toggle="modal" data-bs-target="#searchModal">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>

<!--
<div class="search-area toggle-hover">
<form action="/search" method="get" data-v-action="/search">
<input type="hidden" name="route" value="search">
<div class="input-group">
<input type="search" name="search" class="form-control" id="headerSearch" placeholder="Type for search" data-v-vvveb-action="search" data-v-vvveb-on="keyup">
<button class="btn border-0" type="submit" title="Search">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>
</div>
</form>
</div>
-->
</div>


Expand Down Expand Up @@ -1024,6 +1031,33 @@ <h5 class="text-muted mb-3">CMO - Operations</h5>
</div>
</div>

<div class="modal fade" id="searchModal" tabindex="-1" aria-labelledby="searchModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">

<form>
<input type="hidden" name="route" value="search">
<div class="input-group">
<input type="search" name="search" class="form-control" id="headerSearch" placeholder="Type for search" data-v-vvveb-action="search" data-selector=".search-results" data-v-vvveb-on="keyup">
<button class="btn btn-outline-primary border" type="submit" title="Search">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>
</div>
</form>

<div class="search-results">

</div>

</div>
</div>
</div>
</div>


<!-- Vvveb Common Js -->
<script id="popper-js" src="../../js/popper.min.js"></script>
<!-- <script src="../../js/bootstrap.min.js"></script> -->
Expand Down
62 changes: 48 additions & 14 deletions blank-breadcrumb.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -628,20 +628,27 @@ <h4>Features</h4>
</li>
</ul>

<div class="search-area toggle-hover">
<form action="/search" method="get" data-v-action="/search">
<input type="hidden" name="route" value="search">
<div class="input-group">
<input type="search" name="search" class="form-control" id="headerSearch" placeholder="Type for search" data-v-vvveb-action="search" data-v-vvveb-on="keyup">
<button class="btn border-0" type="submit" title="Search">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>
</div>
</form>
</div>

<button class="btn btn-outline-secondary border-0" type="submit" title="Search" data-bs-toggle="modal" data-bs-target="#searchModal">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>

<!--
<div class="search-area toggle-hover">
<form action="/search" method="get" data-v-action="/search">
<input type="hidden" name="route" value="search">
<div class="input-group">
<input type="search" name="search" class="form-control" id="headerSearch" placeholder="Type for search" data-v-vvveb-action="search" data-v-vvveb-on="keyup">
<button class="btn border-0" type="submit" title="Search">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>
</div>
</form>
</div>
-->
</div>


Expand Down Expand Up @@ -854,6 +861,33 @@ <h2>Vivamus sed nunc in arcu cursus mollis quis et orci. Interdum et malesuada</
</div>
</div>

<div class="modal fade" id="searchModal" tabindex="-1" aria-labelledby="searchModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">

<form>
<input type="hidden" name="route" value="search">
<div class="input-group">
<input type="search" name="search" class="form-control" id="headerSearch" placeholder="Type for search" data-v-vvveb-action="search" data-selector=".search-results" data-v-vvveb-on="keyup">
<button class="btn btn-outline-primary border" type="submit" title="Search">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>
</div>
</form>

<div class="search-results">

</div>

</div>
</div>
</div>
</div>


<!-- Vvveb Common Js -->
<script id="popper-js" src="../../js/popper.min.js"></script>
<!-- <script src="../../js/bootstrap.min.js"></script> -->
Expand Down
62 changes: 48 additions & 14 deletions blank.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -628,20 +628,27 @@ <h4>Features</h4>
</li>
</ul>

<div class="search-area toggle-hover">
<form action="/search" method="get" data-v-action="/search">
<input type="hidden" name="route" value="search">
<div class="input-group">
<input type="search" name="search" class="form-control" id="headerSearch" placeholder="Type for search" data-v-vvveb-action="search" data-v-vvveb-on="keyup">
<button class="btn border-0" type="submit" title="Search">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>
</div>
</form>
</div>

<button class="btn btn-outline-secondary border-0" type="submit" title="Search" data-bs-toggle="modal" data-bs-target="#searchModal">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>

<!--
<div class="search-area toggle-hover">
<form action="/search" method="get" data-v-action="/search">
<input type="hidden" name="route" value="search">
<div class="input-group">
<input type="search" name="search" class="form-control" id="headerSearch" placeholder="Type for search" data-v-vvveb-action="search" data-v-vvveb-on="keyup">
<button class="btn border-0" type="submit" title="Search">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>
</div>
</form>
</div>
-->
</div>


Expand Down Expand Up @@ -821,6 +828,33 @@ <h2>Vivamus sed nunc in arcu cursus mollis quis et orci. Interdum et malesuada</
</div>
</div>

<div class="modal fade" id="searchModal" tabindex="-1" aria-labelledby="searchModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">

<form>
<input type="hidden" name="route" value="search">
<div class="input-group">
<input type="search" name="search" class="form-control" id="headerSearch" placeholder="Type for search" data-v-vvveb-action="search" data-selector=".search-results" data-v-vvveb-on="keyup">
<button class="btn btn-outline-primary border" type="submit" title="Search">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>
</div>
</form>

<div class="search-results">

</div>

</div>
</div>
</div>
</div>


<!-- Vvveb Common Js -->
<script id="popper-js" src="../../js/popper.min.js"></script>
<!-- <script src="../../js/bootstrap.min.js"></script> -->
Expand Down
62 changes: 48 additions & 14 deletions cart/cart.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -623,20 +623,27 @@ <h4>Features</h4>
</li>
</ul>

<div class="search-area toggle-hover">
<form action="/search" method="get" data-v-action="/search">
<input type="hidden" name="route" value="search">
<div class="input-group">
<input type="search" name="search" class="form-control" id="headerSearch" placeholder="Type for search" data-v-vvveb-action="search" data-v-vvveb-on="keyup">
<button class="btn border-0" type="submit" title="Search">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>
</div>
</form>
</div>

<button class="btn btn-outline-secondary border-0" type="submit" title="Search" data-bs-toggle="modal" data-bs-target="#searchModal">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>

<!--
<div class="search-area toggle-hover">
<form action="/search" method="get" data-v-action="/search">
<input type="hidden" name="route" value="search">
<div class="input-group">
<input type="search" name="search" class="form-control" id="headerSearch" placeholder="Type for search" data-v-vvveb-action="search" data-v-vvveb-on="keyup">
<button class="btn border-0" type="submit" title="Search">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>
</div>
</form>
</div>
-->
</div>


Expand Down Expand Up @@ -1147,6 +1154,33 @@ <h1>Empty cart</h1>
</div>
</div>

<div class="modal fade" id="searchModal" tabindex="-1" aria-labelledby="searchModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">

<form>
<input type="hidden" name="route" value="search">
<div class="input-group">
<input type="search" name="search" class="form-control" id="headerSearch" placeholder="Type for search" data-v-vvveb-action="search" data-selector=".search-results" data-v-vvveb-on="keyup">
<button class="btn btn-outline-primary border" type="submit" title="Search">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>
</div>
</form>

<div class="search-results">

</div>

</div>
</div>
</div>
</div>


<!-- Vvveb Common Js -->
<script id="popper-js" src="../../js/popper.min.js"></script>
<!-- <script src="../../js/bootstrap.min.js"></script> -->
Expand Down
62 changes: 48 additions & 14 deletions cart/compare.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -624,20 +624,27 @@ <h4>Features</h4>
</li>
</ul>

<div class="search-area toggle-hover">
<form action="/search" method="get" data-v-action="/search">
<input type="hidden" name="route" value="search">
<div class="input-group">
<input type="search" name="search" class="form-control" id="headerSearch" placeholder="Type for search" data-v-vvveb-action="search" data-v-vvveb-on="keyup">
<button class="btn border-0" type="submit" title="Search">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>
</div>
</form>
</div>

<button class="btn btn-outline-secondary border-0" type="submit" title="Search" data-bs-toggle="modal" data-bs-target="#searchModal">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>

<!--
<div class="search-area toggle-hover">
<form action="/search" method="get" data-v-action="/search">
<input type="hidden" name="route" value="search">
<div class="input-group">
<input type="search" name="search" class="form-control" id="headerSearch" placeholder="Type for search" data-v-vvveb-action="search" data-v-vvveb-on="keyup">
<button class="btn border-0" type="submit" title="Search">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>
</div>
</form>
</div>
-->
</div>


Expand Down Expand Up @@ -917,6 +924,33 @@ <h4>Features</h4>
</div>
</div>

<div class="modal fade" id="searchModal" tabindex="-1" aria-labelledby="searchModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">

<form>
<input type="hidden" name="route" value="search">
<div class="input-group">
<input type="search" name="search" class="form-control" id="headerSearch" placeholder="Type for search" data-v-vvveb-action="search" data-selector=".search-results" data-v-vvveb-on="keyup">
<button class="btn btn-outline-primary border" type="submit" title="Search">
<div class="la-flip-horizontal">
<i class="la la-search la-lg" aria-hidden="true"></i>
</div>
</button>
</div>
</form>

<div class="search-results">

</div>

</div>
</div>
</div>
</div>


<!-- Vvveb Common Js -->
<script id="popper-js" src="../../js/popper.min.js"></script>
<!-- <script src="../../js/bootstrap.min.js"></script> -->
Expand Down
Loading

0 comments on commit 550cab8

Please sign in to comment.