EaglercraftX-Client-Collections/EaglercraftX-Site
4
5
Fork 2
Code Issues Pull Requests Actions Projects Wiki Activity

Search Bar for clients

Browse Source
This commit is contained in:
PrestonT500 2024-09-18 19:21:13 -07:00
parent 7b5554b6ea
commit 23efa245ab
3 changed files with 44 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
css/index.css
View File

@ -125,4 +125,18 @@ button:hover {
margin-left: 5px; margin-left: 5px;
width: 20px; width: 20px;
height: 20px; height: 20px;
} }
.search-container {
text-align: center;
margin: 20px 0;
}
#search-bar {
margin: 0 auto;
padding: 10px;
border: 1px solid #ccc;
border-radius: 4px;
width: 50%;
max-width: 400px;
}

27
index.html
View File

@ -23,41 +23,46 @@
<label for="mobileCheckbox">Mobile Checkbox</label> <label for="mobileCheckbox">Mobile Checkbox</label>
<input type="checkbox" id="mobileCheckbox"> <input type="checkbox" id="mobileCheckbox">
<div class="search-container">
<input type="text" id="search-bar" placeholder="Search Clients...">
</div>
<!-- Version 1.8 Section --> <!-- Version 1.8 Section -->
<div id="desktopVersion18"> <div id="desktopVersion18">
<p class="version-text">Version 1.8</p> <p class="version-text">Version 1.8</p>
<a class="version-link" data-url="/eagler-files/1.8/index.html" href="#"><button>Main 1.8.9 Client</button></a> <a class="version-link filter-button" data-url="/eagler-files/1.8/index.html" href="#"><button>Main 1.8.9 Client</button></a>
<a class="version-link" data-url="/eagler-files/1.8/resent4.0/index.html" href="#"><button>Resent 4.0 Client <img src="images/Recomended.png" alt="Recommended" class="recommended"></button></a> <a class="version-link filter-button" data-url="/eagler-files/1.8/resent4.0/index.html" href="#"><button>Resent 4.0 Client <img src="images/Recomended.png" alt="Recommended" class="recommended"></button></a>
<a class="version-link" data-url="/eagler-files/1.8/ShadowClient.html" href="#"><button>Shadow Client</button></a> <a class="version-link filter-button" data-url="/eagler-files/1.8/ShadowClient.html" href="#"><button>Shadow Client</button></a>
<a class="version-link" data-url="/eagler-files/1.8/EaglerForge/index.html" href="#"><button>EaglerForge [MODS!]</button></a> <a class="version-link filter-button" data-url="/eagler-files/1.8/EaglerForge/index.html" href="#"><button>EaglerForge [MODS!]</button></a>
</div> </div>
<div id="mobileVersion18" style="display: none;"> <div id="mobileVersion18" style="display: none;">
<p class="version-text">Version 1.8 - Mobile</p> <p class="version-text">Version 1.8 - Mobile</p>
<a class="version-link" data-url="/eagler-files/mobile/1.8/EaglerMobile/index.html" href="#"><button>EaglerMobile</button></a> <a class="version-link filter-button" data-url="/eagler-files/mobile/1.8/EaglerMobile/index.html" href="#"><button>EaglerMobile</button></a>
<a class="version-link" data-url="/eagler-files/mobile/1.8/EaglerPocketMobile/index.html" href="#"><button>EaglerPocketMobile</button></a> <a class="version-link filter-button" data-url="/eagler-files/mobile/1.8/EaglerPocketMobile/index.html" href="#"><button>EaglerPocketMobile</button></a>
</div> </div>
<!-- Version 1.5.2 Section --> <!-- Version 1.5.2 Section -->
<div id="desktopVersion152"> <div id="desktopVersion152">
<p class="version-text">Version 1.5.2</p> <p class="version-text">Version 1.5.2</p>
<a class="version-link" data-url="/eagler-files/1.5.2/main1.5.2.html" href="#"><button>Main Client</button></a> <a class="version-link filter-button" data-url="/eagler-files/1.5.2/main1.5.2.html" href="#"><button>Main Client</button></a>
<a class="version-link" data-url="/eagler-files/1.5.2/PrecisionBeta.html" href="#"><button>Precision Beta Client</button></a> <a class="version-link filter-button" data-url="/eagler-files/1.5.2/PrecisionBeta.html" href="#"><button>Precision Beta Client</button></a>
<a class="version-link" data-url="/eagler-files/1.5.2/precisionbeta2/index.html" href="#"><button>Precision Beta 2 Client</button></a> <a class="version-link filter-button" data-url="/eagler-files/1.5.2/precisionbeta2/index.html" href="#"><button>Precision Beta 2 Client</button></a>
</div> </div>
<div id="mobileVersion152" style="display: none;"> <div id="mobileVersion152" style="display: none;">
<p class="version-text">Version 1.5.2 - Mobile</p> <p class="version-text">Version 1.5.2 - Mobile</p>
<a class="version-link" data-url="/eagler-files/mobile/1.5.2/EaglerMobile/main1.5.2.html" href="#"><button>EaglerMobile</button></a> <a class="version-link filter-button" data-url="/eagler-files/mobile/1.5.2/EaglerMobile/main1.5.2.html" href="#"><button>EaglerMobile</button></a>
<a class="version-link" data-url="/eagler-files/mobile/1.5.2/EaglerPocketMobile/main1.5.2.html" href="#"><button>EaglerPocketMobile</button></a> <a class="version-link filter-button" data-url="/eagler-files/mobile/1.5.2/EaglerPocketMobile/main1.5.2.html" href="#"><button>EaglerPocketMobile</button></a>
</div> </div>
<script src="js/mobilecheck.js"></script> <script src="js/mobilecheck.js"></script>
<script src="js/searchbar.js"></script>
<div class="footer"> <div class="footer">
<p>I am not affiliated with EaglerCraft, Eagtek, Microsoft, or Mojang. I solely host these sites.</p> <p>I am not affiliated with EaglerCraft, Eagtek, Microsoft, or Mojang. I solely host these sites.</p>

13
js/searchbar.js Normal file
View File

@ -0,0 +1,13 @@
$(document).ready(function() {
$('#search-bar').on('keyup', function() {
var query = $(this).val().toLowerCase();
$('.filter-button').each(function() {
var buttonText = $(this).text().toLowerCase();
if (buttonText.indexOf(query) > -1) {
$(this).show();
} else {
$(this).hide();
}
});
});
});