some changes to posts view, remove heading from fake ads, fix aspect ratios of images on older browsers

7 files changed, 22 insertions, 17 deletions

diff --git a/blog/views.py b/blog/views.py
index 98c72788..1bf853ae 100644
--- a/blog/views.py
+++ b/blog/views.py
@@ -102,6 +102,12 @@ def post(request, slug):
         for code_block in code_blocks:
             code_block.replace_with(BeautifulSoup(highlight_code_blocks(code_block), 'html.parser'))
 
+        # float: right every other image
+        images = soup.find_all('img')
+        for i in range(len(images)):
+            if i % 2 != 0:
+                images[i]['style'] = 'float: right; padding: 0px 0px 0px 13px;'
+
         post.body = str(soup)
 
 
diff --git a/static/css/main.css b/static/css/main.css
index 8d3e3808..8c47ab05 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -328,9 +328,8 @@ kbd {
 
 #article-body img, #editor-container img {
     height: 250px;
-    width: auto;
     float: left;
-    padding: 0px 20px 20px 0px;
+    padding: 0px 13px 0px 0px;
 }
 
 #article-body h2, #article-body h1, #editor-container h2, #editor-container h1 {
diff --git a/templates/blog/articles.html b/templates/blog/articles.html
index d228925a..309ef566 100644
--- a/templates/blog/articles.html
+++ b/templates/blog/articles.html
@@ -40,7 +40,7 @@
       <div class="post" style="clear: both;">
         <div style="text-align: justify; font-size: 13px; margin-bottom: 0px;">
           <span>
-            <img src="{% url 'ignis:post_image' '320' post.id %}.gif" alt="Cover image for {{ post.title }}" style="float: left; margin-right: 11px; width: 320px; height: auto;">
+            <img src="{% url 'ignis:post_image' '320' post.id %}.gif" alt="Cover image for {{ post.title }}" style="float: left; margin-right: 11px; width: 320px;">
           </span>
             <h1 style="margin-top: 0px; margin-bottom: 0px;">
                 <a href="{% url 'blog:post' post.slug %}">{{ post.title }}</a>
diff --git a/templates/blog/home.html b/templates/blog/home.html
index 8ec1ff5f..95e08043 100644
--- a/templates/blog/home.html
+++ b/templates/blog/home.html
@@ -12,18 +12,14 @@
   <p>
     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>
-  <img src="{% static 'images/gifs/construction.gif' %}" style="height:auto; width: 100%;">
+  <img src="{% static 'images/gifs/construction.gif' %}" style="width: 720px;">
 </div>
 
-<div id="fake-banner-ad" class="mtctitem">
-  <h2>Advertisement</h2>
-  {% load ad %}
-  <img src="{{'banner'|ad }}" alt="Ad" style="width: 100%; height: auto;" border="0"/>
-</div>
+
 
 {% if announcements is not None %}
 <div id="announcements" class="mtctitem">
-  <h2><img src = "{% static 'images/gifs/update.gif' %}" style="height: 14px; width: auto;"></h2>
+  <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;">
       {% for announcement in announcements %}
@@ -45,7 +41,11 @@
   </marquee>
 </div>
 {% endif %}
-
+<div id="fake-banner-ad" class="mtctitem">
+  {% comment %} <h2>Advertisement</h2> {% endcomment %}
+  {% load ad %}
+  <img src="{{'banner'|ad }}" alt="Ad" style="width: 720px;" border="0"/>
+</div>
 {% if recent_posts %}
 <div id="recent-posts" class="mtctitem">
   <h2>Recent Posts</h2>
@@ -61,7 +61,7 @@
       </p>
       <div style="text-align: justify; font-size: 13px; margin-bottom: 0px;">
         <span>
-          <img src="{% url 'ignis:post_image' '320' post.id %}.gif" alt="Cover image for {{ post.title }}" style="float: left; margin-right: 11px; width: 320px; height: auto;">
+          <img src="{% url 'ignis:post_image' '320' post.id %}.gif" alt="Cover image for {{ post.title }}" style="float: left; margin-right: 11px; width: 320px;">
         </span>
           {{ post.excerpt | safe }}
       </div>
diff --git a/templates/blog/partials/sidebar.html b/templates/blog/partials/sidebar.html
index a03424e2..948b3aff 100644
--- a/templates/blog/partials/sidebar.html
+++ b/templates/blog/partials/sidebar.html
@@ -157,9 +157,9 @@
 </div>
 
 <div id="fake-ad-area" class="mtsbitem">
-    <h2>Advertisement</h2>
+    {% comment %} <h2>Advertisement</h2> {% endcomment %}
     {% load ad %}
-        <img src="{{ "big" | ad }}" alt="Advertisement" style="width: 100%; height: auto;">
+        <img src="{{ "big" | ad }}" alt="Advertisement" style="width: 250px;">
 </div>
 
 <div id="archives-area" class="mtsbitem">
diff --git a/templates/blog/post.html b/templates/blog/post.html
index ee722a0c..3569d76d 100644
--- a/templates/blog/post.html
+++ b/templates/blog/post.html
@@ -17,13 +17,13 @@
 
 
 <div id="comments" style="clear: both;" class="mtsbitem">
-    <h2>Comments</h2>
     {% for comment in comments %}
+        <h2>Comments</h2>
         <div id="comment-{{ comment.id }}">
             <table>
                 <tr>
                     <td style="width: 60px; vertical-align: top;">
-                        <img src="{% static 'images/avatars/' %}{{ comment.avatar_url }}.png" alt="Profile Picture" style="width: 50px; height: auto;">
+                        <img src="{% static 'images/avatars/' %}{{ comment.avatar_url }}.png" alt="Profile Picture" style="width: 50px;">
                     </td>
                     <td style="vertical-align: top; width: 668px;">
                         <div style="margin-bottom: 13px; border-bottom: dashed 1px white; padding-bottom: 13px;">
diff --git a/templates/blog_admin/posts.html b/templates/blog_admin/posts.html
index 20a48664..30cfdb93 100644
--- a/templates/blog_admin/posts.html
+++ b/templates/blog_admin/posts.html
@@ -37,7 +37,7 @@
               {% endif %}
             </td>
             <td>
-              <img src="{% url 'ignis:post_image' '80' post.id %}.gif" alt="Cover Image" style="max-width: 80px; height: auto; display: block;">
+              <img src="{% url 'ignis:post_image' '80' post.id %}.gif" alt="Cover Image" style="width: 80px; display: block;">
             </td>
             <td>
               <a href="{% url 'blog:post' post.slug %}">