small html/styling improvements

1 files changed, 40 insertions, 19 deletions

diff --git a/bin/serve.fnl b/bin/serve.fnl
index 988df00..728279f 100644
--- a/bin/serve.fnl
+++ b/bin/serve.fnl
@@ -250,7 +250,8 @@
 (fn item-template [product]
   [:div {:class "tile"}
    [:a {:href product.url :style "display: block;" :rel "nofollow"}
-    [:img {:src product.image :title product.title :alt product.title} ""]]
+    [:img {:class "img" :src product.image :title product.title
+           :alt product.title} ""]]
    (site-name-template product.site)
    [:a {:href product.url :style "text-decoration: none;" :rel "nofollow"}
     [:NO-ESCAPE (.. "<h2>" (unescape product.title) "</h2>")]]
@@ -289,7 +290,36 @@
      [:div {} "Всего: " [:strong {} (string.format "%d" total)]]]
     ""))
 
-(fn aside-template [form paginator]
+(fn menu-template [path extra-class]
+  [:nav {:class (.. "menu" (if (str.empty? extra-class)
+                             ""
+                             (.. " " extra-class)))}
+   [:a {:href "/red-tea"
+        :class (if (= path "/red-tea") "active" "")}
+       "Красный чай"]
+   [:a {:href "/sheng-puer"
+        :class (if (= path "/sheng-puer") "active" "")}
+       "Шен пуэр"]
+   [:a {:href "/shou-puer"
+        :class (if (= path "/shou-puer") "active" "")}
+       "Шу пуэр"]
+   [:a {:href "/oolong"
+        :class (if (= path "/oolong") "active" "")}
+       "Улун"]
+   [:a {:href "/green-tea"
+        :class (if (= path "/green-tea") "active" "")}
+       "Зеленый чай"]
+   [:a {:href "/white-tea"
+        :class (if (= path "/white-tea") "active" "")}
+       "Белый чай"]
+   [:a {:href "/yellow-tea"
+        :class (if (= path "/yellow-tea") "active" "")}
+       "Желтый чай"]
+   [:a {:href "/teaware"
+        :class (if (= path "/teaware") "active" "")}
+       "Посуда"]])
+
+(fn aside-template [form path paginator]
   [:aside {:class "aside"}
    [:div {:class "aside-content"}
     (if (not (form-empty? form))
@@ -298,6 +328,7 @@
               :alt "Логотип meicha.ru" :title "Логотип meicha.ru"}]]
        [:img {:class "logo" :src "/static/logo.svg"
               :alt "Логотип meicha.ru" :title "Логотип meicha.ru"}])
+    (menu-template path "menu-mobile")
     [:form {:class "form"}
      [:input {:type :search :name "query" :value form.query
               :autofocus true :placeholder "Поисковый запрос"}]
@@ -324,18 +355,7 @@
      [:button {:type :submit} "Искать"]]
     paginator]])
 
-(fn menu-template []
-  [:nav {:class "menu"}
-   [:a {:href "/red-tea"} "Красный чай"]
-   [:a {:href "/sheng-puer"} "Шен пуэр"]
-   [:a {:href "/shou-puer"} "Шу пуэр"]
-   [:a {:href "/oolong"} "Улун"]
-   [:a {:href "/green-tea"} "Зеленый чай"]
-   [:a {:href "/white-tea"} "Белый чай"]
-   [:a {:href "/yellow-tea"} "Желтый чай"]
-   [:a {:href "/teaware"} "Посуда"]])
-
-(fn base-template [form page total items]
+(fn base-template [form path page total items]
   (local paginator (paginator-template form page 48 total))
   (local menu-path
    (if (and form.tags (< 0 (# form.tags)))
@@ -361,14 +381,15 @@
    [:body {}
     [:div {:class "container"}
      [:div {:class "content"}
-      (aside-template form paginator)
+      (aside-template form path paginator)
       [:section {}
-       (menu-template)
+       (menu-template path)
        (if (. form.tags 1)
         [:h1 {} (. form.tags 1)]
         "")
        (if (and menu-path (. texts (.. menu-path "-description")))
-         [:NO-ESCAPE (. texts (.. menu-path "-description"))]
+         [:div {:class "description"}
+          [:NO-ESCAPE (. texts (.. menu-path "-description"))]]
          "")
        (if (< 0 (# items))
         [:div {:class "list"}
@@ -378,7 +399,7 @@
             (string.format texts.no-results-with-suggestion
                            spellfix-suggestion
                            spellfix-suggestion)]
-          texts.no-results))
+          [:NO-ESCAPE texts.no-results]))
        [:footer {} paginator]]]]]])
 
 (fn root-handler [{: path : query}]
@@ -400,7 +421,7 @@
            (cache.set db cache-key
             (.. "<!DOCTYPE html>\n"
                 (html.render
-                 (base-template form page total results)
+                 (base-template form path page total results)
                  true))))))
 
       (match (str.split path "/")