MetzNet
/
metznet_util
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixed css spacing. Added resize script. Made static path relative to working dir. Added update to Makefile.

master
noah metz 2022-11-25 10:41:06 -07:00
parent 663cbf1344
commit 0d11717aec
3 changed files with 118 additions and 97 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
Makefile
Unescape Escape View File

@ -19,3 +19,8 @@ install: src/%.py venv
clean:
rm -rf venv
update:
systemctl stop metznet
git pull
systemctl start metznet

15
src/__init__.py
Unescape Escape View File

@ -432,12 +432,24 @@ class WebForm(HTMLElement):
</div>
"""
resize_script = """
<script>
const document_height = () => {
const doc = document.documentElement;
doc.style.setProperty("--doc-height", `${window.innerHeight}px`);
}
window.addEventListener('resize', document_height);
document_height();
</script>
"""
class WebPage(HTMLElement):
def __init__(self, bodies: List[Any] = [], headers: List [Any] = []):
self.html = f"""
<!DOCTYPE html>
<html>
<head>
{resize_script}
{css_style}
{newline.join([str(header) for header in headers])}
</head>
@ -463,6 +475,7 @@ class WebDiv(HTMLElement):
def metznet_webui(args):
from bottle import get, post, run, request, static_file
from os import getcwd
class PWChange:
def __init__(self):
self.old_pw = None
@ -496,7 +509,7 @@ def metznet_webui(args):
@get("/static/<filename>")
def static_files(filename):
return static_file(filename, root="/home/nmetz/Code/metznet_util/src/")
return static_file(filename, root=f"{getcwd()}/src/")
@get("/torrents")
def torrents_page():

195
src/metznet.css
Unescape Escape View File

