+
+
+
+
+
+
\ No newline at end of file
diff --git a/site/src/css/inputs.css b/site/src/css/inputs.css
new file mode 100644
index 0000000..ca528ee
--- /dev/null
+++ b/site/src/css/inputs.css
@@ -0,0 +1,51 @@
+button {
+ background: var(--blurple);
+ border-color: transparent;
+ border-radius: var(--medium-border-radius);
+ border-style: solid;
+ border-width: 2px;
+ color: var(--light-text);
+ cursor: pointer;
+ font-family: var(--fonts);
+ font-size: larger;
+ margin-bottom: 5px;
+ outline: none;
+ padding: 5px 10px;
+ user-select: none;
+}
+button:hover:not(:disabled) {
+ border-color: var(--accent-neutral);
+}
+button:active:not(:disabled) {
+ border-color: var(--accent-positive);
+}
+button:disabled {
+ background-color: var(--blurple-faded);
+ color: #4D4D4D;
+}
+
+
+input[type="text"] {
+ background: var(--tertiary-background);
+ border-color: var(--accent-neutral);
+ border-radius: var(--medium-border-radius);
+ border-style: solid;
+ color: var(--light-text);
+ font-family: var(--fonts);
+ font-size: larger;
+ font-weight: bold;
+ margin-bottom: 10px;
+ outline: none;
+ padding: 5px;
+}
+input[type="text"]:focus,
+input[type="text"]:active {
+ border-color: var(--accent-positive);
+}
+
+a {
+ color: var(--accent-neutral);
+}
+a:visited {
+ color: var(--accent-positive);
+}
\ No newline at end of file
diff --git a/site/src/css/themes/dark.css b/site/src/css/themes/dark.css
new file mode 100644
index 0000000..6e631fc
--- /dev/null
+++ b/site/src/css/themes/dark.css
@@ -0,0 +1,54 @@
+@import url('https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@500&family=Electrolize&display=swap');
+
+:root {
+ /* ===================================================================== */
+ /* Default Themes for backgrounds and accent colours */
+ --primary-background: #23272A;
+ --primary-border: unset;
+ --secondary-background: #2C2F33;
+ --secondary-border: unset;
+ --tertiary-background: #343A40;
+ --tertiary-border: unset;
+
+ /* Border indicators for better support in high contrast themes */
+ --large-border-radius: 10px;
+ --medium-border-radius: 7px;
+ --small-border-radius: 5px;
+
+ /* Text colours and the default font family */
+ --fonts: 'Electrolize', 'Chakra Petch', sans-serif;
+ --light-text: #E9ECEF;
+ --dark-text: #000000;
+
+ /* Accent colours used for smaller sections on the site */
+ --accent-positive: #1DB954;
+ --accent-neutral: #7289DA;
+ --accent-negative: #ED4245;
+
+ /* Scrollbar styling */
+ --scrollbar-background: #0f0f0f;
+ --scrollbar-handle: #4D4D4D;
+ --scrollbar-handle-hover: #5E5E5E;
+
+ /* ===================================================================== */
+ /* Additional Themes for the specific site */
+ --blurple-faded: #383e77;
+
+ /* ===================================================================== */
+ /* Discord branding colours */
+
+ /* Pre-Rebranding */
+ --og-blurple: #7289da;
+ --greyple: #99aab5;
+ --dark-but-not-black: #2c2f33;
+ --not-quite-black: #23272a;
+ /* + black and white */
+
+ /* Post-Rebranding */
+ --blurple: #5865f2;
+ --green: #57f287;
+ --yellow: #fee75c;
+ --fuchsia: #eb459e;
+ --red: #ed4245;
+ /* + black and white */
+}
\ No newline at end of file
diff --git a/site/src/main.js b/site/src/main.js
new file mode 100644
index 0000000..725f20d
--- /dev/null
+++ b/site/src/main.js
@@ -0,0 +1,33 @@
+import { createApp } from "vue";
+import App from "./App.vue";
+
+let app = createApp(App);
+
+app.mixin({
+ data() {return {
+ discord: {
+ client: {
+ id: `863968565353906226`,
+ },
+ auth: {
+ base: `https://discord.com/api/oauth2/authorize`,
+ scopes: [
+ `identify`,
+ `guilds`,
+ ],
+ useState: true,
+ },
+ api: {
+ base: `https://discord.com/api/v9`,
+ getGuilds: `/users/@me/guilds`,
+ },
+ },
+ private: {
+ api: `http://localhost:3001`,
+ },
+ }},
+ methods: {},
+ computed: {},
+})
+
+app.mount('#app');
\ No newline at end of file
diff --git a/site/src/views/GuildSelect.vue b/site/src/views/GuildSelect.vue
new file mode 100644
index 0000000..67e39a8
--- /dev/null
+++ b/site/src/views/GuildSelect.vue
@@ -0,0 +1,133 @@
+
+
+
+
+
+ Select a Server
+
+
+
+ ![]()
+ {{ selected.name }}
+
+
+
+
+
+
+ ![]()
+ {{ guild.name }}
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/site/src/views/History.vue b/site/src/views/History.vue
new file mode 100644
index 0000000..60cd226
--- /dev/null
+++ b/site/src/views/History.vue
@@ -0,0 +1,235 @@
+
+
+
+
+
+ Quote Bracket
+
+
+ {{ message }}
+ +
+
+ +
+ + +
+
+
+
+
+
+
\ No newline at end of file
diff --git a/site/src/views/InputID.vue b/site/src/views/InputID.vue
new file mode 100644
index 0000000..016f943
--- /dev/null
+++ b/site/src/views/InputID.vue
@@ -0,0 +1,113 @@
+
+
+
+
+
+Quote Bracket History
+
+
+
+
+
+ {{ date }}
+
+
+
+
+
+
+
+ {{ quote.text }}
+
+
+
+
+
+
+ + There was an error loading the quote bracket information. Please + wait a minute and then try again. If the issue continues, let + Oliver know. +
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/site/src/views/Login.vue b/site/src/views/Login.vue
new file mode 100644
index 0000000..a00cab2
--- /dev/null
+++ b/site/src/views/Login.vue
@@ -0,0 +1,82 @@
+
+
+
+
+
+ Quote Bracket
+
+
+ + Enter a server ID in the box below in order to load the + quote bracket history. If you need help finding out how to + get the server's ID, you can read Discord's help article + about getting IDs here: + + Where can I find my User/Server/Message ID? + +
+
+
+
+
+ The server ID you entered is invalid, please make sure that
+ you entered it correctly.
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/site/vite.config.js b/site/vite.config.js
new file mode 100644
index 0000000..95971b4
--- /dev/null
+++ b/site/vite.config.js
@@ -0,0 +1,7 @@
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+ plugins: [vue()]
+})
+
+ +
+ Quote Bracket
+ ++ +