More UI!

9 files changed, 101 insertions, 25 deletions

diff --git a/templates/activities/_home_menu.html b/templates/activities/_home_menu.html
new file mode 100644
index 0000000..29d19e9
--- /dev/null
+++ b/templates/activities/_home_menu.html
@@ -0,0 +1,6 @@
+<nav>
+    <a href="/" {% if current_page == "home" %}class="selected"{% endif %}>Home</a>
+    <a href="/" {% if current_page == "mentions" %}class="selected"{% endif %}>Mentions</a>
+    <a href="/" {% if current_page == "public" %}class="selected"{% endif %}>Public</a>
+    <a href="/federated/" {% if current_page == "federated" %}class="selected"{% endif %}>Federated</a>
+</nav>
diff --git a/templates/activities/_post.html b/templates/activities/_post.html
index eef09db..a5e637f 100644
--- a/templates/activities/_post.html
+++ b/templates/activities/_post.html
@@ -1,4 +1,5 @@
 {% load static %}
+{% load activity_tags %}
 <div class="post">
 
     {% if post.author.icon_uri %}
@@ -7,20 +8,20 @@
         <img src="{% static "img/unknown-icon-128.png" %}" class="icon">
     {% endif %}
 
-    <h3 class="author">
-        <a href="{{ post.author.urls.view }}">
-            {{ post.author.name_or_handle }} <small>@{{ post.author.handle }}</small>
-        </a>
-    </h3>
     <time>
         <a href="{{ post.urls.view }}">
             {% if post.authored %}
-                {{ post.authored | timesince }} ago
+                {{ post.authored | timedeltashort }}
             {% else %}
-                {{ post.created | timesince }} ago
+                {{ post.created | timedeltashort }}
             {% endif %}
         </a>
     </time>
+
+    <a href="{{ post.author.urls.view }}" class="handle">
+        {{ post.author.name_or_handle }} <small>@{{ post.author.handle }}</small>
+    </a>
+
     <div class="content">
         {{ post.safe_content }}
     </div>
diff --git a/templates/activities/federated.html b/templates/activities/federated.html
new file mode 100644
index 0000000..8d8297b
--- /dev/null
+++ b/templates/activities/federated.html
@@ -0,0 +1,21 @@
+{% extends "base.html" %}
+
+{% block title %}Federated Timeline{% endblock %}
+
+{% block content %}
+    {% include "activities/_home_menu.html" %}
+
+    <section class="columns">
+        <div class="left-column">
+            {% for post in timeline_posts %}
+                {% include "activities/_post.html" %}
+            {% empty %}
+                No posts yet.
+            {% endfor %}
+        </div>
+        <div class="right-column">
+            <h2>?</h2>
+        </div>
+
+    </section>
+{% endblock %}
diff --git a/templates/activities/home.html b/templates/activities/home.html
index 9fe4bba..c777ce8 100644
--- a/templates/activities/home.html
+++ b/templates/activities/home.html
@@ -1,15 +1,32 @@
 {% extends "base.html" %}
-{% load crispy_forms_tags %}
 
 {% block title %}Home{% endblock %}
 
 {% block content %}
+    {% include "activities/_home_menu.html" %}
 
-    {% crispy form form.helper %}
+    <section class="columns">
 
-    {% for post in timeline_posts %}
-        {% include "activities/_post.html" %}
-    {% empty %}
-        No posts yet.
-    {% endfor %}
+        <div class="left-column">
+            {% for post in timeline_posts %}
+                {% include "activities/_post.html" %}
+            {% empty %}
+                No posts yet.
+            {% endfor %}
+        </div>
+
+        <div class="right-column">
+            <h2>Compose</h2>
+            <form action="." method="POST" class="compose">
+                {% csrf_token %}
+                {{ form.text }}
+                {{ form.content_warning }}
+                <div class="buttons">
+                    <span class="button toggle" _="on click toggle .enabled then toggle .hidden on #id_content_warning">CW</span>
+                    <button>Post</button>
+                </div>
+            </form>
+        </div>
+
+    </section>
 {% endblock %}
diff --git a/templates/auth/login.html b/templates/auth/login.html
index f8e1c9d..c892c78 100644
--- a/templates/auth/login.html
+++ b/templates/auth/login.html
@@ -1,11 +1,18 @@
 {% extends "base.html" %}
-{% load crispy_forms_tags %}
 
 {% block title %}Login{% endblock %}
 
 {% block content %}
-    <section class="modal identities">
-        <h1>Login</h1>
-        {% crispy form form.helper %}
-    </section>
+    <nav>
+        <a href="." class="selected">Login</a>
+    </nav>
+    <form action="." method="POST">
+        {% csrf_token %}
+        {% for field in form %}
+            {% include "forms/_field.html" %}
+        {% endfor %}
+        <div class="buttons">
+            <button>Login</button>
+        </div>
+    </form>
 {% endblock %}
diff --git a/templates/base.html b/templates/base.html
index 0f9edfb..d50fdcf 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -8,6 +8,7 @@
     <link rel="stylesheet" href="{% static "css/style.css" %}" type="text/css" media="screen" />
     <link rel="stylesheet" href="{% static "fonts/raleway/raleway.css" %}" type="text/css" />
     <link rel="stylesheet" href="{% static "fonts/font_awesome/all.min.css" %}" type="text/css" />
+    <script src="{% static "js/hyperscript.min.js" %}"></script>
     {% block extra_head %}{% endblock %}
 </head>
 <body class="{% block body_class %}{% endblock %}">
diff --git a/templates/forms/_field.html b/templates/forms/_field.html
new file mode 100644
index 0000000..120724e
--- /dev/null
+++ b/templates/forms/_field.html
@@ -0,0 +1,13 @@
+<div class="field">
+    <label for="{{ field.id_for_label }}">
+        {{ field.label }}
+        {% if field.field.required %}<small>(Required)</small>{% endif %}
+    </label>
+    {% if field.help_text %}
+        <p class="help">
+            {{ field.help_text }}
+        </p>
+    {% endif %}
+    {{ field.errors }}
+    {{ field }}
+</div>
diff --git a/templates/identity/create.html b/templates/identity/create.html
index 8e78e10..c69b55f 100644
--- a/templates/identity/create.html
+++ b/templates/identity/create.html
@@ -1,13 +1,19 @@
 {% extends "base.html" %}
 
-{% load crispy_forms_tags %}
-
 {% block title %}Create Identity{% endblock %}
 
 {% block content %}
     {% include "identity/_identity_menu.html" %}
-    <section class="modal identities">
-        <h1>Create Identity</h1>
-        {% crispy form form.helper %}
-    </section>
+    <form action="." method="POST">
+        <h1>Create New Identity</h1>
+        <p>You can have multiple identities - they are totally separate, and share
+        nothing apart from your login details. Use them for alternates, projects, and more.</p>
+        {% csrf_token %}
+        {% for field in form %}
+            {% include "forms/_field.html" %}
+        {% endfor %}
+        <div class="buttons">
+            <button>Create</button>
+        </div>
+    </form>
 {% endblock %}
diff --git a/templates/index.html b/templates/index.html
index dfd1805..9e09a43 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -3,6 +3,10 @@
 {% block title %}Welcome{% endblock %}
 
 {% block content %}
+    <nav>
+        <a href="/" class="selected">Home</a>
+    </nav>
+
     {% for identity in identities %}
         <a href="{{ identity.urls.view }}">{{ identity }}</a>
     {% endfor %}