better spacing; better forms

8 files changed, 195 insertions, 105 deletions

diff --git a/ignis/views.py b/ignis/views.py
index 942ab187..06454206 100644
--- a/ignis/views.py
+++ b/ignis/views.py
@@ -15,38 +15,43 @@ from .models import PostImage, RepositoryTitle
 
 # from .github import get_cover
 
+
 # Create your views here.
 @csrf_exempt
 def tex(request):
     # get expression from request query
-    expression = request.GET.get('expr').replace('"', '').strip()
+    expression = request.GET.get("expr").replace('"', "").strip()
     if not expression:
-        return HttpResponse('No expression provided!', status=400)
+        return HttpResponse("No expression provided!", status=400)
 
     import requests
 
-    image = requests.get('https://latex.codecogs.com/png.image?%5Cinline%20%5Clarge%20%5Cdpi%7B200%7D%5Cbg%7Btransparent%7D' + expression).content
+    image = requests.get(
+        "https://latex.codecogs.com/png.image?%5Cinline%20%5Clarge%20%5Cdpi%7B200%7D%5Cbg%7Btransparent%7D"
+        + expression
+    ).content
 
     # Image is a transparent GIF with black text. Invert the colors.
     image = Image.open(BytesIO(image))
-    image = image.convert('RGBA')
+    image = image.convert("RGBA")
     image = Image.eval(image, lambda x: 255 - x)
 
     # Convert back to gif and return
     output = BytesIO()
-    image.save(output, format='GIF')
-    return HttpResponse(output.getvalue(), content_type='image/gif')
+    image.save(output, format="GIF")
+    return HttpResponse(output.getvalue(), content_type="image/gif")
+
 
 @csrf_exempt
 def post_image(request, size, post_id):
-    post_id = post_id.replace('.gif', '')
+    post_id = post_id.replace(".gif", "")
     pi = Post.objects.get(id=post_id)
     if not pi:
-        return HttpResponse('No image found!', status=404)
-    
+        return HttpResponse("No image found!", status=404)
+
     # open image and return
     image = pi.post_image
-    with open(image.path, 'rb') as f:
+    with open(image.path, "rb") as f:
         # resize image
         size = int(size)
         if size != 0:
@@ -56,7 +61,7 @@ def post_image(request, size, post_id):
                 size = 100
             elif size > 1000:
                 size = 1000
-            
+
             image = Image.open(f)
             # resize width to size, compute height
             width, height = image.size
@@ -66,50 +71,54 @@ def post_image(request, size, post_id):
             # resize image
             image = image.resize((width, height), Image.ANTIALIAS)
             output = BytesIO()
-            image.save(output, format='GIF')
-            return HttpResponse(output.getvalue(), content_type='image/gif')
+            image.save(output, format="GIF")
+            return HttpResponse(output.getvalue(), content_type="image/gif")
         else:
-            return HttpResponse(f.read(), content_type='image/gif')
+            return HttpResponse(f.read(), content_type="image/gif")
+
 
 @csrf_exempt
 def get_image(request, post_id, image_name):
     # get image from post_id
-    try: 
+    try:
         post = Post.objects.get(id=post_id)
     except:
-        return HttpResponse('No post found!', status=404)
+        return HttpResponse("No post found!", status=404)
     pi = PostImage.objects.filter(post=post, name=image_name)
     if not pi:
-        return HttpResponse('No image found!', status=404)
-    
+        return HttpResponse("No image found!", status=404)
+
     # open image and return
     image = pi[0].image
-    with open(image.path, 'rb') as f:
+    with open(image.path, "rb") as f:
         image_file = f.read()
         # convert to gif
         image = Image.open(BytesIO(image_file))
         # check image format
-        if image.format != 'GIF':
-            image = image.convert('RGBA')
+        if image.format != "GIF":
+            image = image.convert("RGBA")
             output = BytesIO()
-            image.save(output, format='GIF')
+            image.save(output, format="GIF")
             image_file = output.getvalue()
