Improve styling

This commit is contained in:
Augusto Gunsch 2022-01-14 21:32:43 -03:00
parent ce606d614e
commit 46afde26d6
No known key found for this signature in database
GPG Key ID: F7EEFE29825C72DC
6 changed files with 87 additions and 14 deletions

4
.gitignore vendored
View File

@ -1,3 +1,3 @@
venv/ venv/
files/ input_files/
out/ Files/

View File

@ -3,12 +3,12 @@ import os
import shutil import shutil
from markdown2 import markdown from markdown2 import markdown
input_ = 'files' input_ = 'input_files'
output = 'out' output = 'Files'
templates = 'templates' templates = 'templates'
def render_template(**kwargs): def render_template(template, **kwargs):
expanded = template[:] expanded = template[:]
for var, val in kwargs.items(): for var, val in kwargs.items():
@ -17,8 +17,11 @@ def render_template(**kwargs):
return expanded return expanded
with open(templates + '/base.html', 'r') as template: with open(templates + '/file.html', 'r') as template:
template = template.read() file_template = template.read()
with open(templates + '/dir.html', 'r') as template:
dir_template = template.read()
for root, dirs, files in os.walk(input_, topdown=True): for root, dirs, files in os.walk(input_, topdown=True):
outroot = output + root[len(input_):] outroot = output + root[len(input_):]
@ -42,7 +45,11 @@ for root, dirs, files in os.walk(input_, topdown=True):
with open(outfile, 'w') as f: with open(outfile, 'w') as f:
content = markdown(content) content = markdown(content)
new_file = render_template(title=basename, pretty_name = basename.replace('_', ' ')
new_file = render_template(file_template,
title=pretty_name,
path=outroot.replace('_', ' ') + '/' + pretty_name,
content=content) content=content)
f.write(new_file) f.write(new_file)
@ -50,7 +57,7 @@ for root, dirs, files in os.walk(input_, topdown=True):
index_html = '<ul>' index_html = '<ul>'
for directory in dirs: for directory in dirs:
index_html += '<li><a href="%s">%s</a></li>' % (directory + '/index.html', directory.replace('_', ' ')) index_html += '<li><a href="%s">%s/</a></li>' % (directory + '/index.html', directory.replace('_', ' '))
for file in outfiles: for file in outfiles:
index_html += '<li><a href="%s">%s</a></li>' % (file, file.removesuffix('.html').replace('_', ' ')) index_html += '<li><a href="%s">%s</a></li>' % (file, file.removesuffix('.html').replace('_', ' '))
@ -58,5 +65,9 @@ for root, dirs, files in os.walk(input_, topdown=True):
index_html += '</ul>' index_html += '</ul>'
with open(outroot + '/index.html', 'w') as f: with open(outroot + '/index.html', 'w') as f:
f.write(render_template(title=outroot, pretty_outroot = outroot.replace('_', ' ')
f.write(render_template(dir_template,
title=pretty_outroot,
path=pretty_outroot,
content=index_html)) content=index_html))

View File

@ -2,10 +2,13 @@
<html> <html>
<head> <head>
<meta charset="utf-8"/> <meta charset="utf-8"/>
<link rel="stylesheet" href="templates/stylesheet.css"/>
<title>Cabinet</title> <title>Cabinet</title>
</head> </head>
<body> <body>
<h1>Cabinet file manager</h1> <header>
<a href="out/index.html">Explore</a> <h1 id="cabinet">Cabinet file manager</h1>
<a id="back" href="Files/index.html">Explore</a>
</header>
</body> </body>
</html> </html>

View File

@ -6,7 +6,13 @@
<title>${title}</title> <title>${title}</title>
</head> </head>
<body> <body>
<a href="../index.html">Back</a> <header>
<h1 id="cabinet">Cabinet file manager</h1>
<a id="back" href="../index.html">&larr; Back</a>
<span id="path">${path}</span>
</header>
<main>
${content} ${content}
</main>
</body> </body>
</html> </html>

19
templates/file.html Normal file
View File

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<link rel="stylesheet" href="stylesheet.css"/>
<title>${title}</title>
</head>
<body>
<header>
<h1 id="cabinet">Cabinet file manager</h1>
<a id="back" href="index.html">&larr; Back</a>
<span id="path">${path}</span>
</header>
<main>
<h1>${title}<h1>
${content}
</main>
</body>
</html>

View File

@ -1,3 +1,37 @@
body { body {
background-color: yellow background-color: black;
color: white;
margin: 0;
}
header {
background-color: #232323;
padding: 1em;
}
a {
text-decoration: none;
color: #3b7fdd;
}
#back {
background-color: #3b7fdd;
color: black;
padding: .4em;
border-radius: 3px;
}
#path {
margin-left: 1em;
}
#cabinet {
margin-top: 0;
}
main {
margin: 2em;
width: 60%;
margin-left: 20%;
text-align: justify;
} }