initial import

Gruntfile.js

@@ -0,0 +1,80 @@
+module.exports = function (grunt) {
+    grunt.initConfig({
+        sass: {
+          dev: {
+            options: {
+              style: 'compact'
+            },
+            files: {
+              'assets/css/agaric.css': 'sass/agaric.scss'
+            }
+          }
+        },
+        assemble: {
+              dev: {
+                options: {
+                    flatten: true,
+                    data: 'design-source/data/*.{json,yml}',
+                    layout: false,
+                    partials: 'design-source/templates/**/*.hbs'
+                },
+                files: [
+                    {
+                      expand: true,
+                      cwd: 'design-source/pages',
+                      src: '**/*.{hbs,md}',
+                      dest: 'design-output/'
+                    }
+                ]
+            }
+        },
+        clean: ['design-output/*.html'],
+        connect: {
+            preview: {
+                options: {
+                    base: ['./'],
+                    port: 9000,
+                    hostname: 'localhost',
+                    keepalive: false,
+                    livereload: 35729,
+                    open: 'http://0.0.0.0:9000/design-output'
+                }
+            }
+        },
+        watch: {
+            templates: {
+                files: [
+                  'design-source/templates/**/*.{hbs,md}',
+                  'design-source/pages/**/*.{hbs,md}',
+                  'design-source/data/**/*.json',
+                  'sass/**/*.scss',
+                ],
+                tasks: ['assemble','sass:dev']
+            },
+            livereload: {
+                options: {
+                    livereload: '<%= connect.preview.options.livereload %>'
+                },
+                files: ['design-output/**.*']
+            }
+        },
+        shell: {
+            target: {
+                command: './node_modules/.bin/kss --config sass/styleguide-config.json --verbose'
+            }
+        }
+    });
+
+    grunt.loadNpmTasks('assemble');
+    grunt.loadNpmTasks('grunt-contrib-clean');
+    grunt.loadNpmTasks('grunt-contrib-connect');
+    grunt.loadNpmTasks('grunt-contrib-watch');
+    grunt.loadNpmTasks('grunt-sass');
+    grunt.loadNpmTasks('grunt-shell');
+    grunt.loadNpmTasks('grunt-kss');
+
+    grunt.registerTask('kss',['shell']);
+    grunt.registerTask('build', ['clean', 'assemble', 'sass:dev']);
+    grunt.registerTask('server', ['build','connect','watch']);
+    grunt.registerTask('default', ['server']);
+};

assets/css/fonts/slick.svg

@@ -0,0 +1,14 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg">
+<metadata>Generated by Fontastic.me</metadata>
+<defs>
+<font id="slick" horiz-adv-x="512">
+<font-face font-family="slick" units-per-em="512" ascent="480" descent="-32"/>
+<missing-glyph horiz-adv-x="512" />
+
+<glyph unicode="&#8594;" d="M241 113l130 130c4 4 6 8 6 13 0 5-2 9-6 13l-130 130c-3 3-7 5-12 5-5 0-10-2-13-5l-29-30c-4-3-6-7-6-12 0-5 2-10 6-13l87-88-87-88c-4-3-6-8-6-13 0-5 2-9 6-12l29-30c3-3 8-5 13-5 5 0 9 2 12 5z m234 143c0-40-9-77-29-110-20-34-46-60-80-80-33-20-70-29-110-29-40 0-77 9-110 29-34 20-60 46-80 80-20 33-29 70-29 110 0 40 9 77 29 110 20 34 46 60 80 80 33 20 70 29 110 29 40 0 77-9 110-29 34-20 60-46 80-80 20-33 29-70 29-110z"/>
+<glyph unicode="&#8592;" d="M296 113l29 30c4 3 6 7 6 12 0 5-2 10-6 13l-87 88 87 88c4 3 6 8 6 13 0 5-2 9-6 12l-29 30c-3 3-8 5-13 5-5 0-9-2-12-5l-130-130c-4-4-6-8-6-13 0-5 2-9 6-13l130-130c3-3 7-5 12-5 5 0 10 2 13 5z m179 143c0-40-9-77-29-110-20-34-46-60-80-80-33-20-70-29-110-29-40 0-77 9-110 29-34 20-60 46-80 80-20 33-29 70-29 110 0 40 9 77 29 110 20 34 46 60 80 80 33 20 70 29 110 29 40 0 77-9 110-29 34-20 60-46 80-80 20-33 29-70 29-110z"/>
+<glyph unicode="&#8226;" d="M475 256c0-40-9-77-29-110-20-34-46-60-80-80-33-20-70-29-110-29-40 0-77 9-110 29-34 20-60 46-80 80-20 33-29 70-29 110 0 40 9 77 29 110 20 34 46 60 80 80 33 20 70 29 110 29 40 0 77-9 110-29 34-20 60-46 80-80 20-33 29-70 29-110z"/>
+<glyph unicode="&#97;" d="M475 439l0-128c0-5-1-9-5-13-4-4-8-5-13-5l-128 0c-8 0-13 3-17 11-3 7-2 14 4 20l40 39c-28 26-62 39-100 39-20 0-39-4-57-11-18-8-33-18-46-32-14-13-24-28-32-46-7-18-11-37-11-57 0-20 4-39 11-57 8-18 18-33 32-46 13-14 28-24 46-32 18-7 37-11 57-11 23 0 44 5 64 15 20 9 38 23 51 42 2 1 4 3 7 3 3 0 5-1 7-3l39-39c2-2 3-3 3-6 0-2-1-4-2-6-21-25-46-45-76-59-29-14-60-20-93-20-30 0-58 5-85 17-27 12-51 27-70 47-20 19-35 43-47 70-12 27-17 55-17 85 0 30 5 58 17 85 12 27 27 51 47 70 19 20 43 35 70 47 27 12 55 17 85 17 28 0 55-5 81-15 26-11 50-26 70-45l37 37c6 6 12 7 20 4 8-4 11-9 11-17z"/>
+</font></defs></svg>

