Add categories + Infinite Scroll

This commit is contained in:
Jai A
2020-05-23 21:06:36 -07:00
parent 506a68ee6a
commit c24ab9831a
12 changed files with 287 additions and 26 deletions

View File

@@ -12,7 +12,7 @@
<title>Search</title>
</head>
<body>
<body onscroll="loadExtra()">
<header class="site-header">
<div class="temp-circle-logo"></div>
@@ -26,6 +26,10 @@
</div>
</header>
<a href="#" class="back-to-top" id="backToTop">
<img src="static/images/icon/up.svg" alt="up">
</a>
<div class="main-flex">
<div class="left-flex">
<div class="filters">
@@ -73,6 +77,18 @@
<img alt="cursed" src="static/images/icon/cursed.png" class="result-image"/>
<p>CURSED</p>
</a>
<a class="storage-badge category-badge" id="storage" onclick="activateCategory(this)">
<img alt="storage" src="static/images/icon/storage.svg" class="result-image"/>
<p>STORAGE</p>
</a>
<a class="food-badge category-badge" id="food" onclick="activateCategory(this)">
<img alt="food" src="static/images/icon/food.svg" class="result-image"/>
<p>FOOD</p>
</a>
<a class="equipment-badge category-badge" id="equipment" onclick="activateCategory(this)">
<img alt="equipment" src="static/images/icon/equipment.svg" class="result-image"/>
<p>EQUIPMENT</p>
</a>
<a class="misc-badge category-badge" id="misc" onclick="activateCategory(this)">
<img alt="misc" src="static/images/icon/misc.svg" class="result-image"/>
<p>MISC</p>
@@ -84,7 +100,7 @@
<p>Loaders</p>
</a>
<a class="forge-badge category-badge" id="forge" onclick="activateCategory(this)">
<img alt="forge" src="static/images/icon/forge.jpg" class="result-image"/>
<img alt="forge" src="static/images/icon/forge-alt.svg" class="result-image"/>
<p>FORGE</p>
</a>
<a class="fabric-badge category-badge" id="fabric" onclick="activateCategory(this)">
@@ -96,7 +112,7 @@
<div class="search-main">
<div class="search-div">
<input class="search-bar" type="text" id="search-input" placeholder="Search for mods..." oninput="handleSearch()">
<input class="search-bar" type="text" id="search-input" placeholder="Search for mods..." oninput="handleSearch(0)">
</div>
<div id="results" class="results">
@@ -130,7 +146,6 @@
</div>
</div>
<script src="static/js/search.js"></script>
</body>