begin restyling

kitsune-soc · Nov 30, 2024 · 87169ac · 87169ac
1 parent 2aa6afe
commit 87169ac
Show file tree

Hide file tree

Showing 5 changed files with 77 additions and 46 deletions.
diff --git a/kitsune/assets/app.css b/kitsune/assets/app.css
diff --git a/kitsune/src/template.rs b/kitsune/src/template.rs
@@ -35,10 +35,22 @@ fn spawn_watcher() {
             return;
         }
 
-        ENVIRONMENT
-            .get()
-            .unwrap()
-            .store(Arc::new(init_environment()));
+        match event {
+            Ok(notify::Event {
+                kind:
+                    notify::EventKind::Create(..)
+                    | notify::EventKind::Modify(..)
+                    | notify::EventKind::Remove(..),
+                ..
+            }) => {
+                debug!("reloading templates");
+
+                if let Some(env) = ENVIRONMENT.get() {
+                    env.store(Arc::new(init_environment()));
+                }
+            }
+            _ => return,
+        }
     })
     .unwrap();
 

diff --git a/kitsune/styles/app.css b/kitsune/styles/app.css
@@ -1,3 +1,26 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
+@import 'tailwindcss/base';
+@import 'tailwindcss/components';
+@import 'tailwindcss/utilities';
+
+@layer base {
+	body {
+		@apply min-h-screen min-w-max bg-gradient-to-bl from-dark-2 via-dark-1 to-slate-950 bg-no-repeat;
+		@apply prose prose-slate prose-invert font-mono;
+	}
+
+	a {
+		/*@apply text-pink-400;*/
+	}
+
+	::-webkit-scrollbar {
+		@apply h-2.5 w-2.5;
+	}
+
+	::-webkit-scrollbar-track {
+		@apply shadow-lg;
+	}
+
+	::-webkit-scrollbar-thumb {
+		@apply bg-shade2-light;
+	}
+}
diff --git a/kitsune/templates/oauth/consent.html b/kitsune/templates/oauth/consent.html
@@ -4,14 +4,17 @@
 {% block title %} OAuth Login {% endblock %}
 
 <br />
-{% macro add_query_params() -%}
+{% block body %}
+
+{% macro add_query_params() %}
 <input type="hidden" name="client_id" value="{{ query.client_id }}" />
 <input type="hidden" name="redirect_uri" value="{{ query.redirect_uri }}" />
 <input type="hidden" name="response_type" value="{{ query.response_type }}" />
 <input type="hidden" name="scope" value="{{ query.scope }}" />
 <input type="hidden" name="state" value="{{ query.state }}" />
 <input type="hidden" name="csrf_token" value="{{ csrf_token }}" />
-{%- endmacro %} {% block body %}
+{% endmacro %}
+
 <p class="header">Kitsune</p>
 
 <div class="consent-text">
@@ -20,20 +23,20 @@
   <p></p>
   <ul>
     {% for scope in scopes %}
-    <li>{{ scope.get_message().unwrap() }}</li>
+    <li>{{ scope }}</li>
     {% endfor %}
   </ul>
 </div>
 
 <div class="consent-forms">
   <form method="get">
-    {% add_query_params() %}
+    {{ add_query_params() }}
     <input type="hidden" name="login_consent" value="accept" />
     <input class="formButton" type="submit" value="Accept" />
   </form>
 
   <form method="get">
-    {% add_query_params() %}
+    {{ add_query_params() }}
     <input type="hidden" name="login_consent" value="deny" />
     <input class="formButton" type="submit" value="Deny" />
   </form>
@@ -42,10 +45,7 @@
 <div class="disclaimer">
   Authenticated as
   <span class="authUsername">{{ authenticated_username }}</span> ~
-  <a
-    href="#"
-    onclick="document.cookie='user_id=; expires=Thu, 01 Jan 1970 00:00:00 UTC;';window.location.reload();"
-    >Logout</a
-  >
+  <a href="#"
+    onclick="document.cookie='user_id=; expires=Thu, 01 Jan 1970 00:00:00 UTC;';window.location.reload();">Logout</a>
 </div>
-{% endblock %}
+{% endblock %}
diff --git a/kitsune/templates/oauth/login.html b/kitsune/templates/oauth/login.html
@@ -5,33 +5,29 @@
 
 <div></div>
 {% block body %}
-<p class="header">Kitsune</p>
+<main class="flex flex-col place-content-center items-center w-screen min-h-screen">
+  <h1 class="italic text-shade1-dark">Kitsune</h1>
 
-{% for (_level, msg) in flash_messages %}
-<div class="message">{{ msg }}</div>
-{% endfor %}
+  <ul class="list-none border-4 border-solid border-red-500 px-4 py-2">
+    {% for (_level, msg) in flash_messages %}
+    <li>
+      {{msg}}
+    </li>
+    {% endfor %}
+  </ul>
 
-<form method="post">
-  <div>
-    <label class="label" for="username">Username</label>
-    <br /><input
-      class="field"
-      type="text"
-      id="username"
-      name="username"
-      value=""
-    />
-    <br /><label class="label" for="password">Password</label><br />
+  <form class="flex flex-col gap-6" method="post">
+    <label for="username">Username
+      <input class="w-full border-0 border-b-2 border-gray-200 bg-transparent" type="text" id="username" name="username"
+        value="" />
+    </label>
+    <label for="password">Password
+      <input class="w-full border-0 border-b-2 border-gray-200 bg-transparent" type="password" id="password"
+        name="password" value="" />
+    </label>
     <input
-      class="field"
-      type="password"
-      id="password"
-      name="password"
-      value=""
-    />
-
-    <br /><br />
-  </div>
-  <input class="formButton" type="submit" value="Submit" />
-</form>
-{% endblock %}
+      class="[&:not(:hover)]:text-dark-1 bg-shade1-dark hover:enabled:bg-shade2-dark min-h-1 cursor-pointer rounded p-2 transition duration-500"
+      type="submit" value="Submit" />
+  </form>
+</main>
+{% endblock %}