[no subject]

[Ricardo Wurmus]

branch: master
commit 6aef31bd93baa6b2bcb0877d52efc39fe351e0ec
Author: Ricardo Wurmus <address@hidden>
AuthorDate: Wed Apr 15 19:52:31 2020 +0200

    templates: Display search hints.
    
    * src/static/css/cuirass.css: New file.
    * Makefile.am (dist_css_DATA): Add it.
    * src/cuirass/http.scm (%file-white-list): Add css/cuirass.css.
    * src/cuirass/templates.scm (search-form): Add search-hints div.
    (html-page): Load cuirass.css.
---
 Makefile.am                |  1 +
 src/cuirass/http.scm       |  3 ++-
 src/cuirass/templates.scm  | 30 +++++++++++++++++++++++++++---
 src/static/css/cuirass.css | 17 +++++++++++++++++
 4 files changed, 47 insertions(+), 4 deletions(-)

diff --git a/Makefile.am b/Makefile.am
index bc0e90c..65c9a29 100644
--- a/Makefile.am
+++ b/Makefile.am
@@ -74,6 +74,7 @@ dist_sql_DATA =                               \
   src/sql/upgrade-6.sql
 
 dist_css_DATA =                                        \
+  src/static/css/cuirass.css                   \
   src/static/css/bootstrap.css                 \
   src/static/css/open-iconic-bootstrap.css
 dist_fonts_DATA =                              \
diff --git a/src/cuirass/http.scm b/src/cuirass/http.scm
index 58bd6b6..dcb8052 100644
--- a/src/cuirass/http.scm
+++ b/src/cuirass/http.scm
@@ -4,7 +4,7 @@
 ;;; Copyright © 2018, 2019, 2020 Ludovic Courtès <address@hidden>
 ;;; Copyright © 2018 Clément Lassieur <address@hidden>
 ;;; Copyright © 2018 Tatiana Sholokhova <address@hidden>
-;;; Copyright © 2019 Ricardo Wurmus <address@hidden>
+;;; Copyright © 2019, 2020 Ricardo Wurmus <address@hidden>
 ;;;
 ;;; This file is part of Cuirass.
 ;;;
@@ -68,6 +68,7 @@
 
 (define %file-white-list
   '("css/bootstrap.css"
+    "css/cuirass.css"
     "css/open-iconic-bootstrap.css"
     "fonts/open-iconic.otf"
     "fonts/open-iconic.woff"
diff --git a/src/cuirass/templates.scm b/src/cuirass/templates.scm
index 916b250..1177bf3 100644
--- a/src/cuirass/templates.scm
+++ b/src/cuirass/templates.scm
@@ -1,7 +1,7 @@
 ;;; templates.scm -- HTTP API
 ;;; Copyright © 2018 Tatiana Sholokhova <address@hidden>
 ;;; Copyright © 2018, 2019, 2020 Ludovic Courtès <address@hidden>
-;;; Copyright © 2019 Ricardo Wurmus <address@hidden>
+;;; Copyright © 2019, 2020 Ricardo Wurmus <address@hidden>
 ;;;
 ;;; This file is part of Cuirass.
 ;;;
@@ -63,7 +63,30 @@
                 (button
                  (@ (type "submit")
                     (class "btn btn-primary"))
-                 "Search")))))
+                 "Search")))
+         (div
+          (@ (id "search-hints"))
+          (p "You can limit the search results with the following keywords:")
+          (ul
+           (li (code "spec")
+               ", a " (em "specification") " such as " (code "guix-master"))
+           (li (code "system")
+               ", a build for the given " (em "target system")
+               " such as " (code "x86_64-linux"))
+           (li (code "status")
+               ", to limit the results to builds with the given status.  "
+               "This should be one of "
+               (code "success") ", "
+               (code "failed") ", "
+               (code "failed-dependency") ", "
+               (code "failed-other") ", or "
+               (code "canceled") "."))
+          (p "You can also use the anchors " (code "^") " and " (code "$") "
+for matching the beginning and the end of a name, respectively.")
+          (p "For example, the following query will list successful builds of
+the " (code "guix-master") " specification for the " (code "i686-linux") "
+system whose names start with " (code "guile-") ":" (br)
+(code "spec:guix-master system:i686-linux status:success ^guile-")))))
 
 (define* (html-page title body navigation #:optional query)
   "Return HTML page with given TITLE and BODY."
@@ -81,7 +104,8 @@
                    (href "/static/css/bootstrap.css")))
           (link (@ (rel "stylesheet")
                    (href "/static/css/open-iconic-bootstrap.css")))
-          (style "#search input:focus { width: 500px; }")
+          (link (@ (rel "stylesheet")
+                   (href "/static/css/cuirass.css")))
           (title ,title))
          (body
           (nav (@ (class "navbar navbar-expand navbar-light bg-light"))
diff --git a/src/static/css/cuirass.css b/src/static/css/cuirass.css
new file mode 100644
index 0000000..313b6a8
--- /dev/null
+++ b/src/static/css/cuirass.css
@@ -0,0 +1,17 @@
+#search input:focus {
+    width: 500px;
+}
+#search #search-hints {
+    display: none;
+    position: absolute;
+    top: 3em;
+    background: white;
+    border: 1px solid #ced4da;
+    border-top: none;
+    width: 500px;
+    box-shadow: 3px 3px 10px #ddd;
+    padding: 1em;
+}
+#search:focus-within #search-hints {
+    display: block;
+}