-        return HttpResponse(image_file, content_type='image/gif')
+        return HttpResponse(image_file, content_type="image/gif")
+
 
 @csrf_exempt
 def cover_image(request, repository):
-    force_reload = request.GET.get('force_reload')
-    repository = repository.replace('.gif', '')
+    force_reload = request.GET.get("force_reload")
+    repository = repository.replace(".gif", "")
     # check if the image is in RepositoryTitles
     try:
         if force_reload:
-            raise Exception('Force reload')
+            raise Exception("Force reload")
         repository_title = RepositoryTitle.objects.get(repository=repository)
         image = repository_title.image
     except:
         # image is not in RepositoryTitles
         # get image
-        url = 'https://socialify.thatcomputerscientist.com/luciferreeves/{}/png?font=KoHo&language=1&language2=1&name=1&theme=Dark&pattern=Solid'.format(repository)
+        url = "https://socialify.thatcomputerscientist.com/luciferreeves/{}/png?font=KoHo&language=1&language2=1&name=1&theme=Dark&pattern=Solid".format(
+            repository
+        )
         image = requests.get(url).content
 
         # reduce image size to 320x160
@@ -117,7 +126,7 @@ def cover_image(request, repository):
         image = image.resize((320, 160), Image.ANTIALIAS)
 
         # remove black background
-        image = image.convert('RGBA').getdata()
+        image = image.convert("RGBA").getdata()
         new_data = []
         for item in image:
             if item[0] == 0 and item[1] == 0 and item[2] == 0:
@@ -127,75 +136,94 @@ def cover_image(request, repository):
 
         # Convert back to png and return
         output = BytesIO()
-        image = Image.new('RGBA', (320, 160))
+        image = Image.new("RGBA", (320, 160))
         image.putdata(new_data)
-        image.save(output, format='GIF')
+        image.save(output, format="GIF")
         image = output.getvalue()
 
         # save image to RepositoryTitles
-        image = ContentFile(image, name='{}.png'.format(repository))
+        image = ContentFile(image, name="{}.png".format(repository))
         repository_title = RepositoryTitle(repository=repository, image=image)
         repository_title.save()
 
-    return HttpResponse(image, content_type='image/gif')
+    return HttpResponse(image, content_type="image/gif")
 
 
 def upload_image(request):
-    if request.method == 'POST':
+    if request.method == "POST":
         if not request.user.is_authenticated and not request.user.is_staff:
-            return HttpResponse('Unauthorized', status=401)
-        if not request.FILES.get('image'):
-            return HttpResponse('No image provided!', status=400)
-        if not request.POST.get('id'):
-            return HttpResponse('No id provided!', status=400)
-        
+            return HttpResponse("Unauthorized", status=401)
+        if not request.FILES.get("image"):
+            return HttpResponse("No image provided!", status=400)
+        if not request.POST.get("id"):
+            return HttpResponse("No id provided!", status=400)
+
         # upload image to PostImage model
-        image = request.FILES['image']
-        post_id = request.POST['id']
+        image = request.FILES["image"]
+        post_id = request.POST["id"]
         # check if image already exists
-        pi = PostImage.objects.filter(post=Post.objects.get(id=post_id), name=image.name)
+        pi = PostImage.objects.filter(
+            post=Post.objects.get(id=post_id), name=image.name
+        )
         if pi:
             # image already exists, delete it
             pi[0].delete()
         # save image to post_id
         pi = PostImage(image=image, post=Post.objects.get(id=post_id), name=image.name)
         pi.save()
-        response = {
-            'url': '/ignis/image/{}/{}'.format(post_id, pi.name)
-        }
-        return HttpResponse(json.dumps(response), content_type='application/json')
-    return HttpResponse('Method not allowed', status=405)
+        response = {"url": "/ignis/image/{}/{}".format(post_id, pi.name)}
+        return HttpResponse(json.dumps(response), content_type="application/json")
+    return HttpResponse("Method not allowed", status=405)
+
 
 def captcha_image(request, captcha_string):
     captcha = CaptchaTokenGenerator().decrypt(captcha_string)
     imgcaptcha = ImageCaptcha()
