sd_image_selector/templates/dump.html

33 lines
1.3 KiB
HTML
Raw Normal View History

2024-10-24 15:25:46 +00:00
<!DOCTYPE html>
<html>
<head>
<title>Pumpkin Gallery🎃</title>
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='styles.css') }}">
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='gallery_styles.css') }}">
</head>
<body>
<div class="button-container">
<a href="{{ url_for('gallery') }}" class="button">🤺🤺🤺</a>
<a href="{{ url_for('dump') }}" class="button">🎃🎃🎃</a>
</div>
<h1>Pumpkin Gallery🎃</h1>
2024-10-25 16:41:10 +00:00
<div class="gallery-container" style="flex-direction: row; flex-wrap: wrap;">
2024-10-24 15:25:46 +00:00
{% for image in images %}
2024-10-25 16:41:10 +00:00
<a href="{{ url_for('cached_file', filename=image) }}" data-original="{{ url_for('cached_file', filename=image) }}" target="_blank" style="flex: 1 0 25%;">
<img class="responsive-img loaded" src="{{ url_for('cached_file', filename=image) }}" alt="{{ image }}" style="max-width:33vw;">
2024-10-24 15:25:46 +00:00
</a>
{% endfor %}
</div>
2024-10-25 16:41:10 +00:00
<script>
const images = document.querySelectorAll('.gallery-container a');
images.forEach(image => {
image.addEventListener('click', (event) => {
event.preventDefault();
const original = image.getAttribute('data-original');
window.open(original, '_blank');
});
});
</script>
2024-10-24 15:25:46 +00:00
</body>
2024-10-25 16:41:10 +00:00
</html>