transform

This commit is contained in:
Marc Beninca 2023-06-30 21:16:14 +02:00
parent 137369edec
commit e7f061bcfd

198
build.py
View file

@ -34,13 +34,25 @@ def nav(active:str=None)->str:
'''
def main():
style = 'css'
script = 'js'
root = os.path.dirname(os.path.realpath(__file__))
input_directory = os.path.join(root, 'in')
out = os.path.join(root, 'out')
web = os.path.join(out, 'web')
css = os.path.join(web, style)
js = os.path.join(web, script)
#
run('rsync', '--archive', f'{input_directory}/', f'{web}/')
for directory in [css, js]:
os.makedirs(directory, exist_ok=True)
#
link_gv = os.path.join(root, 'link.gv')
link_svg = os.path.join(root, 'link.svg')
link_svg = os.path.join(web, 'link.svg')
run('dot', link_gv, '-Tsvg', '-o', link_svg)
with open(link_svg, 'br') as f:
link_text = f.read().decode('u8')
page_file = os.path.join(root, 'index.html')
page_file = os.path.join(web, 'index.html')
page_text = f'''\
<!DOCTYPE html><html><head>
<!----------------------------------------------------------------------------->
@ -48,8 +60,8 @@ def main():
<meta charset="UTF-8" />
<meta name="flattr:id" content="z3d26l" />
<meta name="viewport" content="initial-scale=1,width=device-width" />
<link rel="stylesheet" href="index.css" />
<script src="index.js"></script>
<link rel="stylesheet" href="{style}/index.css" />
<script src="{script}/index.js"></script>
<title>Marc Beninca</title>
<!----------------------------------------------------------------------------->
@ -68,9 +80,9 @@ def main():
<ul class="cards">
<li class="card"><a href="https://linkedin.com/in/marc-beninca">
<img src="LinkedIn.png" /><br />LinkedIn</a></li>
<img src="img/LinkedIn.png" /><br />LinkedIn</a></li>
<li class="card"><a href="https://youtube.com/@marc.beninca">
<img src="YouTube.png" /><br />YouTube</a></li>
<img src="img/YouTube.png" /><br />YouTube</a></li>
</ul>
</section>
@ -82,10 +94,10 @@ def main():
{nav('cv')}
<ul class="cards">
<li class="card"><a href="cv.en.pdf">
<img src="en.svg" /><br />English</a></li>
<li class="card"><a href="cv.fr.pdf">
<img src="fr.svg" /><br />Français</a></li>
<li class="card"><a href="pdf/cv.en.pdf">
<img src="img/en.svg" /><br />English</a></li>
<li class="card"><a href="pdf/cv.fr.pdf">
<img src="img/fr.svg" /><br />Français</a></li>
</ul>
</section>
@ -161,7 +173,7 @@ def main():
{nav('id')}
<img src="marc.jpeg" />
<img src="img/marc.jpeg" />
<table>
@ -460,9 +472,173 @@ def main():
<!----------------------------------------------------------------------------->
</main></body></html>
'''
css_file = os.path.join(css, 'index.css')
css_text = f'''\
@media screen and (max-width: 1200px) {{
html {{
font-size: 2em;
}}
}}
/*
* {{ border: 1px solid; }}
/*
header {{ background: #800000; }}
nav {{ background: #008000; }}
section {{ background: #000080; }}
/**/
* {{
box-sizing: border-box;
//margin: 0;
//padding: 0;
}}
html {{
background: rgb(0,0,0);
color: rgb(160,160,160);
font-family: sans;
font-size: 1.25em;
}}
body {{
margin: 0 auto;
position: relative;
}}
header {{
background-image: url("img/debian.jpeg");
background-position: center;
background-size: cover;
padding: 1vh 1vw 0 1vw;
position: absolute;
width: 100%;
z-index: 1;
}}
section {{
min-height: 100vh;
padding: 7em 1vw 1vh 1vw;
position: absolute;
top: 0;
width: 100%;
}}
section:not(:target) {{
display: none;
}}
section:target {{
display: block;
}}
nav {{
display: flex;
flex-wrap: wrap;
}}
img {{
border: 1px solid;
border-color: rgb(192,192,192);
border-radius: 1em;
height: 8em;
}}
a {{
text-decoration: none;
}}
nav a {{
background: linear-gradient(rgba(64,64,64,1), rgba(64,64,64,0));
border-color: rgb(128,128,128);
border-radius: .5em;
border-style: solid;
border-width: 1px 1px 0 1px;
#color: rgb(128,128,0);
font-weight: bold;
padding: .25em .5em;
//transition: all .5s;
}}
nav a.active {{
background: linear-gradient(rgba(128,128,128,1), rgba(128,128,128,0));
}}
a {{
color: rgb(0,192,192);
}}
a:hover {{
color: rgb(192,0,0);
}}
a:visited {{
color: rgb(0,160,160);
}}
table {{
empty-cells: hide;
}}
th,td {{
border-radius: .2em;
}}
th {{
background: rgb(64,64,64);
color: rgb(128,128,0);
}}
td {{
background: rgb(48,48,48);
border: 1px solid;
border-color: rgb(192,192,192);
text-align: center;
}}
.cards {{
display: flex;
}}
.card {{
list-style: none;
margin: 0 1em;
text-align: center;
}}
.card img {{
border: none;
height: 4em;
}}'''
js_file = os.path.join(js, 'index.js')
js_text = f'''\
function check(tab) {{
const tabs = tab.split('/')
let id = 'tab'
for (tab of tabs) {{
id = `${{id}}/${{tab}}`
document.getElementById(id).checked = true
}}
}}
function push(tab) {{
window.history.pushState(null, null, `?tab=${{tab}}`)
}}
function update(id) {{
const tab = id.split('/').slice(1).join('/')
push(tab)
}}
function main() {{
let tab = (new URL(document.location)).searchParams.get('tab')
if (tab) {{
check(tab)
}} else {{
tab = '1/1'
check(tab)
push(tab)
}}
}}'''
# {link_text}
with open(page_file, 'bw') as f:
f.write(page_text.encode('u8'))
with open(css_file, 'bw') as f:
f.write(css_text.encode('u8'))
with open(js_file, 'bw') as f:
f.write(js_text.encode('u8'))
if __name__ == '__main__':