# HG changeset patch
# User souliane <souliane@mailoo.org>
# Date 1431348881 -7200
# Node ID d94feb0d849e5bbd54692bace9825443695e0dc9
# Parent  9aa2e251a993e5d22d201d02f2eeb53463016e72
server_side: give a better look to the static blog

diff -r 9aa2e251a993 -r d94feb0d849e server_css/blog.css
--- a/server_css/blog.css	Wed May 27 19:11:25 2015 +0200
+++ b/server_css/blog.css	Mon May 11 14:54:41 2015 +0200
@@ -16,16 +16,30 @@
 along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
-.mblog_title, .mblog_title a {
-    text-align: center;
-    text-decoration: none;
+html {
+  box-sizing: border-box;
+}
+*, *:before, *:after {
+  box-sizing: inherit;
+}
+
+body {
+    background: url("../media/icons/dokuwiki/tpl/page-gradient.png") repeat-x scroll left top #FBFAF9;
+}
+
+.mblog_title {
     font-size: x-large;
     font-weight: bold;
-    margin-bottom: 40px;
+    margin: 20px;
     font-family: FreeSans, Liberation Sans, Arial, sans-serif;
     color: rgb(51, 51, 51);
 }
 
+.mblog_title a {
+    text-decoration: none;
+    color: rgb(51, 51, 51);
+}
+
 .mblog_entry {
     width: 60%;
     text-align: justify;
@@ -41,6 +55,8 @@
 }
 
 .mblog_comments{
+    background: url("../media/icons/dokuwiki_plugins/include/comment.gif") no-repeat scroll 0px 2px transparent;
+    padding: 0px 0px 0px 18px;
 }
 
 .mblog_comment {
@@ -51,7 +67,7 @@
 
 .mblog_header {
     font-size: small;
-    border-bottom: 1px dashed LightGrey;
+    border-bottom: 1px dotted #ccc;
     color: gray;
     display: table;
     width: 100%;
@@ -66,7 +82,7 @@
 
 .mblog_footer {
     font-size: small;
-    border-top: 1px dashed LightGrey;
+    border-top: 1px dotted #ccc;
     color: gray;
     display: table;
     width: 100%;
@@ -90,7 +106,9 @@
 
 .mblog_timestamp {
     display: table-cell;
-    text-align: right;
+    float: right;
+    background: url("../media/icons/dokuwiki_plugins/include/date.gif") no-repeat scroll 0px 1px transparent;
+    padding: 0px 0px 0px 18px;
 }
 
 .mblog_content {
@@ -108,36 +126,37 @@
     display: block;
 }
 
-.header {
-    width: 60%;
-    margin: auto;
-    margin-bottom: 20px;
+.header, .footer {
+    margin: 20px;
+    height: 20px;
     text-align: center;
+    border-top: 1px solid #CCC;
+    border-bottom: 1px solid #CCC;
 }
 
-.footer {
-    width: 100%;
-    text-align:center;
+.header_content, .footer_content {
+    margin: 0px 20%;
 }
 
 .later_message {
     text-decoration: none;
     float: left;
-}
-
-.later_messages {
-    text-decoration: none;
-    text-align:center;
+    color: #2B73B7;
+    font-size: smaller;
 }
 
 .older_message {
     text-decoration: none;
     float: right;
+    color: #2B73B7;
+    font-size: smaller;
 }
 
-.older_messages {
+.later_messages, .older_messages {
     text-decoration: none;
     text-align:center;
+    color: #2B73B7;
+    font-size: smaller;
 }
 
 .mblog_entry h1, h2, h3, h4, h5, h6 {
@@ -156,4 +175,7 @@
 .mblog_title img {
     max-width: 800px;
     max-height: 150px;
+    vertical-align: middle;
+    margin-right: 10px;
+    border-radius: 5px;
 }
\ No newline at end of file
diff -r 9aa2e251a993 -r d94feb0d849e src/server/blog.py
--- a/src/server/blog.py	Wed May 27 19:11:25 2015 +0200
+++ b/src/server/blog.py	Mon May 11 14:54:41 2015 +0200
@@ -235,12 +235,20 @@
         def getOption(key):
             return sanitizeHtml(options[key]).encode('utf-8') if key in options else ''
 
-        def getImageOption(key, alt):
+        def getImageOption(key, default, alt):
             """regexp from http://answers.oreilly.com/topic/280-how-to-validate-urls-with-regular-expressions/"""
             url = options[key].encode('utf-8') if key in options else ''
             regexp = r"^(https?|ftp)://[a-z0-9-]+(\.[a-z0-9-]+)+(/[\w-]+)*/[\w-]+\.(gif|png|jpg)$"
-            return "<img src='%(url)s' alt='%(alt)s'/>" % {'alt': alt, 'url': url} if re.match(regexp, url) else alt
+            if re.match(regexp, url):
+                url = url
+                suffix = "<br/>"
+            else:
+                url = default
+                suffix = ""
+            return "<img src='%(url)s' alt='%(alt)s'/>%(suffix)s" % {'alt': alt, 'url': url, 'suffix': suffix}
 
+        avatar = os.path.normpath(root_url + getOption('avatar'))
+        title = getOption(C.STATIC_BLOG_PARAM_TITLE) or user
         request.write("""
             <html>
             <head>
@@ -253,15 +261,17 @@
                 <title>%(title)s</title>
             </head>
             <body>
-            <div class="mblog_title"><a href="%(base)s">%(banner_elt)s</a></div>
+            <div class="mblog_title"><a href="%(base)s">%(banner_elt)s%(title_elt)s</a></div>
             """ % {'base': base_url,
                    'root': root_url,
                    'user': user,
                    'keywords': getOption(C.STATIC_BLOG_PARAM_KEYWORDS),
                    'description': getOption(C.STATIC_BLOG_PARAM_DESCRIPTION),
                    'title': getOption(C.STATIC_BLOG_PARAM_TITLE) or "%s's microblog" % user,
-                   'favicon': os.path.normpath(root_url + getOption('avatar')),
-                   'banner_elt': getImageOption(C.STATIC_BLOG_PARAM_BANNER, getOption(C.STATIC_BLOG_PARAM_TITLE) or user)})
+                   'favicon': avatar,
+                   'banner_elt': getImageOption(C.STATIC_BLOG_PARAM_BANNER, avatar, title),
+                   'title_elt': title,
+                   })
         mblog_data, main_rsm = mblog_data
         display_single = len(mblog_data) == 1
 
@@ -273,10 +283,10 @@
                 before_link = ("%(base)s?before=%(item_id)s" % {'base': base_url, 'item_id': main_rsm['first']}).encode('utf-8')
                 if display_single:
                     before_link += '&max=1'
-                    tmp_text = D_("Later message")
+                    tmp_text = D_("later message")
                     class_ = 'later_message'
                 else:
-                    tmp_text = D_("Later messages")
+                    tmp_text = D_("later messages")
                     class_ = 'later_messages'
                 before_tag = """<a href="%(link)s" class="%(class)s">%(text)s</a>""" % {'link': before_link, 'class': class_, 'text': tmp_text}
             else:
@@ -285,10 +295,10 @@
                 after_link = ("%(base)s?after=%(item_id)s" % {'base': base_url, 'item_id': main_rsm['last']}).encode('utf-8')
                 if display_single:
                     after_link += '&max=1'
-                    text = D_("Older message")
+                    text = D_("older message")
                     class_ = 'older_message'
                 else:
-                    text = D_("Older messages")
+                    text = D_("older messages")
                     class_ = 'older_messages'
                 after_tag = """<a href="%(link)s" class="%(class)s">%(text)s</a>""" % {'link': after_link, 'class': class_, 'text': text}
             else:
@@ -296,12 +306,12 @@
 
         # display navigation header
         request.write("""<div class="header">""")
+        request.write("""<div class="header_content">""")
         if before_tag:
             request.write(before_tag)
-        request.write("&nbsp;")
         if display_single and after_tag:
             request.write(after_tag)
-        request.write("""</div>""")
+        request.write("""</div></div>""")
 
         mblog_data = [(entry if isinstance(entry, tuple) else (entry, ([], {}))) for entry in mblog_data]
         mblog_data = sorted(mblog_data, key=lambda entry: (-float(entry[0].get('updated', 0))))
@@ -326,9 +336,10 @@
 
         # display navigation footer
         request.write("""<div class="footer">""")
+        request.write("""<div class="footer_content">""")
         if not display_single and after_tag:
             request.write(after_tag)
-        request.write("""</div>""")
+        request.write("""</div></div>""")
 
         request.write('</body></html>')
         request.finish()