Edited CSS files for formatting

widget_group_25/widget_group_25/static/announcementboard/css/create_styles.css

+h1 {
+    color: #33415c;
+    border-bottom: solid;
+    font-family: 'Tahoma';
+    font-size: 40pt;
+}
+
+h4 a{
+    background-color: #dae8ea;
+    padding: 15px;
+    text-decoration: none;
+    border-style: solid;
+}
+
+body {
+    background-color: #fefefe;
+    font-family: 'Trebuchet MS';
+    font-size: 12pt;
+    padding: 20pt;
+}
+
+p{
+    padding-left: 15pt;
+    color: #8e574c;
+}
+
+a:link {
+    color: #33415c;
+    text-decoration: none;
+}
+
+a:visited {
+    color: #5c677d
+}
\ No newline at end of file

widget_group_25/widget_group_25/static/announcementboard/css/detail_styles.css

 h1 {
-    color:	#393d3f;
+    color: #fefefe;
+    background-color: #6c7a84;
     font-family: 'Tahoma';
     font-size: 35pt;
-    line-height: 10px;
+    line-height: 70pt;
+    padding-left: 10pt;
 }
 
-h2 {
-    color:	#546a7b;
-    font-family: 'Tahoma';
-    font-size: 20pt;
+h2{
+    color: #4f5b63;
+    font-size: 25pt;
+    line-height: 0pt;
+    padding-left: 10pt;
 }
 
 h3 {
-    color: #546a7b;
-    font-family: 'Trebuchet MS';
-    font-size: 16pt;
+    color: #8e574c;
     font-style: italic;
+    font-family: 'Trebuchet MS';
+    font-size: 18pt;
+    line-height: 0pt;
+    padding-left: 15pt;
+}
+
+h4 a{
+    background-color: #d4d9da;
+    padding: 15px;
+    text-decoration: none;
+    border-style: solid;
 }
 
 body {
-    color: #393d3f;
+    background-color: #fefefe;
     font-family: 'Trebuchet MS';
     font-size: 12pt;
-    line-height: 15px;
 }
 
-img {
-    height: 2cm;
+p{
+    padding-left: 20pt;
+    color: rgb(51, 53, 53);
+}
+
+a:link {
+    color: #33415c;
+    text-decoration: none;
+}
+
+a:visited {
+    color: #5c677d
+}
+
+img{
+    height: 80px;
+    float: left;
+    padding-left: 10pt;
+    padding-right: 10pt;
+    padding-top: 5pt;
 }
\ No newline at end of file

widget_group_25/widget_group_25/static/announcementboard/css/list_styles.css

 h1 {
-    color:	#22223b;
+    color: #454545;
+    background-color: #93b7be;
     font-family: 'Tahoma';
-    font-size: 38pt;
+    font-size: 45pt;
+    line-height: 80pt;
+    text-align: center;
 }
 
 h3 {
     color: #4a4e69;
     font-family: 'Trebuchet MS';
-    font-size: 18pt;
+    font-size: 25pt;
+    line-height: 10pt;
+}
+
+h4 a{
+    background-color: #dae8ea;
+    padding: 15px;
+    text-decoration: none;
+    border-style: solid;
 }
 
 body {
-    color: #4a4e69;
+    background-color: #fefefe;
     font-family: 'Trebuchet MS';
     font-size: 12pt;
 }
 
-a:visited {
+ul{
+    margin-left: 15px;
+    line-height: 30px;
+}
+
+a:link {
+    color: #33415c;
+    text-decoration: none;
+}
+
+a:hover {
     color: #723d46;
+}
+
+a:visited {
+    color: #5c677d
 }
\ No newline at end of file

widget_group_25/widget_group_25/templates/announcementboard/announcement_detail.html

@@ -21,12 +21,14 @@
 <h2>
     by {{ announcement.author.first_name }} {{ announcement.author.last_name }}, {{ announcement.pub_date|date:'d/m/Y' }}
 </h2>
-{{ announcement.announcement_body }}
+<p>{{ announcement.announcement_body }}</p>
 
-<h3>Reactions:</h3>
+<br><h3>Reactions</h3>
+<p>
 Like: {{ count_like }}<br>
 Love: {{ count_love }}<br>
 Angry: {{ count_angry }}
+</p>
 <br><br><br>
-<a href="{% url 'announcementboard:announcement-list' %}">Back to Announcement Board</a>
+<h4><a href="{% url 'announcementboard:announcement-list' %}">Back to Announcement Board</a></h4>
 {% endblock %}
\ No newline at end of file

widget_group_25/widget_group_25/templates/announcementboard/announcement_form.html

@@ -4,22 +4,23 @@
 {% block title %}Create Announcement{% endblock %}
 
 {% block styles %}
-<link rel="stylesheet" href="{% static 'announcementboard/css/detail_styles.css' %}">
+<link rel="stylesheet" href="{% static 'announcementboard/css/create_styles.css' %}">
 {% endblock %}
 
 
 {% block content %}
 <h1>New Announcement</h1>
+<p>
 <form method="POST">
     {% csrf_token %}
     <label for="{{ form.announcement_title.id_for_label }}">Announcement Title</label><br>
-        {{ form.announcement_title }}<br><br><br>
+        {{ form.announcement_title }}<br><br>
     <label for="{{ form.announcement_body.id_for_label }}">Announcement Body</label><br>
-        {{ form.announcement_body }}<br><br><br>
+        {{ form.announcement_body }}<br><br>
     <label for="{{ form.authot.id_for_label }}">Author</label><br>
         {{ form.author }}<br><br>
     <input type="submit" value="Save Announcement">
 </form>
-
-<a href="{% url 'announcementboard:announcement-list' %}">Back to Announcement Board</a>
+</p>
+<br><h4><a href="{% url 'announcementboard:announcement-list' %}">Back to Announcement Board</a></h4>
 {% endblock %}

widget_group_25/widget_group_25/templates/announcementboard/announcement_list.html

@@ -11,13 +11,15 @@
 {% block content %}
 <h1>Announcement Board</h1>
 <h3>Important announcements:</h3>
-{% for object in object_list %}
-    <li>
-        <a href="{% url 'announcementboard:announcement-detail' pk=object.pk %}">
-            {{ object.announcement_title }} by {{ object.author.first_name }} {{ object.author.last_name }} dated {{ object.pub_date|date:"d/m/Y" }}
-        </a>
-    </li>
-{% endfor %}
-<br><br><br>
-<a href="{% url 'announcementboard:announcement-create' %}">Add New Announcement</a>
+<ul>
+    {% for object in object_list %}
+        <li>
+            <a href="{% url 'announcementboard:announcement-detail' pk=object.pk %}">
+                {{ object.announcement_title }} by {{ object.author.first_name }} {{ object.author.last_name }} dated {{ object.pub_date|date:"d/m/Y" }}
+            </a>
+        </li>
+    {% endfor %}
+</ul>
+<br>
+<h4><a href="{% url 'announcementboard:announcement-create' %}">Add New Announcement</a></h4>
 {% endblock %}

widget_group_25/widget_group_25/templates/base.html

 <html lang="en">
 <head>
-    <link rel="stylesheet" href="styles.css">
     <title>{% block title %}{% endblock %}</title>
     {% block styles %}{% endblock %}
 </head>