assets/img/agaric-logo.svg

@@ -0,0 +1,35 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 21.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 95 37" style="enable-background:new 0 0 95 37;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#FFFFFF;}
+</style>
+<g>
+	<path class="st0" d="M13,8.8c-0.7-0.8-1.5-1.3-2.4-1.7C9.7,6.7,8.8,6.5,7.8,6.5c-2.2,0-4,0.8-5.5,2.5C0.8,10.6,0,12.7,0,15.3
+		c0,2.5,0.8,4.5,2.3,6.2c1.6,1.7,3.4,2.5,5.5,2.5c1,0,1.8-0.2,2.7-0.5c0.8-0.3,1.6-0.9,2.4-1.7v1.8h4.2V6.9H13V8.8z M11.9,18.8
+		c-0.9,0.9-1.9,1.4-3.2,1.4c-1.3,0-2.3-0.5-3.2-1.4c-0.9-0.9-1.3-2.1-1.3-3.5c0-1.4,0.4-2.6,1.3-3.5c0.8-0.9,1.9-1.4,3.2-1.4
+		c1.3,0,2.4,0.4,3.3,1.3c0.9,0.9,1.3,2.1,1.3,3.5C13.2,16.7,12.7,17.9,11.9,18.8z"/>
+	<path class="st0" d="M55.5,23.5V6.9h-4.2v1.8c-0.7-0.8-1.5-1.3-2.4-1.7c-0.9-0.4-1.8-0.6-2.8-0.6c-2.2,0-4,0.8-5.5,2.5
+		c-1.5,1.6-2.3,3.7-2.3,6.3c0,2.5,0.8,4.5,2.3,6.2c1.6,1.7,3.4,2.5,5.5,2.5c1,0,1.8-0.2,2.7-0.5c0.8-0.3,1.6-0.9,2.4-1.7v1.8H55.5z
+		 M50.2,18.8c-0.9,0.9-1.9,1.4-3.2,1.4c-1.3,0-2.3-0.5-3.2-1.4c-0.9-0.9-1.3-2.1-1.3-3.5c0-1.4,0.4-2.6,1.3-3.5
+		c0.8-0.9,1.9-1.4,3.2-1.4c1.3,0,2.4,0.4,3.3,1.3c0.9,0.9,1.3,2.1,1.3,3.5C51.5,16.7,51.1,17.9,50.2,18.8z"/>
+	<path class="st0" d="M86.8,20.1c-1.5,0-2.7-0.4-3.6-1.3c-0.9-0.9-1.4-2-1.4-3.4c0-1.4,0.5-2.6,1.4-3.6c1-0.9,2.2-1.4,3.8-1.4
+		c0.9,0,1.6,0.1,2.2,0.4c0.6,0.3,1.3,0.7,1.9,1.4l3.5-1.9c-0.8-1.2-1.9-2.1-3.2-2.8c-1.3-0.7-2.8-1-4.4-1c-1.8,0-3.4,0.4-4.8,1.2
+		c-1.4,0.8-2.6,1.8-3.4,3.2c-0.8,1.3-1.2,2.8-1.2,4.4c0,2.3,0.8,4.3,2.5,6.1c1.6,1.7,3.9,2.6,6.8,2.6c3.2,0,5.7-1.2,7.5-3.5
+		l-3.3-2.2C90.1,19.5,88.6,20.1,86.8,20.1z"/>
+	<path class="st0" d="M34.2,5.7l-1.7,1.7c-1.1-0.6-2.4-1-3.7-1c-7.6,0-9.1,5.6-9.1,8.7c0,1.6,0.4,3.9,1.9,5.7
+		c-1.4,2.2-2.9,6.2-1.7,9.8c0.3,1.4,1.1,2.6,2.3,3.7c1.6,1.5,3.6,2.2,5.9,2.2c0,0,0,0,0,0c0,0,0,0,0,0c2.3,0,4.3-0.7,5.9-2.2
+		c1.6-1.5,2.4-3.3,2.4-5.4c0-2.2-1.4-3.2-3.3-3.2h-9.7c0.3-1.1,0.7-2.1,1.1-2.7c1.2,0.5,2.6,0.8,4.3,0.8c2.2,0,4.1-0.8,5.6-2.5
+		c1.5-1.6,2.3-3.7,2.3-6.2c0-2-0.5-3.7-1.4-5.1l1.7-1.7L34.2,5.7z M32.6,29.5c-0.1,0.9-0.5,1.6-1.2,2.2c-0.9,0.9-2,1.3-3.4,1.3
+		c0,0,0,0-0.1,0l0,0l0,0c0,0,0,0-0.1,0c-1.4,0-2.4-0.4-3.4-1.3c-0.7-0.7-1.1-1.4-1.2-2.2H32.6z M31.2,18.7c-0.9,0.9-1.9,1.4-3.2,1.4
+		c-1.3,0-2.4-0.5-3.2-1.4c-0.9-0.9-1.3-2.1-1.3-3.6c0-1.4,0.4-2.6,1.3-3.5c0.9-0.9,1.9-1.3,3.3-1.3c1.3,0,2.4,0.5,3.2,1.4
+		c0.8,0.9,1.3,2.1,1.3,3.5C32.5,16.6,32.1,17.8,31.2,18.7z"/>
+	<rect x="71.4" y="6.9" class="st0" width="4.2" height="16.6"/>
+	<circle class="st0" cx="73.5" cy="2.7" r="2.7"/>
+	<rect x="38.3" y="25.9" class="st0" width="55.6" height="3.6"/>
+	<rect x="0.8" y="25.9" class="st0" width="16.4" height="3.6"/>
+	<path class="st0" d="M58.3,6.9v16.6h4.1v-8.6c0-3.2,1-4.7,3.1-4.7c0.7,0,1.4,0.3,2.1,0.8l1.8-3.5c-1.1-0.7-2.2-1-3.2-1
+		c-0.8,0-1.4,0.1-2,0.4c-0.5,0.3-1.2,0.8-1.9,1.5V6.9H58.3z"/>
+</g>
+</svg>