+    imgcaptcha.character_rotate = (-15, 15)
+    imgcaptcha.character_warp_dx = (0, 0)
+    imgcaptcha.character_warp_dy = (0, 0)
+    imgcaptcha.character_offset_dx = (12, 20)
+    imgcaptcha.character_offset_dy = (0, 6)
     data = imgcaptcha.generate(captcha)
-    return HttpResponse(data, content_type='image/png')
+    return HttpResponse(data, content_type="image/png")
+
 
 def socialify(request):
-    repo = request.GET.get('repo')
-    theme = request.GET.get('theme')
-    font = request.GET.get('font')
-    pattern = request.GET.get('pattern')
-    name = request.GET.get('name')
-    description = request.GET.get('description')
-    language_1 = request.GET.get('language_1')
-    language_2 = request.GET.get('language_2')
-    stargazers = request.GET.get('stargazers')
-    forks = request.GET.get('forks')
-    issues = request.GET.get('issues')
-    pulls = request.GET.get('pulls')
-
-    url = 'https://socialify.thatcomputerscientist.com/{}/png?description={}&font={}&forks={}&issues={}&language={}&language2={}&name={}&owner=1&pattern={}&pulls={}&stargazers={}&theme={}'.format(repo, description, font, forks, issues, language_1, language_2, name, pattern, pulls, stargazers, theme)
+    repo = request.GET.get("repo")
+    theme = request.GET.get("theme")
+    font = request.GET.get("font")
+    pattern = request.GET.get("pattern")
+    name = request.GET.get("name")
+    description = request.GET.get("description")
+    language_1 = request.GET.get("language_1")
+    language_2 = request.GET.get("language_2")
+    stargazers = request.GET.get("stargazers")
+    forks = request.GET.get("forks")
+    issues = request.GET.get("issues")
+    pulls = request.GET.get("pulls")
+
+    url = "https://socialify.thatcomputerscientist.com/{}/png?description={}&font={}&forks={}&issues={}&language={}&language2={}&name={}&owner=1&pattern={}&pulls={}&stargazers={}&theme={}".format(
+        repo,
+        description,
+        font,
+        forks,
+        issues,
+        language_1,
+        language_2,
+        name,
+        pattern,
+        pulls,
+        stargazers,
+        theme,
+    )
 
     req = requests.get(url)
     image = req.content
     status = req.status_code
 
     if status == 200:
-        return HttpResponse(image, content_type='image/png')
+        return HttpResponse(image, content_type="image/png")
     else:
-        with open('static/images/site/utgi.gif', 'rb') as f:
+        with open("static/images/site/utgi.gif", "rb") as f:
             image = f.read()
-            return HttpResponse(image, content_type='image/gif')
-
+            return HttpResponse(image, content_type="image/gif")
diff --git a/templates/blog/anilist.html b/templates/blog/anilist.html
index 22fe6801..2ab01484 100644
--- a/templates/blog/anilist.html
+++ b/templates/blog/anilist.html
@@ -1,16 +1,27 @@
-{% extends 'blog/partials/base.html' %} {% block content %}
-{% load static %}    
-<div class="iframe-loader" style="margin-top: 70px;">
-    <iframe src="{% url 'blog:anidata' %}" width="100%" height="100%" frameborder="0" id="anilist"></iframe>
+{% extends 'blog/partials/base.html' %} {% block content %} {% load static %}
+<div class="iframe-loader" style="margin-top: 36px">
+  <iframe
+    src="{% url 'blog:anidata' %}"
+    width="100%"
+    height="100%"
+    frameborder="0"
+    id="anilist"
+  ></iframe>
 </div>
-<hr>
+<hr />
 <ul>
-    <li>Data is fetched from <a href="https://myanimelist.net/animelist/crvs" target="_blank">MyAnimeList</a>.</li>
-    <li>I <i>do not</i> update the list regularly. Some anime might be missing.</li>
+  <li>
+    Data is fetched from
+    <a href="https://myanimelist.net/animelist/crvs" target="_blank"
+      >MyAnimeList</a
+    >.
+  </li>
+  <li>
+    I <i>do not</i> update the list regularly. Some anime might be missing.
+  </li>
 </ul>
