svg icons + rollup build step

Gruntfile.js

+module.exports = function(grunt) {
+  // Project configuration.
+  grunt.initConfig({
+    pkg: grunt.file.readJSON('package.json'),
+    "svgstore": {
+      "options": {
+        "prefix" : "icon-"
+      },
+      "default": {
+        "files": {
+          "www/static/icons.svg": ["www/static/icons/*.svg"]
+        }
+      }
+    }
+  });
+  grunt.loadNpmTasks('grunt-svgstore');
+  grunt.registerTask('default', ['svgstore']);
+}

package.json

@@ -11,7 +11,9 @@
     "babel-preset-stage-0": "^6.24.1",
     "babelify": "^10.0.0",
     "browserify": "^17.0.0",
-    "es2015": "0.0.0"
+    "es2015": "0.0.0",
+    "grunt": "^1.4.1",
+    "grunt-svgstore": "^2.0.0"
   },
   "babel": {
     "presets": [

datasette-dashboards @ 1343e5e2

-Subproject commit 944e256d653b723e171e3a2722a5478bbc41e0ed
+Subproject commit 1343e5e2c7db70b6f462c6a1a54a3e1fb143beb1

www/static/icons.svg

+<svg xmlns="http://www.w3.org/2000/svg"><symbol viewBox="0 0 16 16" id="icon-arrows-fullscreen"><title>arrows-fullscreen</title> <path fill-rule="evenodd" d="M5.828 10.172a.5.5 0 0 0-.707 0l-4.096 4.096V11.5a.5.5 0 0 0-1 0v3.975a.5.5 0 0 0 .5.5H4.5a.5.5 0 0 0 0-1H1.732l4.096-4.096a.5.5 0 0 0 0-.707zm4.344 0a.5.5 0 0 1 .707 0l4.096 4.096V11.5a.5.5 0 1 1 1 0v3.975a.5.5 0 0 1-.5.5H11.5a.5.5 0 0 1 0-1h2.768l-4.096-4.096a.5.5 0 0 1 0-.707zm0-4.344a.5.5 0 0 0 .707 0l4.096-4.096V4.5a.5.5 0 1 0 1 0V.525a.5.5 0 0 0-.5-.5H11.5a.5.5 0 0 0 0 1h2.768l-4.096 4.096a.5.5 0 0 0 0 .707zm-4.344 0a.5.5 0 0 1-.707 0L1.025 1.732V4.5a.5.5 0 0 1-1 0V.525a.5.5 0 0 1 .5-.5H4.5a.5.5 0 0 1 0 1H1.732l4.096 4.096a.5.5 0 0 1 0 .707z"/> </symbol><symbol viewBox="0 0 16 16" id="icon-calendar-range"><title>calendar-range</title> <path d="M9 7a1 1 0 0 1 1-1h5v2h-5a1 1 0 0 1-1-1zM1 9h4a1 1 0 0 1 0 2H1V9z"/> <path d="M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zM1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4H1z"/> </symbol><symbol viewBox="0 0 16 16" id="icon-card-list"><title>card-list</title> <path d="M14.5 3a.5.5 0 0 1 .5.5v9a.5.5 0 0 1-.5.5h-13a.5.5 0 0 1-.5-.5v-9a.5.5 0 0 1 .5-.5h13zm-13-1A1.5 1.5 0 0 0 0 3.5v9A1.5 1.5 0 0 0 1.5 14h13a1.5 1.5 0 0 0 1.5-1.5v-9A1.5 1.5 0 0 0 14.5 2h-13z"/> <path d="M5 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 5 8zm0-2.5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm0 5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-1-5a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0zM4 8a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0zm0 2.5a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0z"/> </symbol><symbol viewBox="0 0 16 16" id="icon-kanban"><title>kanban</title> <path d="M13.5 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1h-11a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h11zm-11-1a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h11a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2h-11z"/> <path d="M6.5 3a1 1 0 0 1 1-1h1a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1h-1a1 1 0 0 1-1-1V3zm-4 0a1 1 0 0 1 1-1h1a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1h-1a1 1 0 0 1-1-1V3zm8 0a1 1 0 0 1 1-1h1a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1h-1a1 1 0 0 1-1-1V3z"/> </symbol><symbol viewBox="0 0 16 16" id="icon-search"><title>search</title> <path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"/> </symbol><symbol viewBox="0 0 16 16" id="icon-table"><title>table</title> <path d="M0 2a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V2zm15 2h-4v3h4V4zm0 4h-4v3h4V8zm0 4h-4v3h3a1 1 0 0 0 1-1v-2zm-5 3v-3H6v3h4zm-5 0v-3H1v2a1 1 0 0 0 1 1h3zm-4-4h4V8H1v3zm0-4h4V4H1v3zm5-3v3h4V4H6zm4 4H6v3h4V8z"/> </symbol></svg>
\ No newline at end of file

www/static/styles.css

@@ -218,15 +218,16 @@ body.db.db-metrics .content > ul > li {
   height: 50px;
   flex-shrink: 1;
   flex-grow: 1;
+  margin-right: .5rem;
 }
 
 .filter-type-text {
-  margin-top: 8px;
+  margin-top: 0.6rem;
   height: 40px;
 }
 
 .filter_projects {
-  flex: 2 1 400px;
+  flex: 10 1 400px;
 }
 
 #filter-group-date {
@@ -242,6 +243,9 @@ body.db.db-metrics .content > ul > li {
 #filter-group-buttons input {
   padding: 0.7rem 0.8rem;
 }
+#filter-group-task_id {
+  flex: 0 0 220px;
+}
 .workboard-column-filter {
   border-radius: 10px 10px 0 0;
 }

www/templates/project_columns.html

@@ -4,14 +4,17 @@
   <div class='workboard-column-filter col border shadow-sm p-2 mb-1'>
       <h6>
       {% if column.proxyPHID %}
-      <a href="?{{ alter_query_url(query_string, {'project': column.proxyPHID} ) }}">{{column.name}}</a>
+      <a href="?{{ alter_query_url(query_params, {'project': column.proxyPHID} ) }}">{{column.name}}</a>
+      {% elif query_parameters['column'] == column.projectURI %}
+<svg class="icon">
+  <use xlink:href="
       {% elif column.projectURI %}
       <a href="{{column.projectURI}}">{{ column.name }}</a>
       {% else %}
       {{ column.name }}
       {% endif %}
       </h6>
-      <a href="?{{ alter_query_url(query_string, {'column': column.phid} ) }}">filter</a>
+      <a href="?{{ alter_query_url(query_string, {'column': column.phid} ) }}"><img src='/static/icons/search.svg'></a>
   </div>
   {% endfor %}
 </div>