diff --git a/behaviors/checkbox-group.js b/behaviors/checkbox-group.js
new file mode 100644
index 000000000..5064f3d96
--- /dev/null
+++ b/behaviors/checkbox-group.js
@@ -0,0 +1,40 @@
+/*
+Checkbox-Group arguments:
+
+{array} options each has name and value (strings)
+ */
+
+var dom = require('../services/dom');
+
+function createOptions(name, options) {
+ return options.map(function (option) {
+ var optName = option.name,
+ optValue = option.value,
+ id = name + '-' + optValue + '-' + optName;
+
+ return `
+
+
+
+
+ `;
+ }).join('\n');
+}
+
+module.exports = function (result, args) {
+ var name = result.name,
+ options = args.options,
+ field;
+
+ field = dom.create(`
+
+ `);
+
+ result.el = field;
+
+ return result;
+};
diff --git a/behaviors/checkbox-group.scss b/behaviors/checkbox-group.scss
new file mode 100644
index 000000000..38ba28963
--- /dev/null
+++ b/behaviors/checkbox-group.scss
@@ -0,0 +1,17 @@
+@import '../styleguide/inputs';
+@import '../styleguide/typography';
+
+.checkbox-group .checkbox-group-item {
+ margin: 0;
+ padding: 0;
+ width: 100%;
+}
+
+.checkbox-group input {
+ @include checkbox();
+}
+
+.checkbox-group label {
+ @include normal-text();
+ @include overlay-copy();
+}
diff --git a/behaviors/checkbox-group.test.js b/behaviors/checkbox-group.test.js
new file mode 100644
index 000000000..e69de29bb
diff --git a/client.js b/client.js
index afad4f605..6dc60aa9f 100644
--- a/client.js
+++ b/client.js
@@ -16,6 +16,7 @@ behaviors.add('soft-maxlength', require('./behaviors/soft-maxlength'));
behaviors.add('radio', require('./behaviors/radio'));
behaviors.add('description', require('./behaviors/description'));
behaviors.add('checkbox', require('./behaviors/checkbox'));
+behaviors.add('checkbox-group', require('./behaviors/checkbox-group'));
behaviors.add('textarea', require('./behaviors/textarea'));
behaviors.add('url', require('./behaviors/url'));
behaviors.add('select', require('./behaviors/select'));
diff --git a/styleguide/_inputs.scss b/styleguide/_inputs.scss
index 3b499ae07..980632697 100644
--- a/styleguide/_inputs.scss
+++ b/styleguide/_inputs.scss
@@ -27,3 +27,11 @@
border: 1px solid $yellow;
}
}
+
+@mixin checkbox {
+ height: 2.4rem;
+ margin: 0;
+ padding: 0;
+ vertical-align: middle;
+ width: 2.4rem;
+}