Start an actual design

2018-05-10 21:31:52 +01:00
parent d3319493d9
commit a74215ef07
9 changed files with 165 additions and 39 deletions
@@ -6,7 +6,26 @@
        <link rel="stylesheet" href="/static/main.css">
    </head>
    <body>
-        {% block content %}
-        {% endblock content %}
+        <header>
+            <nav>
+                <a href="/">Plume</a>
+                {% block header %}
+                {% endblock header %}
+            </nav>
+            <nav>
+                {% if account %}
+                    <a href="/notifications">Notifications</a>
+                    <a href="/me">My account</a>
+                    <a href="/logout">Log Out</a>
+                {% else %}
+                    <a href="/login">Log In</a>
+                    <a href="/users/new">Register</a>
+                {% endif %}
+            </nav>
+        </header>
+        <main>
+            {% block content %}
+            {% endblock content %}
+        </main>
    </body>
 </html>
@@ -4,28 +4,34 @@
 {{ post.title }}
 {% endblock title %}

+{% block header %}
+    <a href="../">{{ blog.title }}</a>
+{% endblock header %}
+
 {% block content %}
    <h1>{{ post.title }}</h1>
-    <p>Published in {{ blog.title }}</p>
-    <hr>
-    <p>
+    <article>
        {{ post.content | safe }}
-    </p>
-    <p>License: {{ post.license }}</p>
-    <hr>
+    </article>

-    <p>
-        {{ n_likes }} like{{ n_likes | pluralize }}
-    </p>
-    <a href="like">Add yours</a>
+    <div class="article-meta">
+        <p>This article is under the {{ post.license }} license.</p>

-    <h2>Comments</h2>
-    {% for comment in comments %}
-        <div id="comment-{{ comment.id }}">
-            <b>{{ comment.author.display_name }}</b>
-            <div>{{ comment.content | safe }}</div>
-            <a href="comment?responding_to={{ comment.id }}">Respond</a>
+        <div class="inline">
+            <p>
+                {{ n_likes }} like{{ n_likes | pluralize }}
+            </p>
+            <a class="button" href="like">Add yours</a>
        </div>
-    {% endfor %}
-    <a href="comment?">Comment</a>
+
+        <h2>Comments</h2>
+        {% for comment in comments %}
+            <div class="comment" id="comment-{{ comment.id }}">
+                <b>{{ comment.author.display_name }}</b>
+                <div>{{ comment.content | safe }}</div>
+                <a href="comment?responding_to={{ comment.id }}">Respond</a>
+            </div>
+        {% endfor %}
+        <a class="button inline-block" href="comment?">Comment</a>
+    </div>
 {% endblock content %}