From 73cc9fc0e575281303b694bf382aff3df02aff3d Mon Sep 17 00:00:00 2001
From: Fabien Pinckaers <fp@tinyerp.com>
Date: Tue, 24 Sep 2013 21:38:19 +0200
Subject: [PATCH] [IMP] Blogs + Small CSS on empty blocks

bzr revid: fp@tinyerp.com-20130924193819-hhil6lvkhm9krwg8
---
 addons/website/static/src/css/website.css     |  6 ++-
 addons/website/static/src/css/website.sass    |  5 +-
 addons/website_blog/static/src/css/Makefile   |  2 +-
 .../static/src/css/website_blog.css           | 14 ++++++
 .../static/src/css/website_blog.sass          | 12 +++++
 .../views/website_blog_templates.xml          | 47 +++++++++----------
 6 files changed, 57 insertions(+), 29 deletions(-)

diff --git a/addons/website/static/src/css/website.css b/addons/website/static/src/css/website.css
index 5249450386f..ef7fcca1e7a 100644
--- a/addons/website/static/src/css/website.css
+++ b/addons/website/static/src/css/website.css
@@ -229,7 +229,7 @@ footer {
 }
 
 .oe_structure.oe_empty:empty:before, [data-oe-type=html]:empty:before, .oe_structure.oe_empty > .oe_drop_zone.oe_insert:only-child:before, [data-oe-type=html] > .oe_drop_zone.oe_insert:only-child:before {
-  content: "Drag Building Blocks Here";
+  content: "Click Edit To Change Page";
   text-align: center;
   display: block;
   padding-top: 100px;
@@ -238,6 +238,10 @@ footer {
   font-size: 24px;
 }
 
+.oe_structure.oe_editable.oe_empty:empty:before, .oe_editable[data-oe-type=html]:empty:before, .oe_structure.oe_editable.oe_empty > .oe_drop_zone.oe_insert:only-child:before, [data-oe-type=html] > .oe_drop_zone.oe_insert:only-child:before {
+  content: "Drag Building Blocks Here";
+}
+
 /* ---- HACK FOR COVERING UP CK EDITOR BOGUS P INSERTION --- */
 .navbar .nav > li > p {
   margin-bottom: 0px;
diff --git a/addons/website/static/src/css/website.sass b/addons/website/static/src/css/website.sass
index 94ac792ea65..e53deb93e59 100644
--- a/addons/website/static/src/css/website.sass
+++ b/addons/website/static/src/css/website.sass
@@ -155,7 +155,7 @@ footer
     position: static
 
 .oe_structure.oe_empty:empty:before, [data-oe-type=html]:empty:before, .oe_structure.oe_empty > .oe_drop_zone.oe_insert:only-child:before, [data-oe-type=html] > .oe_drop_zone.oe_insert:only-child:before
-    content: 'Drag Building Blocks Here'
+    content: 'Click Edit To Change Page'
     text-align: center
     display: block
     padding-top: 100px
@@ -163,6 +163,9 @@ footer
     color: grey
     font-size: 24px
 
+.oe_structure.oe_editable.oe_empty:empty:before, .oe_editable[data-oe-type=html]:empty:before, .oe_structure.oe_editable.oe_empty > .oe_drop_zone.oe_insert:only-child:before, [data-oe-type=html] > .oe_drop_zone.oe_insert:only-child:before
+    content: 'Drag Building Blocks Here'
+
 /* ---- HACK FOR COVERING UP CK EDITOR BOGUS P INSERTION --- */
 
 .navbar .nav > li > p
diff --git a/addons/website_blog/static/src/css/Makefile b/addons/website_blog/static/src/css/Makefile
index f71f4dd7be8..e33e5130918 100644
--- a/addons/website_blog/static/src/css/Makefile
+++ b/addons/website_blog/static/src/css/Makefile
@@ -1,2 +1,2 @@
 sass:
-	sass --compass --trace -t expanded website_blog.sass website_blog.css
+	sass --trace -t expanded website_blog.sass:website_blog.css
diff --git a/addons/website_blog/static/src/css/website_blog.css b/addons/website_blog/static/src/css/website_blog.css
index 5850483761f..642c3244c75 100644
--- a/addons/website_blog/static/src/css/website_blog.css
+++ b/addons/website_blog/static/src/css/website_blog.css
@@ -1,3 +1,4 @@
+@import url(compass/css3.css);
 .css_website_mail .has-error {
   border-color: red;
 }
@@ -7,3 +8,16 @@
 .css_website_mail .css_nav_month:first-of-type {
   display: block;
 }
+
+.blog_content a.oe_mail_expand:before {
+  content: "→ ";
+}
+.blog_content a.oe_mail_expand {
+  font-weight: bold;
+  display: block;
+}
+
+p.post-meta {
+  position: relative;
+  top: -5px;
+}
diff --git a/addons/website_blog/static/src/css/website_blog.sass b/addons/website_blog/static/src/css/website_blog.sass
index 8a7c5f30a5e..5b358dc60d0 100644
--- a/addons/website_blog/static/src/css/website_blog.sass
+++ b/addons/website_blog/static/src/css/website_blog.sass
@@ -7,3 +7,15 @@
     display: none
     &:first-of-type
       display: block
+
+.blog_content
+  a.oe_mail_expand:before
+    content: "→ "
+  a.oe_mail_expand
+    font-weight: bold
+    display: block
+
+p.post-meta
+  position: relative
+  top: -5px
+
diff --git a/addons/website_blog/views/website_blog_templates.xml b/addons/website_blog/views/website_blog_templates.xml
index 59d39252f77..c588bfcc921 100644
--- a/addons/website_blog/views/website_blog_templates.xml
+++ b/addons/website_blog/views/website_blog_templates.xml
@@ -14,27 +14,27 @@
 
     <!-- Blog Post Summary -->
     <template id="view_blog_post_short" name="Blog Post Short">
-        <div class="media-body">
-            <t t-call="website_mail.follow"><t t-set="object" t-value="blog_post"/></t>
-            <t t-call="website.publish"><t t-set="object" t-value="blog_post"/></t>
-            <small class="text-muted">
-                <t t-field="blog_post.create_uid"/> on <t t-field="blog_post.create_date"/>
-            </small>
-            <h4 class="media-heading" ><a t-attf-href="/blog/#{blog_post.category_id.id}/#{blog_post.id}#comment" t-field="blog_post.name"></a></h4>
-            <div class="media">
-                <div t-field="blog_post.shortened_content"/>
-                <small class="pull-left muted text-right">
-                    <a t-if="len(blog_post.message_ids) &lt;= 1" t-attf-href="/blog/#{blog_post.category_id.id}/#{blog_post.id}#comments"><t t-esc="len(blog_post.message_ids)"/> Comment</a>
-                    <a t-if="len(blog_post.message_ids) > 1" t-attf-href="/blog/#{blog_post.category_id.id}/#{blog_post.id}#comments"><t t-esc="len(blog_post.message_ids)"/> Comments</a>
-                </small>
-            </div>
+        <div>
+            <h2 class="text-center">
+                <a t-attf-href="/blog/#{blog_post.category_id.id}/#{blog_post.id}#comment" t-field="blog_post.name"></a>
+            </h2>
+            <p class="post-meta text-muted text-center">
+                <span class="icon-calendar"> <t t-field="blog_post.create_date"/></span> &amp;nbsp;
+                <span class="icon-user"> By <t t-field="blog_post.create_uid"/></span> &amp;nbsp;
+                <span t-if="len(blog_post.message_ids) &gt; 0" class="icon-comment"> With 
+                    <a t-if="len(blog_post.message_ids) &lt;= 1" t-attf-href="/blog/#{blog_post.category_id.id}/#{blog_post.id}#comments"><t t-esc="len(blog_post.message_ids)"/> comment</a>
+                    <a t-if="len(blog_post.message_ids) > 1" t-attf-href="/blog/#{blog_post.category_id.id}/#{blog_post.id}#comments"><t t-esc="len(blog_post.message_ids)"/> comments</a>
+                </span>
+            </p>
+            <div t-field="blog_post.shortened_content" class="blog_content"/>
+            <hr/>
+
         </div>
     </template>
 
     <!-- Blog Post Complete -->
     <template id="view_blog_post" name="Blog Post">
-        <div class="media">
-            <div class="media-body">
+            <div>
                 <t t-call="website_mail.follow"><t t-set="object" t-value="blog_post"/></t>
                 <t t-call="website.publish"><t t-set="object" t-value="blog_post"/></t>
                 <small class="text-muted">
@@ -42,7 +42,7 @@
                 </small>
                 <h3 t-field="blog_post.name"/>
                 <t t-foreach="blog_post.tag_ids" t-as="tag">
-                    <a class="btn btn-sm btn-info" href="/blog/tag/#{tag.id}"><t t-esc="tag.name"/></a>
+                    <a class="label label-default" href="/blog/tag/#{tag.id}"><t t-esc="tag.name"/></a>
                 </t>
                 <div t-field="blog_post.content"/>
             </div>
@@ -77,7 +77,6 @@
                     </div>
                 </li>
             </ul>
-        </div>
     </template>
 
     <!-- Page --> 
@@ -113,14 +112,10 @@
                     </div>
 
                     <div class="col-md-9" t-if="not blog_post and blog_posts">
-                        <ul class="media-list">
-                            <li t-foreach="blog_posts" t-as="blog_post" data-publish="">
-                                <t t-call="website_blog.view_blog_post_short"/>
-                            </li>
-                        </ul>
-                        <div class="text-center">
-                            <t t-call="website.pager"/>
-                        </div>
+                        <t t-foreach="blog_posts" t-as="blog_post" data-publish="">
+                            <t t-call="website_blog.view_blog_post_short"/>
+                        </t>
+                        <div class="text-center" t-call="website.pager"/>
                     </div>
                 </div>
             </div>