- changed how static web resources are served

- fixed sizing consistency for pasta setting fields on index.html
- added new logo
- updated README.MD

.github/workflows/rust.yml

@@ -1,4 +1,4 @@
-name: Rust
+name: Build
 
 on:
   push:

README.MD

@@ -1,7 +1,5 @@
 
-![Screenshot](git/index.png)
-
-# MicroBin
+# <img src="git/logo.png" alt="Logo" width="40"/> MicroBin
 
 
 ![Build](https://github.com/szabodanika/microbin/actions/workflows/rust.yml/badge.svg)
@@ -13,14 +11,11 @@ MicroBin is a super tiny, feature rich, configurable, self-contained and self-ho
 [![Deploy to Render](https://render.com/images/deploy-to-render-button.svg)](https://render.com/deploy?repo=https://github.com/szabodanika/microbin)
  
 Or install from Cargo:
+`cargo install microbin`, and run with your custom configuration: `microbin --port 8080 --highlightsyntax --editable`.
 
-`cargo install microbin`
-
-And run with your custom configuration:
-
-`microbin --port 8080 --highlightsyntax --editable`
 
 ### Features
+![Screenshot](git/index.png)
 - Is very small
 - Animal names instead of random numbers for pasta identifiers (64 animals)
 - File uploads (eg. server.com/file/pig-dog-cat)

src/endpoints/static_resources.rs

@@ -1,23 +1,37 @@
+use actix_web::dev::JsonBody::Body;
+use actix_web::error::UrlencodedError::ContentType;
+use actix_web::web::Path;
 use actix_web::{get, web, HttpResponse};
 use askama::Template;
+use std::io::ErrorKind::NotFound;
 use std::marker::PhantomData;
 
-#[derive(Template)]
-#[template(path = "water.css", escape = "none")]
-struct WaterCSS<'a> {
-    _marker: PhantomData<&'a ()>,
-}
-
 #[get("/static/{resource}")]
 pub async fn static_resources(resource_id: web::Path<String>) -> HttpResponse {
-    match resource_id.into_inner().as_str() {
-        "water.css" => HttpResponse::Ok().content_type("text/css").body(
-            WaterCSS {
-                _marker: Default::default(),
-            }
-            .render()
-            .unwrap(),
-        ),
+    return match resource_id.into_inner().as_str() {
+        "water.css" => HttpResponse::Ok()
+            .content_type("text/css")
+            .body(include_bytes!("../../templates/static/water.css").to_vec()),
+
+        "icon.ico" => HttpResponse::Ok()
+            .content_type("image/x-icon")
+            .body(include_bytes!("../../templates/static/icon.ico").to_vec()),
+        "icon-16x16.png" => HttpResponse::Ok()
+            .content_type("image/x-icon")
+            .body(include_bytes!("../../templates/static/icon-16x16.png").to_vec()),
+        "icon-32x32.png" => HttpResponse::Ok()
+            .content_type("image/x-icon")
+            .body(include_bytes!("../../templates/static/icon-32x32.png").to_vec()),
+        "icon-192x192.png" => HttpResponse::Ok()
+            .content_type("image/x-icon")
+            .body(include_bytes!("../../templates/static/icon-192x192.png").to_vec()),
+        "icon-512x512.png" => HttpResponse::Ok()
+            .content_type("image/x-icon")
+            .body(include_bytes!("../../templates/static/icon-512x512.png").to_vec()),
+        "apple-touch-icon.png" => HttpResponse::Ok()
+            .content_type("image/x-icon")
+            .body(include_bytes!("../../templates/static/apple-touch-icon.png").to_vec()),
+
         _ => HttpResponse::NotFound().content_type("text/html").finish(),
-    }
+    };
 }

templates/header.html

@@ -7,6 +7,13 @@
     <title>{{ args.title.as_ref().unwrap() }}</title>
     {%- endif %}
 
+    <link rel="icon" type="image/png" href="/static/icon.ico">
+    <link rel="icon" type="image/png" href="/static/icon-16x16.png" sizes="16x16">
+    <link rel="icon" type="image/png" href="/static/icon-32x32.png" sizes="32x32">
+    <link rel="icon" type="image/png" href="/static/icon-192x192.png" sizes="192x192">
+    <link rel="icon" type="image/png" href="/static/icon-512x512.png">
+    <link rel="apple-touch-icon" href="/static/apple-touch-icon.png">
+
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     {% if !args.pure_html %}
@@ -39,11 +46,12 @@
 <b style="margin-right: 0.5rem">
 
     {% if !args.hide_logo %}
-        <i><span style="font-size:2.2rem; margin-right:1rem">μ</span></i>
+<!--        <i><span style="font-size:2.2rem; margin-right:1rem">μ</span></i>-->
+        <img width="25" style="margin-bottom: -0.4rem; margin-right: 0.4rem" src="static/icon-192x192.png"/>
     {%- endif %}
 
     {% if args.footer_text.as_ref().is_none() %}
-        MicroBin
+        <span>MicroBin</span>
     {%- else %}
         {{ args.title.as_ref().unwrap() }}
     {%- endif %}

templates/index.html

@@ -4,10 +4,10 @@
     <div style="display: grid;
         grid-gap: 4px;
         grid-template-columns: repeat(auto-fit, 234px);
-        grid-template-rows: repeat(1, 100px);  ">
+        grid-template-rows: repeat(1, 78px);  ">
         <div>
             <label for="expiration">Expiration</label><br>
-            <select style="width: 100%;" name="expiration" id="expiration">
+            <select style="width: 100%;margin-top: 0" name="expiration" id="expiration">
                 <optgroup label="Expire">
                     <option value="1min">1 minute</option>
                     <option value="10min">10 minutes</option>
@@ -21,7 +21,7 @@
         {% if args.highlightsyntax %}
         <div>
             <label for="syntax-highlight">Syntax Highlighting</label><br>
-            <select style="width: 100%;" name="syntax-highlight" id="syntax-highlight">
+            <select style="width: 100%; ;margin-top: 0" name="syntax-highlight" id="syntax-highlight">
                 <option value="none">None</option>
                 <optgroup label="Source Code">
                     <option value="sh">Bash Shell</option>
@@ -58,13 +58,12 @@
         {%- else %}
         <input type="hidden" name="syntax-highlight" value="none">
         {%- endif %}
-
         <div>
-            <label>File attachment</label>
-            <br>
-            <input style="width: 100%;" type="file" id="file" name="file">
+            <label>File attachment</label><br>
+            <input style="width: 100%; height: 21px" type="file" id="file" name="file">
         </div>
     </div>
+    <br>
     <label>Content</label>
     <br>
     <textarea style="width: 100%; min-height: 100px" name="content" autofocus></textarea>