add basic styling

leftists/static/css/index.css

@@ -0,0 +1,64 @@
+::root {
+    --font-mono: 0.5;
+    --font-casl: 0.49;
+    --font-wght: 400;
+    --font-slnt: 0;
+    --font-rep-roman: 1;
+}
+
+body {
+    font-family: 'Recursive', sans;
+    font-variation-settings: var(--font-mono), var(--font-casl), var(--font-wght), var(--font-slnt), var(--font-rep-roman);
+    background: lightgrey;
+
+}
+
+header {
+
+}
+
+main {
+    border: 1px #666 solid;
+    border-radius: 1ch;
+    background: white;
+    box-shadow: 0.5ch 0.5ch 1ch #bbb;
+    padding: 1ch;
+}
+
+th, td {
+    padding: 0 0.5ch;
+}
+
+.vcenter{
+    position: absolute;
+    top: 50%;
+    transform: translateY(-50%)
+}
+.hcenter{
+    position:absolute;
+    left: 50%;
+    margin-right: -50%;
+    transform: translateX(-50%)
+}
+
+.cl-form {
+    display: flex;
+    flex-direction: column;
+}
+.cl-from {
+    display: flex;
+    margin-bottom: 1ch;
+}
+.cl-to {
+    display: flex;
+    margin-bottom: 1ch;
+}
+.cl-submit {
+    width: 100%;
+}
+.cl-form-deco {
+    margin: 0 1ch;
+
+}
+
+#id_to { flex-grow: 1;}

leftists/templates/base.html

@@ -6,6 +6,7 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>{% block title %}lonk{% endblock %}</title>
+    <link rel="stylesheet" href="{% static 'css/index.css' %}">
 {#    <link rel="stylesheet" href="{% static 'css/normalize.css' %}">#}
 {#    <link rel="stylesheet" href="{% static 'forkawesome/css/fork-awesome.css' %}">#}
 {#    <link rel="stylesheet" href="{% static 'css/terminal.css' %}">#}
@@ -25,7 +26,7 @@
             </ul>
         </nav>
     </header>
-    <main>
+    <main class="vcenter hcenter">
         {% block main %}{% endblock %}
     </main>
     {% block js %}{% endblock %}

leftists/templates/interface/create_link.html

@@ -0,0 +1,14 @@
+{% extends "base.html" %}
+
+{% block main %}
+    <form method="post" class="cl-form">
+        {% csrf_token %}
+        <div class="cl-from">
+        {{ form.domain }} <p class="cl-form-deco">/</p> {{ form.location }}
+        </div>
+        <div class="cl-to">
+        <p class="cl-form-deco">→</p> {{ form.to }}
+        </div>
+        <input type="submit" value="Submit" class="cl-submit"/>
+    </form>
+{% endblock %}

leftists/views.py

@@ -49,7 +49,7 @@ class LinkListView(LoginRequiredMixin, ListView):
 
 
 class LinkCreateView(LoginRequiredMixin, CreateView):
-    template_name = 'interface/basic_form.html'
+    template_name = 'interface/create_link.html'
     model = ShortLink
     form_class = LinkForm
     success_url = reverse_lazy('interface.overview')
@@ -66,5 +66,3 @@ class LinkDeleteView(LoginRequiredMixin, DeleteView):
     template_name = 'interface/delete_link.html'
     model = ShortLink
     success_url = reverse_lazy('interface.overview')
-
-