-{% endblock content %}
-{% block scripts %}
+{% endblock content %} {% block scripts %}
 <script type="text/javascript">
-    $('#anilist').css('height', $(window).height()+'px');
+  $("#anilist").css("height", $(window).height() + "px");
 </script>
-{% endblock scripts %}
\ No newline at end of file
+{% endblock scripts %}
diff --git a/templates/blog/partials/base.html b/templates/blog/partials/base.html
index 7484665c..06fd4787 100644
--- a/templates/blog/partials/base.html
+++ b/templates/blog/partials/base.html
@@ -96,7 +96,11 @@
           <td id="sidebar" valign="top">
             {% include 'blog/partials/sidebar.html' %}
           </td>
-          <td id="content" valign="top" style="padding-left: 20px">
+          <td
+            id="content"
+            valign="top"
+            style="padding-left: 20px; {% if not user.is_authenticated %}padding-top: 32px;{% endif %}"
+          >
             {% block content %} {% endblock %}
           </td>
         </tr>
diff --git a/templates/blog/post.html b/templates/blog/post.html
index f4fec7b9..5a98e981 100644
--- a/templates/blog/post.html
+++ b/templates/blog/post.html
@@ -2,7 +2,7 @@
 {% load static %}
 {% load tz %}
 {% load sha256 %}
-<div id="post-actions-bar" class="mtsbitem">
+<div id="post-actions-bar" class="mtsbitem" style="margin-top: 12px;">
     <a class="pa-btn" href="{% url 'blog:home' %}">Home</a>
     <a class="pa-btn" href="#comments">Opinions</a>
     <a class="pa-btn" href="javascript:;" onclick="lightsOff()">Focus <img id="lightsStatus" data-status="off" src="{% static 'images/site/off.png' %}" alt="Off" style="height: 11px; position: relative; top: 2px;"></a>
diff --git a/templates/blog/register.html b/templates/blog/register.html
index ec470cb3..16ff128a 100644
--- a/templates/blog/register.html
+++ b/templates/blog/register.html
@@ -1,24 +1,42 @@
 {% extends 'blog/partials/base.html' %} {% block content %}
-<h1 style="margin-top: 0px;">Register for an account</h1>
-<p>Register for an account to post your thoughts and get feedback from other users.</p>
-<hr>
+<h1 style="margin-top: 30px">Register for an account</h1>
+<p>
+  Register for an account to post your thoughts and get feedback from other
+  users.
+</p>
+<hr />
 <form method="post">
-    <input type="hidden" name="csrfmiddlewaretoken" value="{{ csrf_token }}" style="display: none;">
-    <table id="register_form">
-        {{ form.as_table }}
-    </table>
-    <p><img width="160" height="60" src="{% url 'ignis:captcha_image' captcha %}" alt="Captcha" id="captcha"></p>
-    <input type="hidden" name="expected_captcha" value="{{ captcha }}">
-    <input type="submit" value="Register" class="button button-special">
+  <input
+    type="hidden"
+    name="csrfmiddlewaretoken"
+    value="{{ csrf_token }}"
+    style="display: none"
+  />
+  <table id="register_form">
+    {{ form.as_table }}
+  </table>
+  <p>
+    <img
+      width="160"
+      height="60"
+      src="{% url 'ignis:captcha_image' captcha %}"
+      alt="Captcha"
+      id="captcha"
+    />
+  </p>
+  <input type="hidden" name="expected_captcha" value="{{ captcha }}" />
+  <input type="submit" value="Register" class="button button-special" />
 </form>
