-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
73 lines (67 loc) · 4.08 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PraiseTheMessage</title>
<link rel="icon" type="image/x-icon" href="/favicon.ico">
<link rel="apple-touch-icon" sizes="180x180" href="./assets/images/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="./assets/images/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="./assets/images/favicon-16x16.png">
<link rel="manifest" href="./assets/images/site.webmanifest">
<link rel="stylesheet" href="./assets/css/index.css">
<script src="https://kit.fontawesome.com/78fbec507a.js" crossorigin="anonymous"></script>
</head>
<body class="flex">
<header>
<h1 class="title">Praise the messagE!</h1>
<p class="description">
This tool is designed to help players quickly locate message terms within the message menus of FromSoftware games -
pick a game and start searching!
</p>
</header>
<main>
<div class="search-bar-container flex">
<div class="search-options bordered search-bar-component sb-text flex">
<label for="game">Select a game:</label>
<select name="game" id="game-dropdown" class="dropdown" onchange="SwapGame(value);">
<option value="eldenring">Elden Ring</option>
<option value="darksouls1">Dark Souls 1</option>
<option value="darksouls2">Dark Souls 2 (Coming soon...)</option>
<option value="darksouls3">Dark Souls 3 (Coming soon...)</option>
<option value="bloodborne">Bloodborne (Coming soon...)</option>
</select>
<div class="divider"></div>
<label for="searchbehavior">Search for terms that:</label>
<select name="searchbehavior" id="search-behavior-dropdown" class="dropdown" onchange="BehaviorToggle(value);">
<option value="matches">Match input</option>
<option value="contains">Contain input</option>
</select>
</div>
<div class="search-bar search-bar-component bordered flex">
<input type="text" name="term" id="input-box" class="input-field sb-text" placeholder="Enter desired term to find matching categories" autocomplete="off">
<button class="input-field"><i class="fa-solid fa-magnifying-glass"></i></button>
</div>
<div class="autocomplete-box search-bar-component sb-text">
</div>
<div class="result-box">
</div>
</div>
<div class="terms-container flex">
</div>
</main>
<footer class="flex">
<a href="https://github.com/MediumBob/PraiseTheMessage/issues/new?assignees=&labels=&projects=&template=bug_report.md&title=" title="Github - Bug Report">Report a bug <i class="fa-solid fa-bug footer-icon"></i></a>
<p>Made with <i class="fa-solid fa-heart" style="color: red;"></i> by MediumBob<a href="https://github.com/MediumBob/PraiseTheMessage" title="Github"><i class="fa-brands fa-github fa-xl footer-icon"></i></a></p>
<a href="https://github.com/MediumBob/PraiseTheMessage/issues/new?assignees=&labels=&projects=&template=feature_request.md&title=" title="Github - Feature Request">Request a feature <i class="fa-solid fa-screwdriver-wrench footer-icon"></i></a>
</footer>
<div class="backgrounds-container background-common">
<img class="showing background background-common" src="./assets/images/eldenring-background.png">
<img class="background background-common" src="./assets/images/darksouls1-background.png">
<img class="background background-common" src="./assets/images/darksouls2-background.png">
<img class="background background-common" src="./assets/images/darksouls3-background.png">
<img class="background background-common" src="./assets/images/bloodborne-background.png">
</div>
<script src="./scripts/search-bar.js"></script>
</body>
</html>