From a52ba75924a38170eff110bd13a7d12d0ec8d8e7 Mon Sep 17 00:00:00 2001 From: blek Date: Sat, 30 Sep 2023 00:41:23 +1000 Subject: [PATCH] basic file upload UI --- filed/src/web/mod.rs | 12 ++- filed/static/paint.css | 114 +++++++++++++++++++++++++++++ filed/static/text-x-generic.svg | 17 +++++ filed/templates/base.html | 15 +++- filed/templates/index.html | 39 ++++++++-- filed/templates/text-x-generic.svg | 17 +++++ 6 files changed, 203 insertions(+), 11 deletions(-) create mode 100644 filed/static/paint.css create mode 100644 filed/static/text-x-generic.svg create mode 100644 filed/templates/text-x-generic.svg diff --git a/filed/src/web/mod.rs b/filed/src/web/mod.rs index f59e8e3..22e12fa 100644 --- a/filed/src/web/mod.rs +++ b/filed/src/web/mod.rs @@ -2,10 +2,20 @@ web - The part of filed that handles everything related to HTTP */ +use std::env::current_dir; + +use warp::{Filter, reply::Reply, reject::Rejection}; + use crate::env::Env; mod pages; +pub fn routes() -> impl Filter + Clone { + let staticpath = current_dir().unwrap(); + let staticpath = staticpath.to_str().unwrap().to_string() + "/static"; + pages::get_routes().or(warp::fs::dir(staticpath.to_string())) +} + /* Serve the HTTP server */ @@ -13,5 +23,5 @@ pub async fn serve(env: Env) { log::info!("Listening on {}", env.listen.to_string()); - warp::serve(pages::get_routes()).run(env.listen).await; + warp::serve(routes()).run(env.listen).await; } \ No newline at end of file diff --git a/filed/static/paint.css b/filed/static/paint.css new file mode 100644 index 0000000..5596d95 --- /dev/null +++ b/filed/static/paint.css @@ -0,0 +1,114 @@ +html, body { + margin: 0; padding: 0; + font-family: 'Red Hat Display', 'Open Sans', 'Segoe UI', sans-serif; + background: var(--header-color); + + scrollbar-width: none; + -ms-overflow-style: none; + + color: var(--fg-color) +} +::-webkit-scrollbar { + display: none; +} + +:root { + --accent-color: #78aeed; + --accent-bg-color: #3584e4; + --accent-fg-color: #ffffff; + --accent-font: 'Red Hat Display'; + --accent-font-size: 18pt; + --accent-weight: 900; + + --header-color: #303030; + --header-fg-color: #ffffff; + --header-sec-color: #404040; + --header-padding-x: 16px; + --header-padding-y: 12px; + --header-font-size: 12pt; + + --view-color: #1e1e1e; + + --fg-color: #ffffff; + --margin: 12px 24px; + --margin-y: 12px; + --margin-x: 24px; +} + +.header { + background: transparent; + color: var(--header-fg-color); + /* border-bottom: 1px solid var(--header-sec-color); */ + font-family: var(--accent-font); + font-weight: var(--accent-weight); + font-size: var(--header-font-size); + padding: var(--header-padding-y) var(--header-padding-x); +} +.header svg { + width: var(--header-font-size); + height: var(--header-font-size); + transform: translateY(2px); + padding-right: var(--header-padding-y); +} + +.content { + background: var(--view-color); + border-top: 1px solid var(--header-sec-color); + height: 100vh; + border-radius: 12px 12px 0 0; + padding: var(--margin-y) 0; +} +.content h1, +.content h2, +.content h3, +.content h4, +.content h5 { + margin: var(--margin); +} + +h1, h2, h3, h4, h5 { + font-family: var(--accent-font); + font-size: var(--accent-font-size); + font-weight: var(--accent-weight); +} +h2 { + font-size: var(--accent-font-size); + font-weight: var(--accent-weight); +} +h3 { + font-size: calc(var(--accent-font-size) * 0.9); + font-weight: 600; +} +h4 { + font-size: calc(var(--accent-font-size) * 0.8); + font-weight: 600; +} + +b { + font-weight: bold; + font-size: 90%; +} + +p { + margin: var(--margin-y) 0; +} + +.card { + background: var(--header-color); + border: 1px solid var(--header-sec-color); + border-radius: 12px; +} +.card-title { + border-radius: 12px 12px 0 0; + background: #292929; + padding: var(--header-padding-x) var(--header-padding-x); + font-size: var(--header-font-size); + font-weight: var(--accent-weight); + border-bottom: 1px solid var(--header-sec-color); +} +.card-text { + padding: var(--margin-y) var(--header-padding-x); +} +.card-text p { + margin-left: 0; +} \ No newline at end of file diff --git a/filed/static/text-x-generic.svg b/filed/static/text-x-generic.svg new file mode 100644 index 0000000..c38478d --- /dev/null +++ b/filed/static/text-x-generic.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/filed/templates/base.html b/filed/templates/base.html index 33c06f7..a865527 100644 --- a/filed/templates/base.html +++ b/filed/templates/base.html @@ -2,11 +2,22 @@ + + + + + blek! File - {% block content %}{% endblock %} + {% block head %}{% endblock %} - {% block body %}{% endblock %} +
+ {% include "text-x-generic.svg" %} + blek! File - a minute file sharing +
+
+ {% block body %}{% endblock %} +
\ No newline at end of file diff --git a/filed/templates/index.html b/filed/templates/index.html index 3e5b02d..1ee0323 100644 --- a/filed/templates/index.html +++ b/filed/templates/index.html @@ -1,13 +1,36 @@ {% extends "base.html" %} -{% block content %} +{% block body %} -

- hiii! -

-
-

- made with askama (C) -

+

File upload

+
+

+ You can upload a file here for free to share with others for 30 minutes.
+ How cool is that, eh? +

+
+
+ Upload form +
+
+
+

+ I want my file deleted: +

+
    +
  • + + +
    • +
  • + + +
    • +
+ +
+
+
+
{% endblock %} \ No newline at end of file diff --git a/filed/templates/text-x-generic.svg b/filed/templates/text-x-generic.svg new file mode 100644 index 0000000..c38478d --- /dev/null +++ b/filed/templates/text-x-generic.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + +