gauthiier/__sssstatic
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

css media

Browse Source
This commit is contained in:
gauthiier 2024-08-23 10:16:24 +02:00
parent e3801fdb8c
commit bf4c1e0cab
4 changed files with 127 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
gen.py
View File

@ -143,10 +143,11 @@ def index_content(dir_name: str, data_dir: pathlib.Path, index_txt: pathlib.Path
if desc_md is None and content_index is None:
return;
content_desc = ""
content = ""
if desc_md:
content += "<li>" + "<desc>" + "\n" + desc_md + "</desc>" + "</li>" + "\n";
content_desc += "<li>" + "<desc>" + "\n" + desc_md + "</desc>" + "</li>" + "\n";
if content_index:
@ -171,7 +172,7 @@ def index_content(dir_name: str, data_dir: pathlib.Path, index_txt: pathlib.Path
# check if there is an html file existing already. if so use that one.
html = template.replace('[[content]]', content).replace('[[dir]]', str(dir_name));
html = template.replace('[[content_desc]]', content_desc).replace('[[content]]', content).replace('[[dir]]', str(dir_name));
try:
out = data_dir / 'index.html'

156
styles/+++/lestyle.css
View File

@ -5,79 +5,106 @@ body {
padding: 0;
}
.tableau {
border: 10px grey ridge;
margin: 5em;
margin-bottom: 1em;
hd {
display: flex;
flex-direction: column;
max-width: 45em;
min-width: 250px;
}
hd img {
width: 80%;
border: 10px grey ridge;
margin-bottom: 1em;
margin-top: 5em;
}
h1 { font-size: 2.7vw; }
h2 { font-size: 2.2vw;}
h3 { font-size: 1.7vw;}
h4 { font-size: 1.3vw;}
table {
display: block;
margin: 1em;
border: 10px grey ridge;
font-size: small;
text-align: left;
width: 55em;
max-width: 55em;
min-width: 250px;
}
table td {
border: 2px grey ridge;
table tr {
display: flex;
flex-direction: column;
text-align: center;
}
table tr td {
padding: 1em;
/* width: 75em;*/
}
table td h1 {
bborder: 1px red solid;
margin-top: 0.4em;
margin-bottom: 0.2em;
}
table tr td img {
width: 100%;
height: auto;
border: 2px grey ridge;
}
table tr td video {
width: 100%;
height: auto;
border: 2px grey ridge;
}
table td p {
margin-top: 0.1em;
margin-bottom: 0.4em;
}
h1 a:hover, h1 a:active {
text-decoration: none;
}
table td p {
bborder: 1px red solid;
margin-top: 0.1em;
margin-bottom: 0.4em;
}
a:hover p, a:active p {
text-decoration: none;
}
table tr {
text-align: center;
}
table td img {
width: 100%;
border: 2px grey ridge;
}
.lst {
display: flex;
flex-direction: column;
margin-right: 3em;
margin-left: 3em;
}
.lst p mat {
margin-left: : 2em;
}
.lst ul li { display: inline; }
.lst ul li desc {
margin: 2em;
margin-left: 1em;
margin-right: 1em;
margin-bottom: 1em;
width: 985;
min-width: 250px;
max-width: 1024px;
display: block;
}
.lst ul li desc img {
border: 10px grey ridge;
margin: 0em;
margin-bottom: 2em;
width: 985;
width: 98%;
display: block;
}
@ -85,36 +112,42 @@ table td img {
border: 10px grey ridge;
margin: 0em;
margin-bottom: 2em;
width: 985;
width: 98%;
display: block;
}
.lst ul li { display: inline-block; }
.lst ul li img {
border: 10px grey ridge;
margin: 2em;
margin: 0.5em;
margin-bottom: 1em;
width: 450;
resize: both;
overflow: auto;
width: 488px;
}
.lst ul li video {
border: 10px grey ridge;
margin: 2em;
margin: 0.5em;
margin-bottom: 1em;
width: 450;
width: 488px;
}
.lst ul li sound {
display: inline-block;
display: block;
border: 10px grey ridge;
margin: 2em;
width: 440;
margin-left: 1em;
margin-right: 1em;
padding: 10;
min-width: 250px;
max-width: 990px;
}
.lst ul li sound track {
display: block;
margin-top: 0.3em;
margin-bottom: 0.3em;
width: 100%;
}
.lst ul li sound info {
@ -126,19 +159,19 @@ table td img {
margin-top: 0.5em;
}
.lst ul li lo img {
.lst ul li desc lo img {
border: none;
margin: 1em;
margin-top: 0.5em;
max-width: 300;
}
.lst ul li la img {
.lst ul li desc la img {
border: none;
margin: 1em;
margin-top: 0.5em;
max-width: 100;
max-height: 100;
min-width: 100;
}
address {
@ -149,4 +182,41 @@ address {
margin: 20px;
}
@media screen and (max-width: 1200px) {
h1 { font-size: 6vw; }
h2 { font-size: 5.3vw;}
h3 { font-size: 5vw;}
h4 { font-size: 4vw;}
p { font-size: 3.7vw;}
pre { font-size: 3.5vw;}
table {
max-width: 65em;
}
.lst ul li { display: block; }
.lst ul li img {
border: 10px grey ridge;
margin: 0.5em;
margin-bottom: 1em;
width: 96%;
min-width: 250px;
}
.lst ul li video {
border: 10px grey ridge;
margin: 0.5em;
margin-bottom: 1em;
width: 96%;
min-width: 250px;
}
}

3
templates/index_apache_template.html
View File

@ -14,6 +14,9 @@
</div>
<div class="lst">
<ul>
[[content_desc]]
</ul>
<ul>
[[content]]
</ul>

11
templates/index_template.html
View File

@ -1,7 +1,7 @@
<html>
<head>
<meta charset="utf-8">
<meta name="keywords" content="david gauthier, gauthiier, davidgauthier, dviid">
<meta name="keywords" content="david gauthier, gauthiier, davidgauthier">
<meta name="description" content="David Gauthier (b.1979, CA) - selected index of works">
<link rel="icon" href="+++/jules-henri.ico" type="image/x-icon">
<link rel="stylesheet" type="text/css" href="+++/lestyle.css"/>
@ -9,11 +9,12 @@
</head>
<body>
<div align="center">
<a href="+++/"><img src="+++/yeux.png" width="500" class="tableau"></a>
<h4>David Gauthier</h4>
<hd>
<a href="+++/"><img src="+++/yeux.png" class="tableau"></a>
<h3>David Gauthier</h3>
<h1><i>(Selected) Index of works</i></h1>
<h4><a href="https://www.uu.nl/staff/DGauthier">index of academic work</a></h4>
<h4>d[at]gauthiier.info</h4>
<h3><a href="https://www.uu.nl/staff/DGauthier">index of academic work</a></h3>
</hd>
[[content]]
</div>
</body>