Posts with new style
[blog.git] / haunt.scm
index 04bada4..70247b9 100644 (file)
--- a/haunt.scm
+++ b/haunt.scm
@@ -2,6 +2,8 @@
              (haunt builder blog)
              (haunt builder atom)
              (haunt builder assets)
+            (haunt html)
+            (haunt page)
              (haunt reader)
              (haunt reader texinfo)
              (haunt site)
   `(link (@ (rel "stylesheet")
             (href ,(string-append "css/" name ".css")))))
 
+(define (static-page title file-name body)
+  (lambda (site posts)
+    (make-page file-name
+              (with-layout flex-theme site title body)
+              sxml->html)))
+
+(define (get-tags post)
+  (or (assoc-ref (post-metadata post) 'tags) '()))
+
+(define (post-date-and-tags date tags)
+  (let ((div `(div (@ (class "date-and-tags"))
+                  (time (@ (datetime ,(date->string date "~Y-~m-~dT~H:~M:~S")))
+                        ,(date->string date "~Y-~m-~d")))))
+    (cond ((> (length tags) 0)
+          (append div
+                  `(" "
+                    (span (@ (style "margin: 0 3px")) ÔŽ┐)
+                    (span (@ (class "tags"))
+                          ,@(map (lambda (tag)
+                                   `((a (@ (href ,(format #f "tags/~a.html" tag))) ,tag) " "))
+                                 tags)))))
+         (else
+          div))))
+
 (define flex-theme
   (theme #:name "Flex"
          #:layout
               (head
                (meta (@ (charset "utf-8")))
                (title ,(string-append title " - " (site-title site)))
-               (link (@ (rel "stylesheet") (href "//fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700,400italic")))
-               ,(stylesheet "style.min")
-               ,(stylesheet "monokai.min")
-               ,(stylesheet "font-awesome.min")
-               ,(stylesheet "custom")
+               (link (@ (rel "stylesheet") (href "https://fonts.googleapis.com/css?family=Merriweather+Sans:400,300,300italic,400italic,700,700italic,800,800italic|Merriweather:400,300,300italic,400italic,700,700italic,900,900italic|Source+Code+Pro:200,300,400,500,600,700,900")))
+               ,(stylesheet "application.min")
+               ,(stylesheet "pygments.min")
                (meta (@ (name "viewport") (content "width=device-width, initial-scale=1.0"))))
               (body
                ,(let ((metadata (site-default-metadata site)))
-                  `(aside
-                    (div
-                     (a (@ (href "index.html")) (img (@ (src ,(assoc-ref metadata 'picture)))))
-                     (h1 (a (@ (href "index.html")) ,(assoc-ref metadata 'author)))
-                     (p ,(assoc-ref metadata 'description))
-                     (nav
-                      (ul (@ (class "list"))
-                          ,@(map (lambda (page)
-                                   `(li (a (@ (href ,(cdr page))) ,(car page))))
-                                 (assoc-ref metadata 'pages))))
-                     (ul (@ (class "social"))
-                         (li (a (@ (class "sc-linkedin") (target "_blank") (href "")) (i (@ (class "fa fa-linkedin")))))
-                         " "
-                         (li (a (@ (class "sc-github") (target "_blank") (href "")) (i (@ (class "fa fa-github")))))
-                         " "
-                         (li (a (@ (class "sc-twitter") (target "_blank") (href "")) (i (@ (class "fa fa-twitter")))))
-                         " "
-                         (li (a (@ (class "sc-rss") (target "_blank") (href "feed.xml")) (i (@ (class "fa fa-rss")))))))))
-               (main ,body)))))
+                  `(div (@ (id "page-content"))
+                       (header
+                        (nav (@ (role "navigation") (class "navigation-bar"))
+                             (ul (@ (class "navigation-items left"))
+                                 (li (@ (id "blog-title-header"))
+                                     (a (@ (href "index.html"))
+                                        (h1 ,(assoc-ref metadata 'author)))))
+                             (ul (@ (class "navigation-items center")))
+                             (ul (@ (class "navigation-items right"))
+                                 ,@(map (lambda (page)
+                                          `(li (a (@ (href ,(cdr page))) ,(car page))))
+                                        (assoc-ref metadata 'pages)))))
+                       (section (@ (role "main"))
+                                (div (@ (class "content") (class "col-md-12")) ,body))))))))
 
         #:post-template
         (lambda (post)
-          (define (get-tags post)
-            (or (assoc-ref (post-metadata post) 'tags) '()))
-
-          `((article (@ (class "single"))
+          `((article (@ (class "inline"))
                      (header
-                      (h1 ,(post-ref post 'title))
-                      (p "Posted on " ,(date->string (post-date post) "~B ~d, ~Y")))
-                     ,(post-sxml post)
-                     (div (@ (class "tag-cloud"))
-                          (p
-                           ,@(map (lambda (tag)
-                                    `((a (@ (href "")) ,tag) " "))
-                                  (get-tags post)))))))
+                      (h1 (@ (class "title")) ,(post-ref post 'title))
+                      ,(post-date-and-tags (post-date post) (get-tags post)))
+                     ,(post-sxml post))))
 
          #:collection-template
          (lambda (site title posts prefix)
 
            `(
             ,@(map (lambda (post)
-                     `(article
-                       (header
-                        (h2
-                         (a (@ (href ,(post-uri post)))
-                            ,(post-ref post 'title)))
-                        (p "Posted on " ,(date->string (post-date post) "~B ~d, ~Y")))
-                       (div ,(post-summary post)
-                            (br)
-                            (a (@ (class "btn") (href ,(post-uri post))) " Continue reading "))
-                       (hr)))
+                     `(article (@ (class "inline"))
+                               (header
+                                (h2 (@ (class "title"))
+                                    (a (@ (href ,(post-uri post)))
+                                       ,(post-ref post 'title)))
+                                ,(post-date-and-tags (post-date post) (get-tags post)))
+                               ,(post-summary post)
+                               (footer (@ (class "read-more"))
+                                          (a (@ (href ,(post-uri post))) "...read more..."))))
                    (posts/reverse-chronological posts))))))
 
+(define about-page
+  (static-page
+   "About me"
+   "about.html"
+   `((h2 "hi."))))
+
 (define %collections
   `(("Home" "index.html" ,posts/reverse-chronological)))
 
         (description . "Free Software Evangelist - Programmer")
         (email . "jsf@jsancho.org")
         (picture . "images/jsancho.jpg")
-        (pages . (("about" . "about.html")
-                  ("projects" . "http://git.jsancho.org/"))))
+        (pages . (("projects" . "http://git.jsancho.org/")
+                 ("about me" . "about.html"))))
       #:readers (list sxml-reader html-reader)
       #:builders (list (blog #:theme flex-theme #:collections %collections)
                        (atom-feed)
                        (atom-feeds-by-tag)
+                      about-page
                        (static-directory "images")
                        (static-directory "fonts")
                        (static-directory "css")))