templates/error.html

{% extends 'layout.html' %}
{% block title %} Home {% endblock %}
{% block content %}
    <div id="notfound">
        <img src="/static/error2.png" style="height:auto; width:100%;">
    </div>
    <div id="server">
        <p><b>505:<wbr> Internal Server Error</b></p>
        <img src="/static/505error.gif" style="height:auto; width:100%;">
    </div>
    <button class="checkdetail" onclick="show();" style="margin: 20px auto; padding: 20px;">Check Details <span class="arrow"><i class="uil uil-arrow-right"></i></span></button>
    <div id="message" style="display:none; text-align:center;"><h3>{{message}}</h3></div>

    <script>
        const str = "{{message}}";
        if (str.includes("404")) {
            document.getElementById("notfound").style.display = "block";
        } else {
            document.getElementById("server").style.display = "block";
        }
        function show() {
            document.getElementById("message").style.display = "block";
        }
    </script>
{% endblock %}