assets/js/script.js

@@ -0,0 +1,45 @@
+$( document ).ready(function() {
+
+  // Open side navbar for handsets
+  $('.navbar-burger').on('click tap', function(e) {
+    $(this).toggleClass('is-active');
+    $(this).parent().parent().find('#navbar-menu').toggleClass('is-active');
+  });
+
+
+  // Swap navbar colors with ScrollMagic.js
+  var controller = new ScrollMagic.Controller();
+  var sections = $('section[data-headerbg]');
+  $.each(sections, function(index,item){
+    var el = $(item),
+      elClass = el.data('headerbg') + '-header',
+      headerEl = $('#navbar');
+    new ScrollMagic.Scene({
+        triggerElement: el,
+        triggerHook: 'onLeave',
+        duration: el.outerHeight()
+      })
+      .offset(el.offset().top - headerEl.outerHeight())
+      .on("enter",function(e){headerEl.addClass(elClass)})
+      .on("leave",function(e){headerEl.removeClass(elClass)})
+      .addTo(controller);
+  });
+
+  // Slick carousel
+  $('.carousel').slick({
+    arrows: false,
+    centerMode: true,
+    centerPadding: '0',
+    slidesToShow: 3,
+    dots: true,
+    responsive: [
+      {
+        breakpoint: 600,
+        settings: {
+          slidesToShow: 1
+        }
+      }
+    ]
+  });
+
+});