Announcements section update

6 files changed, 42 insertions, 8 deletions

diff --git a/static/css/home.css b/static/css/home.css
index ef9b77d1..48462903 100644
--- a/static/css/home.css
+++ b/static/css/home.css
@@ -15,3 +15,36 @@
     width: 550px;
     margin: 12px 0px 12px 140px;
 }
+
+#announcements {
+    background: url('../images/backgrounds/announcements.png') no-repeat;
+    background-size: 730px 300px;
+    position: relative;
+    margin-top: 15px;
+    width: 730px;
+    height: 300px;
+}
+
+#update-gif {
+    height: 14px;
+    display: block;
+    position: relative;
+    left: 68px;
+    top: 11px;
+}
+
+marquee {
+    border: 15px solid transparent;
+    border-radius: 4px;
+    padding: 15px;
+    border-image: url('../images/backgrounds/announcements_border.png') 50 round;
+    width: 480px;
+    height: 180px;
+    position: relative;
+    left: 70px;
+    top: 23px;
+}
+
+marquee > ul {
+    text-align: justify;
+}
diff --git a/static/images/backgrounds/announcements.png b/static/images/backgrounds/announcements.png
new file mode 100644
index 00000000..065da0de
--- /dev/null
+++ b/static/images/backgrounds/announcements.png
diff --git a/static/images/backgrounds/announcements_border.png b/static/images/backgrounds/announcements_border.png
new file mode 100644
index 00000000..92cc03a6
--- /dev/null
+++ b/static/images/backgrounds/announcements_border.png
diff --git a/static/images/backgrounds/futaba_main.png b/static/images/backgrounds/futaba_main.png
deleted file mode 100644
index 739329d0..00000000
--- a/static/images/backgrounds/futaba_main.png
+++ /dev/null
diff --git a/static/images/backgrounds/futaba_mike.png b/static/images/backgrounds/futaba_mike.png
deleted file mode 100644
index baacebf5..00000000
--- a/static/images/backgrounds/futaba_mike.png
+++ /dev/null
diff --git a/templates/blog/home.html b/templates/blog/home.html
index 571eb2bb..7252736c 100644
--- a/templates/blog/home.html
+++ b/templates/blog/home.html
@@ -13,13 +13,12 @@
     Also, To participate around various sections of the site, you will need to <a href="{% url 'blog:register' %}">register</a> for an account. I hope you enjoy your stay here.
   </p>
 </div>
-<img src="{% static 'images/gifs/construction.gif' %}" style="width: 720px;">
-
-{% if announcements is not None %}
-<div id="announcements" class="mtctitem">
-  <h2><img src = "{% static 'images/gifs/update.gif' %}" style="height: 14px;"></h2>
-  <marquee behavior="scroll" direction="up" height="250" width="720" scrollamount="2" scrolldelay="20" onmouseover="this.stop()" onmouseout="this.start()">
-    <ul style="width: 720px;">
+<img src="{% static 'images/gifs/construction.gif' %}" style="width: 730px;">
+<div id="announcements">
+  <img src = "{% static 'images/gifs/update.gif' %}" style="height: 14px;" id="update-gif">
+  {% if announcements is not None %}
+  <marquee behavior="scroll" direction="up" scrollamount="2" scrolldelay="20" onmouseover="this.stop()" onmouseout="this.start()">
+    <ul>
       {% for announcement in announcements %}
       <li>
         <span>
@@ -37,8 +36,10 @@
       {% endfor %}
     </ul>
   </marquee>
+  {% endif %}
 </div>
-{% endif %}
+
+{% comment %}  {% endcomment %}
 <div id="fake-banner-ad" class="mtctitem">
   {% comment %} <h2>Advertisement</h2> {% endcomment %}
   {% load ad %}