UI: Use a spacier layout
Signed-off-by: Gunwant Jain <mail@wantguns.dev>
|
@ -2,7 +2,7 @@ use rocket::fs::NamedFile;
|
||||||
use rocket::response::status::NotFound;
|
use rocket::response::status::NotFound;
|
||||||
use std::path::{Path, PathBuf};
|
use std::path::{Path, PathBuf};
|
||||||
|
|
||||||
#[get("/<file..>", rank = 3)]
|
#[get("/static/<file..>")]
|
||||||
pub async fn static_files(file: PathBuf) -> Result<NamedFile, NotFound<String>> {
|
pub async fn static_files(file: PathBuf) -> Result<NamedFile, NotFound<String>> {
|
||||||
NamedFile::open(Path::new("static/").join(file))
|
NamedFile::open(Path::new("static/").join(file))
|
||||||
.await
|
.await
|
||||||
|
|
|
@ -5,7 +5,7 @@ body {
|
||||||
|
|
||||||
body {
|
body {
|
||||||
height: 95vh;
|
height: 95vh;
|
||||||
font-family: monospace;
|
font-family: 'Fira Code', monospace;
|
||||||
|
|
||||||
display: grid;
|
display: grid;
|
||||||
}
|
}
|
||||||
|
@ -16,11 +16,26 @@ form.highlight {
|
||||||
|
|
||||||
.grid_form {
|
.grid_form {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: 4fr 1fr 1fr;
|
grid-template-columns: 4fr 1fr;
|
||||||
|
grid-template-rows: 1fr 20fr;
|
||||||
|
grid-gap: 2em;
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
margin-top: 1vh;
|
margin-top: 1vh;
|
||||||
align-items: start;
|
align-items: stretch;
|
||||||
justify-items: center;
|
justify-items: stretch;
|
||||||
|
}
|
||||||
|
|
||||||
|
.textareaBox {
|
||||||
|
grid-column: 1/2;
|
||||||
|
grid-row: 1/3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.selectBox {
|
||||||
|
grid-row: 2/3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.submitButtonBox {
|
||||||
|
grid-row: 1/2;
|
||||||
}
|
}
|
||||||
|
|
||||||
textarea {
|
textarea {
|
||||||
|
@ -34,7 +49,8 @@ textarea {
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
|
|
||||||
color: inherit;
|
color: inherit;
|
||||||
font-family: monospace;
|
font-family: 'Fira Code', monospace;
|
||||||
|
font-size: inherit;
|
||||||
line-height: inherit;
|
line-height: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -42,21 +58,39 @@ select {
|
||||||
color: inherit;
|
color: inherit;
|
||||||
background-color: #0f1419;
|
background-color: #0f1419;
|
||||||
border: none;
|
border: none;
|
||||||
padding: 0 1em 0 0;
|
width: 100%;
|
||||||
margin: 0;
|
|
||||||
width: 80%;
|
|
||||||
font-family: inherit;
|
font-family: inherit;
|
||||||
font-size: inherit;
|
font-size: inherit;
|
||||||
cursor: inherit;
|
cursor: inherit;
|
||||||
line-height: inherit;
|
line-height: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
option {
|
||||||
|
padding: 0.3em;
|
||||||
|
height: 1.2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
option:focus {
|
||||||
|
background-color: #E6E1CF;
|
||||||
|
color: #0f1419;
|
||||||
|
}
|
||||||
|
|
||||||
|
option:checked {
|
||||||
|
background-color: #E6E1CF;
|
||||||
|
color: #0f1419;
|
||||||
|
}
|
||||||
|
|
||||||
|
option:hover {
|
||||||
|
background-color: #E6E1CF;
|
||||||
|
color: #0f1419;
|
||||||
|
}
|
||||||
|
|
||||||
button[type="submit"] {
|
button[type="submit"] {
|
||||||
background-color: #F29718;
|
background-color: #F29718;
|
||||||
|
color: #0f1419;
|
||||||
border: none;
|
border: none;
|
||||||
padding: 0 1em 0 0;
|
height: 100%;
|
||||||
margin: 0;
|
width: 100%;
|
||||||
width: 50%;
|
|
||||||
font-family: inherit;
|
font-family: inherit;
|
||||||
font-size: inherit;
|
font-size: inherit;
|
||||||
line-height: inherit;
|
line-height: inherit;
|
||||||
|
|
Before Width: | Height: | Size: 593 B After Width: | Height: | Size: 593 B |
Before Width: | Height: | Size: 2.1 KiB After Width: | Height: | Size: 2.1 KiB |
Before Width: | Height: | Size: 563 B After Width: | Height: | Size: 563 B |
Before Width: | Height: | Size: 83 B After Width: | Height: | Size: 83 B |
Before Width: | Height: | Size: 104 B After Width: | Height: | Size: 104 B |
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 15 KiB |
|
@ -1,43 +1,55 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta
|
|
||||||
name="Description"
|
|
||||||
content="Author: Gunwant Jain,
|
|
||||||
A highly opinionated and minamalistic Pastebin."
|
|
||||||
/>
|
|
||||||
<title>{{ title }}</title>
|
|
||||||
|
|
||||||
<style>
|
<head>
|
||||||
/* fill entire page */
|
<meta charset="UTF-8" />
|
||||||
code {
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
background: transparent !important;
|
<meta name="Description" content="Author: Gunwant Jain,
|
||||||
font-family: monospace;
|
A highly opinionated and minamalistic Pastebin." />
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
<link rel="apple-touch-icon" href="/static/media/apple-touch-icon.png" />
|
||||||
/* Change background color to that of your theme's */
|
<link rel="icon" type="image/png" sizes="192x192" href="/static/media/android-chrome-192x192.png" />
|
||||||
background: #0f1419;
|
<link rel="icon" type="image/png" sizes="512x512" href="/static/media/android-chrome-512x512.png" />
|
||||||
padding: 10px;
|
<link rel="icon" type="image/png" sizes="32x32" href="/static/media/favicon-32x32.png" />
|
||||||
color: #E6E1CF;
|
<link rel="icon" type="image/png" sizes="16x16" href="/static/media/favicon-16x16.png" />
|
||||||
}
|
<link rel="icon" type="image/x-icon" href="/static/media/favicon.ico" />
|
||||||
|
|
||||||
::selection {
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/firacode@6.2.0/distr/fira_code.css">
|
||||||
/* text selection color
|
|
||||||
|
<title>{{ title }}</title>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
:root {
|
||||||
|
color-scheme: dark;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* fill entire page */
|
||||||
|
code {
|
||||||
|
background: transparent !important;
|
||||||
|
font-family: 'Fira Code', monospace;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
/* Change background color to that of your theme's */
|
||||||
|
background: #0f1419;
|
||||||
|
padding: 10px;
|
||||||
|
color: #E6E1CF;
|
||||||
|
}
|
||||||
|
|
||||||
|
::selection {
|
||||||
|
/* text selection color
|
||||||
make sure to change to your your preferred color if changing the default colorscheme */
|
make sure to change to your your preferred color if changing the default colorscheme */
|
||||||
background: #253340;
|
background: #253340;
|
||||||
}
|
}
|
||||||
|
</style>
|
||||||
|
{% block styles %}
|
||||||
|
{% endblock styles %}
|
||||||
|
|
||||||
</style>
|
{% block head %} {% endblock head %}
|
||||||
{% block styles %}
|
</head>
|
||||||
{% endblock styles %}
|
|
||||||
|
|
||||||
{% block head %} {% endblock head %}
|
<body>
|
||||||
</head>
|
{% block body %}{% endblock body %}
|
||||||
|
</body>
|
||||||
|
|
||||||
<body>
|
</html>
|
||||||
{% block body %}{% endblock body %}
|
|
||||||
</body>
|
|
||||||
</html>
|
|
|
@ -1,13 +1,14 @@
|
||||||
{% extends "base" %}
|
{% extends "base" %}
|
||||||
|
|
||||||
{% block styles %}
|
{% block styles %}
|
||||||
<link rel="stylesheet" href="/css/index.css">
|
<link rel="stylesheet" href="/static/css/index.css">
|
||||||
{% endblock styles %}
|
{% endblock styles %}
|
||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<form action="/submit" method="post" ondrop="dropHandler(event)">
|
<form action="/submit" method="post" ondrop="dropHandler(event)">
|
||||||
<div class=grid_form>
|
<div class=grid_form>
|
||||||
<textarea name="val" style="resize: none" placeholder="
|
<div class="textareaBox">
|
||||||
|
<textarea name="val" style="resize: none" placeholder="
|
||||||
|
|
||||||
bin(3) BIN bin(3)
|
bin(3) BIN bin(3)
|
||||||
|
|
||||||
|
@ -41,77 +42,83 @@ SEE ALSO
|
||||||
AUTHOR
|
AUTHOR
|
||||||
Gunwant Jain
|
Gunwant Jain
|
||||||
" autofocus autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"></textarea>
|
" autofocus autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"></textarea>
|
||||||
|
</div>
|
||||||
|
<div class="selectBox">
|
||||||
|
<select id="ext" name="ext" size="15">
|
||||||
|
<option value="txt">Plain Text</option>
|
||||||
|
<option value="asa">ASP</option>
|
||||||
|
<option value="asp">HTML (ASP)</option>
|
||||||
|
<option value="as">ActionScript</option>
|
||||||
|
<option value="applescript">AppleScript</option>
|
||||||
|
<option value="bat">Batch File</option>
|
||||||
|
<option value="build">NAnt Build File</option>
|
||||||
|
<option value="cs">C#</option>
|
||||||
|
<option value="cpp">C++</option>
|
||||||
|
<option value="c">C</option>
|
||||||
|
<option value="css">CSS</option>
|
||||||
|
<option value="clj">Clojure</option>
|
||||||
|
<option value="d">D</option>
|
||||||
|
<option value="diff">Diff</option>
|
||||||
|
<option value="erl">Erlang</option>
|
||||||
|
<option value="yaws">HTML (Erlang)</option>
|
||||||
|
<option value="go">Go</option>
|
||||||
|
<option value="dot">Graphviz (DOT)</option>
|
||||||
|
<option value="groovy">Groovy</option>
|
||||||
|
<option value="html">HTML</option>
|
||||||
|
<option value="hs">Haskell</option>
|
||||||
|
<option value="lhs">Literate Haskell</option>
|
||||||
|
<option value="jsp">Java Server Page (JSP)</option>
|
||||||
|
<option value="java">Java</option>
|
||||||
|
<option value="properties">Java Properties</option>
|
||||||
|
<option value="json">JSON</option>
|
||||||
|
<option value="js">JavaScript</option>
|
||||||
|
<option value="bib">BibTeX</option>
|
||||||
|
<option value="tex">LaTeX</option>
|
||||||
|
<option value="sty">TeX</option>
|
||||||
|
<option value="lisp">Lisp</option>
|
||||||
|
<option value="lua">Lua</option>
|
||||||
|
<option value="make">Makefile</option>
|
||||||
|
<option value="md">Markdown</option>
|
||||||
|
<option value="matlab">MATLAB</option>
|
||||||
|
<option value="ml">OCaml</option>
|
||||||
|
<option value="mll">OCamllex</option>
|
||||||
|
<option value="mly">OCamlyacc</option>
|
||||||
|
<option value="mm">Objective-C++</option>
|
||||||
|
<option value="m">Objective-C</option>
|
||||||
|
<option value="php">PHP</option>
|
||||||
|
<option value="pas">Pascal</option>
|
||||||
|
<option value="pl">Perl</option>
|
||||||
|
<option value="py">Python</option>
|
||||||
|
<option value="R">R</option>
|
||||||
|
<option value="rd">Rd (R Documentation)</option>
|
||||||
|
<option value="rails">HTML (Rails)</option>
|
||||||
|
<option value="js.erb">JavaScript (Rails)</option>
|
||||||
|
<option value="haml">Ruby Haml</option>
|
||||||
|
<option value="rxml">Ruby on Rails</option>
|
||||||
|
<option value="erbsql">SQL (Rails)</option>
|
||||||
|
<option value="re">Regular Expression</option>
|
||||||
|
<option value="rst">reStructuredText</option>
|
||||||
|
<option value="rb">Ruby</option>
|
||||||
|
<option value="rs">Rust</option>
|
||||||
|
<option value="sql">SQL</option>
|
||||||
|
<option value="scala">Scala</option>
|
||||||
|
<option value="sh">Bourne Again Shell (bash)</option>
|
||||||
|
<option value="adp">HTML (Tcl)</option>
|
||||||
|
<option value="tcl">Tcl</option>
|
||||||
|
<option value="textile">Textile</option>
|
||||||
|
<option value="xml">XML</option>
|
||||||
|
<option value="yaml">YAML</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
<select id="ext" name="ext">
|
<div class="submitButtonBox">
|
||||||
<option value="txt">Plain Text</option>
|
<button type="submit" title="Paste">Slap it !</button>
|
||||||
<option value="asa">ASP</option>
|
</div>
|
||||||
<option value="asp">HTML (ASP)</option>
|
</div>
|
||||||
<option value="as">ActionScript</option>
|
<div id="upload_card">
|
||||||
<option value="applescript">AppleScript</option>
|
<h5>Uploading...</h5>
|
||||||
<option value="bat">Batch File</option>
|
|
||||||
<option value="build">NAnt Build File</option>
|
|
||||||
<option value="cs">C#</option>
|
|
||||||
<option value="cpp">C++</option>
|
|
||||||
<option value="c">C</option>
|
|
||||||
<option value="css">CSS</option>
|
|
||||||
<option value="clj">Clojure</option>
|
|
||||||
<option value="d">D</option>
|
|
||||||
<option value="diff">Diff</option>
|
|
||||||
<option value="erl">Erlang</option>
|
|
||||||
<option value="yaws">HTML (Erlang)</option>
|
|
||||||
<option value="go">Go</option>
|
|
||||||
<option value="dot">Graphviz (DOT)</option>
|
|
||||||
<option value="groovy">Groovy</option>
|
|
||||||
<option value="html">HTML</option>
|
|
||||||
<option value="hs">Haskell</option>
|
|
||||||
<option value="lhs">Literate Haskell</option>
|
|
||||||
<option value="jsp">Java Server Page (JSP)</option>
|
|
||||||
<option value="java">Java</option>
|
|
||||||
<option value="properties">Java Properties</option>
|
|
||||||
<option value="json">JSON</option>
|
|
||||||
<option value="js">JavaScript</option>
|
|
||||||
<option value="bib">BibTeX</option>
|
|
||||||
<option value="tex">LaTeX</option>
|
|
||||||
<option value="sty">TeX</option>
|
|
||||||
<option value="lisp">Lisp</option>
|
|
||||||
<option value="lua">Lua</option>
|
|
||||||
<option value="make">Makefile</option>
|
|
||||||
<option value="md">Markdown</option>
|
|
||||||
<option value="matlab">MATLAB</option>
|
|
||||||
<option value="ml">OCaml</option>
|
|
||||||
<option value="mll">OCamllex</option>
|
|
||||||
<option value="mly">OCamlyacc</option>
|
|
||||||
<option value="mm">Objective-C++</option>
|
|
||||||
<option value="m">Objective-C</option>
|
|
||||||
<option value="php">PHP</option>
|
|
||||||
<option value="pas">Pascal</option>
|
|
||||||
<option value="pl">Perl</option>
|
|
||||||
<option value="py">Python</option>
|
|
||||||
<option value="R">R</option>
|
|
||||||
<option value="rd">Rd (R Documentation)</option>
|
|
||||||
<option value="rails">HTML (Rails)</option>
|
|
||||||
<option value="js.erb">JavaScript (Rails)</option>
|
|
||||||
<option value="haml">Ruby Haml</option>
|
|
||||||
<option value="rxml">Ruby on Rails</option>
|
|
||||||
<option value="erbsql">SQL (Rails)</option>
|
|
||||||
<option value="re">Regular Expression</option>
|
|
||||||
<option value="rst">reStructuredText</option>
|
|
||||||
<option value="rb">Ruby</option>
|
|
||||||
<option value="rs">Rust</option>
|
|
||||||
<option value="sql">SQL</option>
|
|
||||||
<option value="scala">Scala</option>
|
|
||||||
<option value="sh">Bourne Again Shell (bash)</option>
|
|
||||||
<option value="adp">HTML (Tcl)</option>
|
|
||||||
<option value="tcl">Tcl</option>
|
|
||||||
<option value="textile">Textile</option>
|
|
||||||
<option value="xml">XML</option>
|
|
||||||
<option value="yaml">YAML</option>
|
|
||||||
</select>
|
|
||||||
|
|
||||||
<button type="submit" title="Paste">Paste</button>
|
|
||||||
</div>
|
</div>
|
||||||
<div id="upload_card"><h5>Uploading...</h5></div>
|
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
<script src="/js/index.js"></script>
|
<script src="/static/js/index.js"></script>
|
||||||
{% endblock body %}
|
{% endblock body %}
|
|
@ -8,7 +8,7 @@
|
||||||
|
|
||||||
pre {
|
pre {
|
||||||
margin: 0px;
|
margin: 0px;
|
||||||
font-family: monospace;
|
font-family: 'Fira Code', monospace;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
{% endblock styles %}
|
{% endblock styles %}
|
||||||
|
|