From 0283f9acbfb81aa978130a0707587c63847ce584 Mon Sep 17 00:00:00 2001
From: Ahwx <ahwx@ahwx.org>
Date: Tue, 14 Feb 2023 13:06:49 +0100
Subject: [PATCH] index page is ready

---
 index.php             |  7 +++++-
 pin.php => search.php |  0
 static/footer.php     | 14 ++++++++----
 static/style-dark.css | 50 +++++++++++++++++++++++++++++++++++++++++--
 4 files changed, 64 insertions(+), 7 deletions(-)
 rename pin.php => search.php (100%)
diff --git a/index.php b/index.php
index 3b29b8f..39d2d5e 100644
--- a/index.php
+++ b/index.php
@@ -3,6 +3,11 @@
 <body>
     <div class="mainContainer">
         <h1 id="bodyHeader"><span>P</span>inter<span>n</span>et</h1>
-        <p class="bodyText">Please enter the Pin ID here:</p>
+        <form class="searchContainer" action="search.php" method="get" autocomplete="off">
+          <div id="inputWrapper"><br><br><br><br>
+            <input type="text" name="q" autofocus/>
+            <button type="submit">Search</button>
+          </div>
+        </form>
     </div>
 <?php require "static/footer.php"; ?>
diff --git a/pin.php b/search.php
similarity index 100%
rename from pin.php
rename to search.php
diff --git a/static/footer.php b/static/footer.php
index 0018961..a96fb9b 100644
--- a/static/footer.php
+++ b/static/footer.php
@@ -1,6 +1,12 @@
-<div class="footer">
-  <a href="./api.php" target="_blank">API</a>
-  <a href="https://github.com/Ahwxorg/Pinternet/" target="_blank">Source code</a>
-</div>
+<footer>
+  <div class="footer">
+    <p id="footerText">
+      <!--<a href="./api.php" target="_blank">API</a>-->
+      |
+      <a href="https://github.com/Ahwxorg/Pinternet/" target="_blank">Source code</a>
+      |
+    </p>
+  </div>
+</footer>
 </body>
 </html>
diff --git a/static/style-dark.css b/static/style-dark.css
index 6a0488a..3b678a8 100644
--- a/static/style-dark.css
+++ b/static/style-dark.css
@@ -1,7 +1,12 @@
+::root {
+  --inputColor: black;
+}
+
 body {
   background-color: #2a2b2b;
   color: white;
-  font-family:verdana, arial, sans-serif;
+  font-family: verdana, arial, sans-serif;
+  overflow-x: hidden;
 }
 
 span {
@@ -9,12 +14,12 @@ span {
 }
 
 #bodyHeader {
+  margin-top: 10vh;
   text-align: center;
 }
 
 .bodyText {
   text-align: center;
-
 }
 
 .container {
@@ -31,5 +36,46 @@ footer {
   height: 10vh;
   color: white;
   background-color: #1f2120;
+  position: fixed; 
+  bottom: 0;
+}
+
+#footerText {
+  margin: 10px;
+  padding: 10px;
+}
+
+.sep:before {
+  content: "\f004    ";
+}
+
+a {
+  text-decoration: none;
+  color: #12e8b9;
+}
+
+#inputWrapper {
+  align-items: center;
+  text-align: center;
+  justify-content: center;
+}
+
+input, button {
+  outline: none;
+  color: white;
+  background-color: #1f2120;
+  border: 1px solid #1f2120;
+  height: 4vh;
+  border-radius: 10px;
+}
+
+input {
+  outline: none;
+  color: white;
+  background-color: #1f2120;
+  border: 1px solid #1f2120;
+  width: 35vw;
+  height: 4vh;
+  margin: 10px;
 }
 
