start porting some topics stuff

app/templates/topics/create.html

@@ -0,0 +1,14 @@
+{% extends "base.html" %}
+{% block title %}creating a topic{% endblock %}
+{% block content %}
+<div class="darkbg settings-container">
+  <h1>Create topic</h1>
+  <form method="post">
+    <label for=name>Name</label>
+    <input type="text" name="name" id="name" required><br>
+    <label for="description">Description</label>
+    <textarea id="description" name="description" required rows=5></textarea><br>
+    <input type="submit" value="Create topic">
+  </form>
+</div>
+{% endblock %}

app/templates/topics/topic.html

@@ -0,0 +1,55 @@
+{% from 'common/pager.html' import pager %}
+{% extends "base.html" %}
+{% block title %}browsing topic {{ topic['name'] }}{% endblock %}
+{% block content %}
+<nav class="darkbg">
+  <h1 class="thread-title">All threads in "{{topic['name']}}"</h1>
+  <span>{{topic['description']}}</span>
+  <div>
+    {% if active_user and active_user.is_mod() %}
+    {% endif %}
+  </div>
+</nav>
+
+{% if topic['is_locked'] %}
+  {{ infobox("This topic is locked. Only moderators can create new threads.", InfoboxKind.INFO) }}
+{% endif %}
+
+{% if threads_list | length == 0 %}
+  <p>There are no threads in this topic.</p>
+{% else %}
+  {% for thread in threads_list %}
+    <div class="thread">
+      <div class="thread-sticky-container contain-svg">
+        {% if thread['is_stickied'] %}
+          <img src="/static/misc/sticky.svg">
+          <i>Stickied</i>
+        {% endif %}
+      </div>
+      <div class="thread-info-container">
+        <span>
+          <span class="thread-title"><a href="{{ url_for("threads.thread", slug=thread['slug']) }}">{{thread['title']}}</a></span>
+          &bullet;
+          Started by <a href="{{ url_for("users.page", username=thread['started_by']) }}">{{ thread['started_by'] }}</a> on ...
+        </span>
+        <span>
+          Latest post by <a href="{{ url_for("users.page", username=thread['latest_post_username']) }}">{{ thread['latest_post_username'] }}</a>
+          on ...
+        </span>
+        <span class="thread-info-post-preview">
+          {{ thread['latest_post_content'] }}
+        </span>
+      </div>
+      <div class="thread-locked-container contain-svg">
+        {% if thread['is_locked'] %}
+          <img src="/static/misc/lock.svg">
+          <i>Locked</i>
+        {% endif %}
+      </div>
+    </div>
+  {% endfor %}
+{% endif %}
+<nav id="bottomnav">
+  {{ pager(current_page = current_page, page_count = page_count) }}
+</nav>
+{% endblock %}

app/templates/topics/topics.html

@@ -2,6 +2,40 @@
 {% block content %}
 <nav class="darkbg">
   <h1 class="thread-title">All topics</h1>
-  <span>{{admin.is_default_avatar()}}</span>
+  {% if active_user and active_user.is_mod() %}
+    <a class="linkbutton" href={{ url_for("topics.create") }}>Create new topic</a>
+  {% endif %}
 </nav>
+{% if topic_list | length == 0 %}
+  <p>There are no topics.</p>
+{% else %}
+  {% for topic in topic_list %}
+    <div class="topic">
+      <div class="topic-info-container">
+        <a class="thread-title" href="{{ url_for("topics.topic", slug=topic['slug']) }}">{{ topic['name'] }}</a>
+        {{ topic['description'] }}
+        {% if topic['latest_thread_username'] %}
+          <span>
+            Latest thread: <a href="{{ url_for("threads.thread", slug=topic['latest_thread_slug'])}}">{{topic['latest_thread_title']}}</a> by <a href="{{url_for("users.page", username=topic['latest_thread_username'])}}">{{topic['latest_thread_username']}}</a> on ...
+          </span>
+          {% if topic['id'] in active_threads %}
+            {% with thread=active_threads[topic['id']] %}
+              <span>
+                Latest post in: <a href="{{ url_for("threads.thread", slug=thread['thread_slug'])}}">{{ thread['thread_title'] }}</a> by <a href="{{ url_for("users.page", username=thread['username'])}}">{{ thread['username'] }}</a> on ...
+              </span>
+            {% endwith %}
+          {% endif %}
+        {% else %}
+          <i>No threads yet.</i>
+        {% endif %}
+        </div>
+        <div class="topic-locked-container contain-svg">
+          {% if topic['is_locked'] %}
+            <img src="/static/misc/lock.svg"></img>
+            <i>Locked</i>
+          {% endif %}
+        </div>
+    </div>
+  {% endfor %}
+{% endif %}
 {% endblock %}