improvement of design

.gitignore

-/rodTraa/venv/

rodTraa/Templates/challenges.html

@@ -2,9 +2,10 @@
 {% load static %}
 {% block body %}
     {% for post in challengeposts %}
-<div style="border-radius: 20px ;margin-top: 100px;width: 60%; margin-left: 20%; background-color: white; height: 420px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);">
+<div style="border-radius: 20px ;margin-top: 100px;width: 60%; margin-left: 20%; background-color: white; height: 550px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);">
     <div style="display: block; margin-left: auto; margin-right: auto; padding-top: 50px; width:60%">
-        <img style="width:100%"; src="{{ post.image.url }}">
+    {{ post.post_owner }}<br>
+        <img style=" max-width: 100%; max-height: 400px " src="{{ post.image.url }}">
     </div>
 <div style="display: block; margin-left: auto; margin-right: auto; width: 60% ">{{ post.text }}</div>
 </div>

rodTraa/Templates/myprofile.html

@@ -17,9 +17,10 @@
 </div>
 </div>
      {% for post in posts %}
-<div style="border-radius: 20px ;margin-top: 100px;width: 60%; margin-left: 20%; background-color: white; height: 420px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);">
+<div style="border-radius: 20px ;margin-top: 100px;width: 60%; margin-left: 20%; background-color: white; height: 550px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);">
     <div style="display: block; margin-left: auto; margin-right: auto; padding-top: 50px; width:60%">
-        <img style="width:100%"; src="{{ post.image.url }}">
+    {{ post.post_owner }}<br>
+        <img style="max-width:100%; max-height: 400px"; src="{{ post.image.url }}">
     </div>
 <div style="display: block; margin-left: auto; margin-right: auto; width: 60% ">{{ post.text }}</div>
 </div>

rodTraa/Templates/postpage.html

@@ -3,11 +3,20 @@
 {% load crispy_forms_tags %}
 {% block body %}
 
-<div style="border-radius: 20px ;margin-top: 80px;width: 60%; margin-left: 20%; margin-bottom: 30px; background-color: white; height: 400px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);">
-<form method="post" action="{% url 'postpage' %}" enctype="multipart/form-data">
+<div style="border-radius: 20px ;margin-top: 80px;width: 60%; margin-left: 20%; margin-bottom: 30px; background-color: white; height: 450px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);">
+<form method="post" action="{% url 'postpage' %}" enctype="multipart/form-data" style="margin-left: 30%; padding-top: 20px">
+<h2 style="margin-left: 10%">Nytt innlegg</h2>
+    <small>Skriv litt om innlegget ditt her</small>
     {% csrf_token %}
-    {{ form }}
-<button type="submit"> Last opp </button>
+    {% for field in form %}
+<div></div>
+
+    {{ field }}
+    {% endfor %}
+<div></div>
+        <button type="submit" class="btn btn-outline-info" style="margin-left: 16%; margin-top: 20px"> Publiser innlegg </button>
 </form>
+
+
 </div>
 {% endblock %}
\ No newline at end of file

rodTraa/Templates/startpage.html

 {% extends 'base.html' %}
 {% load static %}
 {% block body %}
+
     {% for post in posts %}
-<div style="border-radius: 20px ;margin-top: 100px;width: 60%; margin-left: 20%; background-color: white; height: 420px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);">
+
+<div style="border-radius: 20px ;margin-top: 100px;width: 60%; margin-left: 20%; background-color: white; height: 550px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);">
     <div style="display: block; margin-left: auto; margin-right: auto; padding-top: 50px; width:60%">
-        <img style="width:100%"; src="{{ post.image.url }}">
+        {{ post.post_owner }}
+        <img style="max-width:100%; max-height: 400px"; src="{{ post.image.url }}">
     </div>
 <div style="display: block; margin-left: auto; margin-right: auto; width: 60% ">{{ post.text }}</div>
 </div>