33 lines
1.3 KiB
HTML
33 lines
1.3 KiB
HTML
<!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>
|
|
<div class="gallery-container" style="flex-direction: row; flex-wrap: wrap;">
|
|
{% for image in images %}
|
|
<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;">
|
|
</a>
|
|
{% endfor %}
|
|
</div>
|
|
<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>
|
|
</body>
|
|
</html>
|