Added settings page

Added logging to a .log file
Fixed Images loosing colour and rotation on thumbnail generation
Added more info to README

gallery/templates/settings/account.html

@@ -0,0 +1,6 @@
+{% extends 'settings/settings_layout.html' %}
+
+{% block settings_account %}settings-nav__item-selected{% endblock %}
+{% block settings_content %}
+    <h2>Account</h2>
+{% endblock %}

gallery/templates/settings/general.html

@@ -0,0 +1,6 @@
+{% extends 'settings/settings_layout.html' %}
+
+{% block settings_general %}settings-nav__item-selected{% endblock %}
+{% block settings_content %}
+    <h2>General</h2>
+{% endblock %}

gallery/templates/settings/logs.html

@@ -0,0 +1,30 @@
+{% extends 'settings/settings_layout.html' %}
+
+{% block settings_logs %}settings-nav__item-selected{% endblock %}
+{% block settings_content %}
+    <h2>Logs</h2>
+    <div class="settings-list" id="logs">
+        <div class="log" style="display:flex;flex-direction:row;gap:0.5rem;"></div>
+    </div>
+{% endblock %}
+
+{% block script %}
+    <script>
+        const output = document.getElementById('logs');
+
+        setInterval(function() {
+            $.ajax({
+                url: '{{ url_for('api.logfile') }}',
+                type: 'GET',
+                dataType: "json",
+                success: function(response) {
+                    
+                    // for each item in response, log to console
+                    response.forEach(function(item) {
+                        console.log(item);
+                    });
+                }
+            });
+        }, 1000); // 10 seconds
+    </script>
+{% endblock %}

gallery/templates/settings/server.html

@@ -0,0 +1,6 @@
+{% extends 'settings/settings_layout.html' %}
+
+{% block settings_server %}settings-nav__item-selected{% endblock %}
+{% block settings_content %}
+    <h2>Server</h2>
+{% endblock %}

gallery/templates/settings/settings_layout.html

@@ -0,0 +1,29 @@
+{% extends 'layout.html' %}
+
+{% block header %}
+    <div class="banner">
+        <img src="{{ url_for('static', filename='images/leaves.jpg') }}" onload="imgFade(this)" style="opacity:0;"/>
+        <span></span>
+
+        <div class="banner__content">
+            {% block banner_subtitle%}{% endblock %}
+            <h1>Settings</h1>
+            <p>All the red buttons in one place, what could go wrong?</p>
+        </div>
+    </div>
+{% endblock %}
+{% block nav_settings %}navigation-item__selected{% endblock %}
+{% block wrapper_class %}settings-wrapper{% endblock %}
+
+{% block content %}
+    <div class="settings-nav">
+        <a href="{{ url_for('settings.general') }}" class="settings-nav__item {% block settings_general %}{% endblock %}">General</a>
+        <a href="{{ url_for('settings.server') }}" class="settings-nav__item {% block settings_server %}{% endblock %}">Server</a>
+        <a href="{{ url_for('settings.account') }}" class="settings-nav__item {% block settings_account %}{% endblock %}">Account</a>
+        <a href="{{ url_for('settings.logs') }}" class="settings-nav__item {% block settings_logs %}{% endblock %}">Logs</a>
+    </div>
+
+    <div class="settings-content">
+        {% block settings_content %}{% endblock %}
+    </div>
+{% endblock %}