added all page

app.py

@@ -1,7 +1,7 @@
 from functools import wraps
 from logging import INFO, basicConfig, info, warning
 from os import environ, getenv, path, getcwd, makedirs, listdir
-from random import choice
+from random import choice, shuffle
 
 from flask import (
     Flask,
@@ -343,6 +343,17 @@ def dog():
     return send_from_directory(app.config["UPLOAD_FOLDER"][1:] + "dog/", dog_image)
 
 
+@app.route("/dog/all/")
+def all_dogs():
+    # serve all dog images
+    dog_images = [
+        f"{app.config['UPLOAD_FOLDER']}dog/{dog}"
+        for dog in listdir(app.config["UPLOAD_FOLDER"][1:] + "dog/")
+    ]
+    shuffle(dog_images)
+    return render_template("dog.html", pics=dog_images)
+
+
 @app.route(DOG_URL, methods=["GET", "POST"])
 @login_required
 def add_dog():

static/css/dog.css

@@ -0,0 +1,34 @@
+.dogpics {
+    margin: 1vw;
+    width: 98vw;
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
+    grid-template-rows: repeat(auto-fill, minmax(250px, 1fr));
+    gap: 1vw;
+}
+
+.dogpic {
+    border-radius: 10px;
+    place-self: center;
+    max-height: 100%;
+    max-width: 100%;
+    overflow: hidden;
+    animation: dogpicfade 0.5s ease-out backwards;
+}
+
+.dogpiclarge {
+    grid-row: span 2 / auto;
+    grid-column: span 2 / auto;
+}
+
+@keyframes dogpicfade {
+    from {
+        opacity: 0;
+        transform: scale(0.3);
+    }
+
+    to {
+        opacity: 1;
+        transform: scale(1);
+    }
+}

templates/dog.html

@@ -0,0 +1,16 @@
+{% extends "base.html" %}
+
+{% block title %} Bear {% endblock %}
+{% block description %} All pics of Bear {% endblock %}
+{% block head %}
+<link rel="stylesheet" href="/static/css/dog.css">
+{% endblock %}
+
+{% block content %}
+<div class="dogpics">
+    {% for pic in pics%}
+    <img class="dogpic {% if loop.index is divisibleby 5 %}dogpiclarge{% endif %}"
+        style="animation-delay: calc({{loop.index * 100}}ms);" src="{{pic}}" alt="Bear">
+    {% endfor %}
+</div>
+{% endblock %}