@ -1,114 +1,117 @@
@font-face {
font-family: 'apple_regular';
src: url('https://s3.metznet.ca/static.metznet.ca/fonts/appleii/apple_-webfont.woff2') format('woff2'),
url('https://s3.metznet.ca/static.metznet.ca/fonts/appleii/apple_-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
font-family: 'apple_regular';
src: url('https://s3.metznet.ca/static.metznet.ca/fonts/appleii/apple_-webfont.woff2') format('woff2'),
url('https://s3.metznet.ca/static.metznet.ca/fonts/appleii/apple_-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
:root {
--dark-pink: #7c2f51;
--bright-pink: #ff64b4;
--dark-green: #04b563;
--green: #05e77e;
--dark-cyan: #09a8b1;
--cyan: #09a9b3;
--red: #ff3131;
--gray: #636e72;
--dark-pink: #7c2f51;
--bright-pink: #ff64b4;
--dark-green: #04b563;
--green: #05e77e;
--dark-cyan: #09a8b1;
--cyan: #09a9b3;
--red: #ff3131;
--gray: #636e72;
--doc-height: 100vh;
}
::selection {
color: var(--green);
background-color: var(--bright-pink);
color: var(--green);
background-color: var(--bright-pink);
}
p {
color: var(--bright-pink);
color: var(--bright-pink);
}
a:link {
color: var(--cyan);
color: var(--cyan);
}
a:visited {
color: var(--cyan);
color: var(--cyan);
}
a:hover {
color: var(--green);
color: var(--green);
}
a:active {
color: var(--green);
color: var(--green);
}
html, body {
width: 100%;
min-height: 100%;
margin: 0px;
display: flex;
justify-content: center;
align-items: center;
background: rgba(0, 0, 0, 100);
font-family: 'apple_regular';
letter-spacing: -2px;
color: var(--bright-pink);
width: 100%;
min-height: calc(100vh - 2em);
min-height: calc(var(--doc-height) - 2em);
margin: 0px;
display: flex;
justify-content: center;
align-items: center;
background: rgba(0, 0, 0, 100);
font-family: 'apple_regular';
letter-spacing: -2px;
color: var(--bright-pink);
}
body {
padding-top: 1em;
padding-bottom: 1em;
}
input:focus {
outline: 2px solid var(--cyan);
outline: 2px solid var(--cyan);
}
input {
width: 95%;
padding: 4px;
font-family: 'apple_regular';
letter-spacing: -2px;
background-color: rgba(0, 0, 0, 0);
border: 2px solid var(--dark-pink);
color: var(--bright-pink);
width: 95%;
padding: 4px;
font-family: 'apple_regular';
letter-spacing: -2px;
background-color: rgba(0, 0, 0, 0);
border: 2px solid var(--dark-pink);
color: var(--bright-pink);
}
input::file-selector-button {
display: none;
display: none;
}
button {
font-family: 'apple_regular';
letter-spacing: -2px;
background-color: rgba(0, 0, 0, 0);
border: 2px solid var(--dark-pink);
color: var(--bright-pink);
padding: 6px;
font-family: 'apple_regular';
letter-spacing: -2px;
background-color: rgba(0, 0, 0, 0);
border: 2px solid var(--dark-pink);
color: var(--bright-pink);
padding: 6px;
}
button:hover {
border: 2px solid var(--cyan);
color: var(--green);
border: 2px solid var(--cyan);
color: var(--green);
}
.form {
background: rgba(0, 0, 0, 0);
color: var(--bright-pink);
border: 3px solid var(--dark-pink);
padding: 1em;
background: rgba(0, 0, 0, 0);
color: var(--bright-pink);
border: 3px solid var(--dark-pink);
padding: 1em;
}
.form-fields {
display: grid;
grid-template-columns: repeat(2, 250px);
grid-template-rows: repeat(6, 35px);
align-items: center;
display: grid;
grid-template-columns: repeat(2, 250px);
grid-template-rows: repeat(6, 35px);
align-items: center;
}
header {
font-size: 1.5em;
font-size: 1.5em;
}
.grid {
background: rgba(0, 0, 0, 0);
display: grid;
align-items: center;
border: 3px solid var(--dark-pink);
padding: 1em;
grid-auto-columns: min-content;
background: rgba(0, 0, 0, 0);
display: grid;
align-items: center;
border: 3px solid var(--dark-pink);
padding: 1em;
grid-auto-columns: min-content;
}
table {
border: 3px solid var(--dark-pink);
padding: 1em;
background: rgba(0, 0, 0, 0);
overflow-y: auto;
border: 3px solid var(--dark-pink);
padding: 1em;
background: rgba(0, 0, 0, 0);
overflow-y: auto;
}
#indexlist {
@ -116,83 +119,83 @@ table {
}
progress.seeding::-webkit-progress-bar {
background-color: var(--dark-pink);
background-color: var(--dark-pink);
}
progress.seeding::-webkit-progress-value {
background-color: var(--green);
background-color: var(--green);
}
progress.seeding::-moz-progress-bar {
background: var(--green);
background: var(--green);
}
progress.seeding {
background: var(--dark-pink);
background: var(--dark-pink);
}
progress.stopped::-webkit-progress-bar {
background-color: rgba(0, 0, 0, 0);
background-color: rgba(0, 0, 0, 0);
}
progress.stopped::-webkit-progress-value {
background-color: var(--dark-pink);
background-color: var(--dark-pink);
}
progress.stopped::-moz-progress-bar {
background: var(--dark-pink);
background: var(--dark-pink);
}
progress.done::-webkit-progress-bar {
background-color: rgba(0, 0, 0, 0);
background-color: rgba(0, 0, 0, 0);
}
progress.done::-webkit-progress-value {
background-color: var(--dark-pink);
background-color: var(--dark-pink);
}
progress.done::-moz-progress-bar {
background: var(--dark-pink);
background: var(--dark-pink);
}
progress.done-seeding::-webkit-progress-bar {
background-color: var(--dark-pink);
background-color: var(--dark-pink);
}
progress.done-seeding::-webkit-progress-value {
background-color: var(--green);
background-color: var(--green);
}
progress.done-seeding::-moz-progress-bar {
background: var(--green);
background: var(--green);
}
progress.verify::-moz-progress-bar {
background: var(--dark-pink);
background: var(--dark-pink);
}
progress::-moz-progress-bar {
background: var(--dark-pink);
background: var(--dark-pink);
}
progress {
border: 1px solid var(--bright-pink);
background: rgba(0, 0, 0, 0);
border: 1px solid var(--bright-pink);
background: rgba(0, 0, 0, 0);
}
progress:not([value]) {
}
progress[value] {
}
p.unknown {
color: var(--dark-pink);
color: var(--dark-pink);
}
#torrents {
height: 80%;
overflow-y: auto;
display: grid;
grid-template-columns: repeat(2, auto);
grid-auto-columns: min-content;
grid-auto-rows: min-content;
height: 80%;
overflow-y: auto;
display: grid;
grid-template-columns: repeat(2, auto);
grid-auto-columns: min-content;
grid-auto-rows: min-content;
}
#torrents {
padding: 1em;
font-size: 0.5em;
border: 1px solid var(--dark-pink);
padding: 1em;
font-size: 0.5em;
border: 1px solid var(--dark-pink);
}
#torrents div div{
overflow: hidden;
white-space: nowrap;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-align: center;
}
#torrents div div progress{
width: calc(100% - 2px);