Add folder icon to directory page H1 headings

Display a folder icon next to the H1 heading on directory listing pages
(like /photography) that don't have an index.md file. The icon is
generated based on the directory title with a unique color.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-10-01 20:14:42 -04:00
parent e7bcde2788
commit e2a2812939
2 changed files with 28 additions and 1 deletions
+5
View File
@@ -449,6 +449,10 @@ def serve_content(path):
# Get title from directory name
title = path.split("/")[-1].replace("-", " ").replace("_", " ").title()
# Generate folder icon for this directory
from ..utils.content import generate_folder_icon
folder_icon = generate_folder_icon(title, size=32)
return render_template(
"directory.html",
items=items,
@@ -458,6 +462,7 @@ def serve_content(path):
title=title,
is_image_gallery=is_image_gallery,
image_items=image_items,
folder_icon=folder_icon,
)
# Handle markdown files
+23 -1
View File
@@ -381,12 +381,34 @@ body.dark-mode .parent-link:hover {
color: #ccc;
}
}
/* Directory title icon */
.directory-title-icon {
width: 32px;
height: 32px;
margin-right: 0.5rem;
vertical-align: middle;
display: inline-block;
}
@media (max-width: 760px) {
.directory-title-icon {
width: 24px;
height: 24px;
margin-right: 0.4rem;
}
}
</style>
{% endblock %}
{% block content %}
{% if current_path and current_path != '' %}
<h1>{{ current_path.split('/')[-1] if '/' in current_path else current_path }}</h1>
<h1>
{% if folder_icon %}
<img src="{{ folder_icon }}" alt="Folder icon" class="directory-title-icon">
{% endif %}
{{ current_path.split('/')[-1] if '/' in current_path else current_path }}
</h1>
{% endif %}
{% if index_content and content_position == 'top' %}