-<br><br>
-<p>By registering on this site, you agree to everything that's <a href="{% url 'blog:policy' %}">written here</a>.</p>
-<p><b>Note</b>: Upon registering, you will be sent an email with a link to activate your account. If you don't activate your account within 72 hours, your username will be released and you will have to register again.</p>
-{% for message in messages %}
-    {% if 'accountCreated' in message.tags %}
-        <p><small class="success">{{ message.message }}</small></p>
-    {% endif %}
-{% endfor %}
-{% endblock %}
-
-
+<br /><br />
+<p>
+  By registering on this site, you agree to everything that's
+  <a href="{% url 'blog:policy' %}">written here</a>.
+</p>
+<p>
+  <b>Note</b>: Upon registering, you will be sent an email with a link to
+  activate your account. If you don't activate your account within 72 hours,
+  your username will be released and you will have to register again.
+</p>
+{% for message in messages %} {% if 'accountCreated' in message.tags %}
+<p><small class="success">{{ message.message }}</small></p>
+{% endif %} {% endfor %} {% endblock %}
diff --git a/templates/blog/resetpass.html b/templates/blog/resetpass.html
index 7dbdab05..81c68c56 100644
--- a/templates/blog/resetpass.html
+++ b/templates/blog/resetpass.html
@@ -1,4 +1,5 @@
 {% extends 'blog/partials/base.html' %} {% block content %}
+<h1 style="margin-top: 30px">Reset your Password</h1>
 <p>
   Forgot your password? No problem! Just enter your email address below, (the
   email you registered with) and I will send you a link to reset your password.
diff --git a/templates/blog/resetpass_input.html b/templates/blog/resetpass_input.html
index 7adc54d6..939eab9d 100644
--- a/templates/blog/resetpass_input.html
+++ b/templates/blog/resetpass_input.html
@@ -1,4 +1,5 @@
 {% extends 'blog/partials/base.html' %} {% block content %}
+<h1 style="margin-top: 30px">Reset your Password</h1>
 <p>
   Enter a new password for your account. Your password must be at least 8
   characters long.
diff --git a/users/forms.py b/users/forms.py
index 016ad6bb..fbb5e244 100644
--- a/users/forms.py
+++ b/users/forms.py
@@ -16,15 +16,40 @@ from .mail_send import send_email
 
 
 class RegisterForm(forms.Form):
-    username = forms.CharField(label="Username", max_length=30, min_length=4)
-    email = forms.EmailField(label="Email")
+    username = forms.CharField(
+        label="Username",
+        max_length=30,
+        min_length=4,
+        required=True,
+        widget=forms.TextInput(
+            attrs={"placeholder": "Username", "autocomplete": "off"}
+        ),
+    )
+    email = forms.EmailField(
+        label="Email",
+        max_length=255,
+        required=True,
+        widget=forms.EmailInput(attrs={"placeholder": "Email", "autocomplete": "off"}),
+    )
     password1 = forms.CharField(
-        label="Password", widget=forms.PasswordInput, min_length=8
+        label="Password",
+        min_length=8,
+        required=True,
+        widget=forms.PasswordInput(attrs={"placeholder": "Password"}),
     )
     password2 = forms.CharField(
-        label="Password (again)", widget=forms.PasswordInput, min_length=8
+        label="Password (again)",
+        widget=forms.PasswordInput(attrs={"placeholder": "Password (again)"}),
+        min_length=8,
+        required=True,
+    )
+    captcha = forms.CharField(
+        label="Captcha",
+        max_length=6,
+        min_length=6,
+        required=True,
+        widget=forms.TextInput(attrs={"placeholder": "Captcha", "autocomplete": "off"}),
     )
-    captcha = forms.CharField(label="Captcha", max_length=6)
     expected_captcha = None
     protected_usernames = [
         "admin",
@@ -169,6 +194,7 @@ class ForgotPasswordForm(forms.Form):
         else:
             raise forms.ValidationError("Failed to send email.")
 
+
 class ResetPasswordForm(forms.Form):
     password1 = forms.CharField(
         label="New Password", widget=forms.PasswordInput, min_length=8
@@ -193,6 +219,7 @@ class ResetPasswordForm(forms.Form):
         user.save()
         return user
 
+
 class UpdateUserDetailsForm(forms.Form):
     first_name = forms.CharField(
         label="First name",