diff --git a/expressHandler.js b/expressHandler.js
new file mode 100644
index 0000000..4602335
--- /dev/null
+++ b/expressHandler.js
@@ -0,0 +1,14 @@
+const express = require("express"),
+path = require("path")
+
+const PORT = process.env.PORT || 8080
+
+const app = express()
+
+const staticPath = path.join(__dirname, "static")
+
+app.use(express.static(staticPath))
+
+app.listen(PORT, () => {
+ console.log("QuickURL now listening for PORT: " + PORT)
+})
\ No newline at end of file
diff --git a/index.js b/index.js
new file mode 100644
index 0000000..f39fcc1
--- /dev/null
+++ b/index.js
@@ -0,0 +1 @@
+require("./expressHandler.js")
\ No newline at end of file
diff --git a/package.json b/package.json
index 650a38b..f49a712 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,8 @@
"description": "An extremely generic privacy & security focused URL shortener.",
"main": "index.js",
"scripts": {
- "test": "node index.js"
+ "test": "node index.js",
+ "start": "node index.js"
},
"repository": {
"type": "git",
diff --git a/static/fonts/rubik-v28-latin-regular.woff2 b/static/fonts/rubik-v28-latin-regular.woff2
new file mode 100644
index 0000000..ac6ff68
Binary files /dev/null and b/static/fonts/rubik-v28-latin-regular.woff2 differ
diff --git a/static/index.html b/static/index.html
new file mode 100644
index 0000000..493a2f0
--- /dev/null
+++ b/static/index.html
@@ -0,0 +1,32 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ QuickURL
+
+
+
+
+
QuickURL
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/static/style.css b/static/style.css
new file mode 100644
index 0000000..9e12066
--- /dev/null
+++ b/static/style.css
@@ -0,0 +1,92 @@
+@font-face {
+ font-display: swap;
+ font-family: 'Rubik';
+ font-style: normal;
+ font-weight: 400;
+ src: url('./fonts/rubik-v28-latin-regular.woff2') format('woff2');
+}
+
+:root {
+ --primary-color: rgb(205, 188, 255);
+ --text-color: rgb(255, 255, 255);
+ --background-color: rgb(20, 23, 50);
+ --second-bg-color: black;
+}
+
+* {
+ text-align: center;
+ color: var(--text-color);
+ font-family: "Rubik", Verdana, Geneva, Tahoma, sans-serif;
+}
+
+h1,
+h1>* {
+ font-size: 3rem;
+ color: var(--primary-color);
+ font-weight: 100;
+}
+
+hr {
+ opacity: 0.5;
+}
+
+p {
+ font-size: 1.1rem;
+ line-height: 1.75rem;
+}
+
+p {
+ margin: 5px;
+}
+
+body {
+ background-color: var(--background-color);
+ padding: 0 3%;
+ max-width: 700px;
+ margin: auto;
+ /* outline: 3px blue solid; */
+
+ margin: auto;
+
+ display: flex;
+ align-items: center;
+}
+
+.mainDiv {
+ width: 100%;
+ /* outline: 2px white solid; */
+
+}
+
+@media screen and (min-height: 500px) {
+ html,
+ body {
+ height: 100%;
+ }
+}
+
+select,
+input {
+ font-size: 1.3rem;
+ background-color: rgba(0, 0, 20, 0.5);
+ color: var(--text-color);
+ margin: 5px auto;
+ border: 2px rgb(150, 135, 165) solid;
+ border-radius: 5px;
+ padding: 7px;
+ display: inline;
+
+ transition: all 1s cubic-bezier(0.075, 0.82, 0.165, 1);
+}
+
+input[type="url"] {
+ border: none;
+ border-bottom: 2px white solid;
+ width: 80%;
+ font-size: 1.15remd;
+}
+
+select:hover,
+input:hover {
+ border-color: var(--text-color)
+}
\ No newline at end of file