some styling

This commit is contained in:
Nick Pegg 2024-08-03 18:55:44 -07:00
parent 321cbee134
commit 085c1dee88
4 changed files with 39 additions and 2 deletions

View file

@ -156,10 +156,15 @@ def generate_html(config: Config, root_dir: ImageDirectory) -> None:
for album_dir in root_dir.walk(): for album_dir in root_dir.walk():
html_path = album_dir.path / "index.html" html_path = album_dir.path / "index.html"
static_path = root_dir.path.relative_to(
html_path.parent, walk_up=True
) / "static"
logger.debug(f"Rendering {html_path}") logger.debug(f"Rendering {html_path}")
with html_path.open("w") as f: with html_path.open("w") as f:
f.write( f.write(
album_tmpl.render( album_tmpl.render(
static_dir=static_path,
album_dir=album_dir, album_dir=album_dir,
) )
) )
@ -168,11 +173,16 @@ def generate_html(config: Config, root_dir: ImageDirectory) -> None:
# TODO: If a file with a matching name but .txt or .md, add that as the # TODO: If a file with a matching name but .txt or .md, add that as the
# description for the image # description for the image
html_path = image_path.html_path() html_path = image_path.html_path()
static_path = root_dir.path.relative_to(
html_path.parent, walk_up=True
) / "static"
html_path.parent.mkdir(exist_ok=True) html_path.parent.mkdir(exist_ok=True)
logger.debug(f"Rendering {html_path}") logger.debug(f"Rendering {html_path}")
with html_path.open("w") as f: with html_path.open("w") as f:
f.write( f.write(
photo_tmpl.render( photo_tmpl.render(
static_dir=static_path,
image_path=image_path, image_path=image_path,
) )
) )

View file

@ -1,9 +1,15 @@
{% extends "base.html" %} {% extends "base.html" %}
{% block content %} {% block content %}
{% if not album_dir.is_root %}
<p>
<a href="..">up</a>
</p>
{% endif %}
{% if album_dir.children %} {% if album_dir.children %}
<h1>Albums</h1> <h1>Albums</h1>
<div id="albums"> <div id="album-children">
{% for child in album_dir.children %} {% for child in album_dir.children %}
<div class="album"> <div class="album">
<a href="{{child.path.name}}/"> <a href="{{child.path.name}}/">
@ -16,7 +22,7 @@
{% if album_dir.images %} {% if album_dir.images %}
<h1>Photos</h1> <h1>Photos</h1>
<div id="photos"> <div id="album-photos">
{% for image in album_dir.images %} {% for image in album_dir.images %}
<div class="thumbnail"> <div class="thumbnail">
<a href="slides/{{image.html_filename()}}"> <a href="slides/{{image.html_filename()}}">

View file

@ -7,7 +7,9 @@
<title>My Photos</title> <title>My Photos</title>
</head> </head>
<body> <body>
<div id="content">
{% block content %} {% block content %}
{% endblock %} {% endblock %}
</div>
</body> </body>
</html> </html>

View file

@ -0,0 +1,19 @@
body {
}
#content {
width: 1500px;
text-align: center;
}
#album-photos {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.thumbnail {
margin: 1em;
display: flex;
align-items: center;
}