Add theme

This commit is contained in:
David Hoppenbrouwers
2022-10-07 19:13:16 +02:00
parent a6695b3e39
commit 09cb2df004
11 changed files with 164 additions and 32 deletions

View File

@@ -46,9 +46,13 @@ def comment(comment_id):
user_id = session.get('user_id') user_id = session.get('user_id')
thread_id, parent_id, title, comments = db.get_subcomments(comment_id) thread_id, parent_id, title, comments = db.get_subcomments(comment_id)
comments = create_comment_tree(comments) comments = create_comment_tree(comments)
reply_comment, = comments
comments = reply_comment.children
reply_comment.children = []
return render_template( return render_template(
'comments.html', 'comments.html',
title = title, title = title,
reply_comment = reply_comment,
comments = comments, comments = comments,
parent_id = parent_id, parent_id = parent_id,
thread_id = thread_id, thread_id = thread_id,

91
static/theme.css Normal file
View File

@@ -0,0 +1,91 @@
body {
margin: 0;
font-family: sans-serif;
background-color: #f2f2e2;
margin-bottom: 30px;
}
body > * {
padding-left: 1em;
padding-right: 1em;
}
nav {
padding: 0;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
overflow-x: auto;
background-color: #ffca4b;
}
nav > * {
margin-top: auto;
margin-bottom: auto;
padding: 20px;
color: black;
}
main {
width: 80%;
margin: auto;
}
a {
text-decoration: none;
}
table {
border-collapse: collapse;
width: 100%;
}
tr:not(:last-child) {
border-bottom: 1px solid;
}
th, td {
padding: 5px;
text-align: left;
}
textarea {
width: 50em;
height: 15em;
font-size: 1em;
}
input[type=text] {
width: 50em;
font-family: monospace;
font-size: 1em;
}
.logo {
margin: 0;
padding: 5px;
padding-left: 15px;
font-size: 3em;
font-weight: bold;
}
table.form {
border-collapse: unset;
width: auto;
}
table.form > * > tr > td, th {
vertical-align: top;
}
.comment {
margin-left: 20px;
padding-left: 10px;
border-left: 1px dotted;
}
.flash.success {
background-color: #ff4646;
border-radius: 5px;
padding: 8px;
}

View File

@@ -1,23 +1,27 @@
<!doctype html> <!doctype html>
<head> <head>
<title>{{ title }}</title> <title>{{ title }}</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta content="utf-8" http-equiv="encoding">
<link rel=stylesheet href="{{ url_for('static', filename='theme.css') }}">
</head> </head>
<body> <body>
<nav> <nav>
<a href="{{ url_for('index') }}">Home</a> <a class=logo href="{{ url_for('index') }}">A</a>
<div style="margin:auto"></div>
{% if 'user_id' in session %} {% if 'user_id' in session %}
<a href="{{ url_for('user_edit') }}">{{ session.get('username', '???') }}</a> <a href="{{ url_for('user_edit') }}">{{ session.get('username', '???') }}</a>
| <span>|</span>
<a href="{{ url_for('logout') }}">Logout</a> <a href="{{ url_for('logout') }}">Logout</a>
{% else %} {% else %}
<a href="{{ url_for('login') }}">Login</a> <a href="{{ url_for('login') }}">Login</a>
{% endif %} {% endif %}
</nav> </nav>
<h1>{{ title }}</h1>
{% for category, msg in get_flashed_messages(True) %}
<p>{{ category}}: {{ msg }}</p>
{% endfor %}
<main> <main>
<h1>{{ title }}</h1>
{% for category, msg in get_flashed_messages(True) %}
<p class="flash {{ category }}">{{ msg }}</p>
{% endfor %}
{% block content %}{% endblock %} {% block content %}{% endblock %}
</main> </main>
</body> </body>

View File

@@ -1,19 +1,27 @@
{% macro render_comment(comment) %} {% macro render_comment_pre(comment) %}
<div style="margin-left:20px"> <div class=comment>
<p><i>{{ comment.author }}</i></p> <p><sub><i>{{ comment.author }}</i></sub></p>
<p>{{ comment.text }}</p> <p>{{ comment.text }}</p>
<sup><a href="{{ url_for("comment", comment_id = comment.id) }}">reply</a></sup> {% endmacro %}
{% macro render_comment_post(comment) %}
{% for c in comment.children %} {% for c in comment.children %}
{{ render_comment(c) }} {{ render_comment(c) }}
{% endfor %} {% endfor %}
</div> </div>
{% endmacro %} {% endmacro %}
{% macro render_comment(comment) %}
{{ render_comment_pre(comment) }}
<sup><a href="{{ url_for("comment", comment_id = comment.id) }}">reply</a></sup>
{{ render_comment_post(comment) }}
{% endmacro %}
{% macro reply() %} {% macro reply() %}
{% if 'user_id' in session %} {% if 'user_id' in session %}
<form method="post" action="comment/"> <form method="post" action="comment/">
<textarea name="text"></textarea> <p><textarea name="text"></textarea></p>
<input type="submit" value="Post comment"> <p><input type="submit" value="Post comment"></p>
</form> </form>
{% endif %} {% endif %}
{% endmacro %} {% endmacro %}

View File

@@ -1,5 +1,5 @@
{% extends 'base.html' %} {% extends 'base.html' %}
{% from 'comment.html' import render_comment, reply %} {% from 'comment.html' import render_comment, render_comment_pre, render_comment_post, reply %}
{% block content %} {% block content %}
<sup><a href="{{ url_for('thread', thread_id = thread_id) }}">thread</a></sup> <sup><a href="{{ url_for('thread', thread_id = thread_id) }}">thread</a></sup>
@@ -7,9 +7,14 @@
<sup><a href="../{{ parent_id }}">parent</a></sup> <sup><a href="../{{ parent_id }}">parent</a></sup>
{% endif %} {% endif %}
{{ render_comment_pre(reply_comment) }}
{{ reply() }} {{ reply() }}
{% for c in comments %} {% for c in comments %}
{{ render_comment(c) }} {{ render_comment(c) }}
{% endfor %} {% endfor %}
{{ render_comment_post(reply_comment) }}
{% endblock %} {% endblock %}

View File

@@ -2,10 +2,12 @@
{% block content %} {% block content %}
<p>Are you sure you want to delete "{{ thread_title }}"?</p> <p>Are you sure you want to delete "{{ thread_title }}"?</p>
<form method="post" action="../delete"> <p>
<input type="submit" value="Yes"> <form method="post" action="../delete" style=inline>
</form> <input type="submit" value="Yes">
<form method="get" action=".."> </form>
<input type="submit" value="No"> <form method="get" action=".." style=inline>
</form> <input type="submit" value="No">
</form>
</p>
{% endblock %} {% endblock %}

View File

@@ -1,9 +1,14 @@
{% extends 'base.html' %} {% extends 'base.html' %}
{% block content %} {% block content %}
<ul> <table>
<tr>
<th>Forum</th>
</tr>
{% for id, name, description in subforums %} {% for id, name, description in subforums %}
<li><a href="{{ url_for('subforum', forum_id = id) }}">{{ name }} - {{ description }}</a></li> <tr>
<td><a href="{{ url_for('subforum', forum_id = id) }}"><b>{{ name }}</b> - {{ description }}</a></td>
</tr>
{% endfor %} {% endfor %}
</ul> </table>
{% endblock %} {% endblock %}

View File

@@ -2,8 +2,16 @@
{% block content %} {% block content %}
<form method="post"> <form method="post">
<input type="text" name="title"> <table class=form>
<textarea name="text"></textarea> <tr>
<input type="submit" value="Post"> <td>Title</td>
<td><input type="text" name="title"></td>
</tr>
<tr>
<td>Text</td>
<td><textarea name="text"></textarea></td>
</tr>
</table>
<p><input type="submit" value="Post"></p>
</form> </form>
{% endblock %} {% endblock %}

View File

@@ -2,10 +2,15 @@
{% block content %} {% block content %}
<p>{{ description }}</p> <p>{{ description }}</p>
<a href="{{ url_for('new_thread', forum_id = forum_id) }}">Create thread</a> <p><a href="{{ url_for('new_thread', forum_id = forum_id) }}">Create thread</a></p>
<ul> <table>
<tr>
<th>Topic</th>
</tr>
{% for id, title in threads %} {% for id, title in threads %}
<li><a href="{{ url_for('thread', thread_id = id) }}">{{ title }}</a></li> <tr>
<th><a href="{{ url_for('thread', thread_id = id) }}">{{ title }}</a></th>
</tr>
{% endfor %} {% endfor %}
</ul> </table>
{% endblock %} {% endblock %}

View File

@@ -9,7 +9,7 @@
</form> </form>
</div> </div>
{% endif %} {% endif %}
<p>{{ author }} - rjgoire</p> <sup><i>{{ author }}</i></sup>
<p>{{ text }}</p> <p>{{ text }}</p>
{{ reply() }} {{ reply() }}

View File

@@ -3,7 +3,7 @@
{% block content %} {% block content %}
<form method="post"> <form method="post">
<p>{{ name }}</p> <p>{{ name }}</p>
<textarea name="about">{{ about }}</textarea> <p><textarea name="about">{{ about }}</textarea></p>
<input type="submit" value="Update"> <p><input type="submit" value="Update"></p>
</form> </form>
{% endblock %} {% endblock %}