-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathhomepage.html
149 lines (147 loc) · 5.46 KB
/
homepage.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
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="homepage.css">
<link rel="icon" href="images/logo2.png">
<title>KeyboardBar</title>
<script type="text/javascript" src="javascript.js">
</script>
</head>
<body onload='loginbtn();checkBadge()'>
<header class="topnav">
<div class="logo">
<a href="homepage.html"><img src="images/logo.png" alt="logo"></a>
</div>
<nav>
<ul class="left">
<div class="dropdown-keyboard">
<li class='primarynav'><a href="keyboard.html">Keyboards</a></li>
<ul class="dropdown-content">
<li><a href="keyboard.html?filter=barebones">Barebone Kits</a></li>
<li id='pre-build'><a href="keyboard.html?filter=prebuild">Pre-Builds</a></li>
</ul>
</div>
<div class="dropdown-keyboard">
<li class='primarynav'><a href="switches.html">Switches</a></li>
<ul class="dropdown-content">
<li><a href="switches.html?filter=linear">Linear</a></li>
<li><a href="switches.html?filter=tactile">Tactile</a></li>
<li><a href="switches.html?filter=clicky">Clicky</a></li>
</ul>
</div>
<div class="dropdown-keyboard">
<li class='primarynav'><a href="keycaps.html">Keycaps</a></li>
<ul class="dropdown-content">
<li><a href="keycaps.html?filter=cherry">Cherry Profile</a></li>
<li><a href="keycaps.html?filter=sa">SA Profile</a></li>
<li><a href="keycaps.html?filter=xda">XDA Profile</a></li>
</ul>
</div>
</ul>
<ul class='right'>
<li><a href="cart.html" id="cart">Cart</a><span class='badge'></span> </li>
</ul>
</nav>
</header>
<br>
<br>
<div class="hero">
<p id="starttext"> <a href="#Build"><img src="images\arrowdown.png" alt="arrowdown"></a></p>
</div>
<h2 id="Build" class="anchor">Build Your Custom Keyboard</h2>
<br>
<div class="steps">
<ul class="step1">
<li>Step 1:</li>
<li> <img src="images/keyboard_icon.png" alt="keyboard"> </li>
<li>Select Your Preferred Board. Find one that suits your needs</li>
</ul>
<ul class="step2">
<li>Step 2:</li>
<li> <img src="images/switches_icon.png" alt="switches"> </li>
<li>Choose your switches from the extensive selection </li>
</ul>
<ul class="step3">
<li>Step 3:</li>
<li> <img src="images/keycaps_icon.png" alt="keycaps"></li>
<li>Complete the board With a your favourite set of Keycaps</li>
</ul>
<ul class="step4">
<li>Step 4:</li>
<li> <img src="images/tools_icon.png" alt="tools"> </li>
<li>Assemble the components and start building</li>
</ul>
</div>
<br>
<h2>Popular Destinations</h2>
<div class="destinations">
<ul class="destination1">
<li> <a href="gateronyellow.html"><img src="images/gateronyellow.png" alt="gateronyellow"></a> </li>
<li>GATERON MILKY YELLOW</li>
</ul>
<ul class="destination2">
<li><a href="domikeysa.html"><img src="images/domikeysa.png" alt="keycaps"></a> </li>
<li>DOMIKEY ABS KEYCAPS</li>
</ul>
<ul class="destination3">
<li><a href="tofu60acrylic.html"><img src="images/tofu60acrylic.png" alt="tofu60acrylic"> </a> </li>
<li>TOFU60 ACRYLIC</li>
</ul>
<ul class="destination4">
<li><a href="tecsee.html"><img src="images/tecsee.png" alt="tecsee"> </a> </li>
<li>TECSEE PURPLE PANDAS</li>
</ul>
</div>
<div class="table">
<table border="thin" align="center">
<caption>Introduction to Switches</caption>
<tr>
<th>Switches</th>
<th>Sound Profile</th>
<th>Tactility</th>
<th>Best For (In General)</th>
</tr>
<tr>
<td>Linear</td>
<td>Quiet</td>
<td>Smooth</td>
<td>Gaming</td>
</tr>
<tr>
<td>Tactile</td>
<td>Morderate Noise</td>
<td rowspan="2">Tactile Bump</td>
<td rowspan="2">Typing</td>
</tr>
<tr>
<td>Clicky</td>
<td>Loud</td>
</tr>
</table>
</div>
<footer>
<div class="footer">
<div class="socials">
<ul>
<li><a href="https://www.facebook.com/" target="_blank"><img src="images/facebooklogo.png" alt="facebook"> </a> </li>
<li><a href="https://www.instagram.com/" target="_blank"><img src="images/instagramlogo.png" alt="instagram"> </a> </li>
<li><a href="https://www.twitter.com/" target="_blank"><img src="images/twitterlogo.png" alt="twitter"> </a> </li>
</ul>
</div>
<div class="summary">
<ul>
<li><a href="keyboard.html">Keyboards</a> </li>
<li><a href="switches.html">Switches</a> </li>
<li><a href="keycaps.html">Keycaps</a> </li>
</ul>
<ul>
<li><a href="https://www.termsfeed.com/live/59ad481b-1194-435b-a391-e6f91ed8f6ed" target="_blank">Terms of use</a></li>
<li><a href="https://www.freeprivacypolicy.com/live/8e5b8faf-cad3-462d-9b82-a0a66e7875df" target="_blank">Privary Policy</a> </li>
</ul>
</div>
<p>© 2022 KeyboardBar</p>
</div>
</footer>
</body>
</html>