diff --git a/src/ratpack/handlebars/header.hbs b/src/ratpack/handlebars/header.hbs
index d4d65ab..908d3ad 100644
--- a/src/ratpack/handlebars/header.hbs
+++ b/src/ratpack/handlebars/header.hbs
@@ -8,11 +8,8 @@
Offtopic!
-
+
+
{{> bootstrap}}
diff --git a/src/ratpack/handlebars/topic-watch.html.hbs b/src/ratpack/handlebars/topic-watch.html.hbs
index 1bb2d9f..db5b536 100644
--- a/src/ratpack/handlebars/topic-watch.html.hbs
+++ b/src/ratpack/handlebars/topic-watch.html.hbs
@@ -33,7 +33,7 @@
-
+
{{> footer}}
diff --git a/src/ratpack/public/css/offtopic.css b/src/ratpack/public/css/offtopic.css
new file mode 100644
index 0000000..3027798
--- /dev/null
+++ b/src/ratpack/public/css/offtopic.css
@@ -0,0 +1,16 @@
+body {
+ padding-top: 50px;
+}
+
+.multipass-body {
+ font-size: 1.2em;
+}
+
+.multipass-actions {
+ margin-top: 10px;
+}
+
+.multipass-label {
+ margin-left: 3px;
+ margin-right: 3px;
+}
diff --git a/src/ratpack/public/js/multipass.js b/src/ratpack/public/js/multipass.js
new file mode 100644
index 0000000..193ab51
--- /dev/null
+++ b/src/ratpack/public/js/multipass.js
@@ -0,0 +1,25 @@
+/* Bind all our multipass buttons */
+$('.add-multipass').click(function(e) {
+
+ $('.multipass-panel').show();
+
+ $('.multipass-body').prepend([
+ '',
+ $(e.target).attr('data-topic'),
+ ''
+ ].join("\n"));
+});
+
+
+$('.go-multipass').click(function(e) {
+ var topics = [];
+
+ $('.multipass-label').each(function(idx, el) {
+ /* Add the topic stripping all the whitespace from the text node jQuery
+ * gives us back
+ */
+ topics.push($(el).text().replace(/\s/g, ''));
+ });
+
+ document.location.href = "/topics/" + topics.join('+') + "/watch";
+});