Added tagger widget
diff --git a/dev/scss/main/main.scss b/dev/scss/main/main.scss
index 2bd308d..8702e9d 100644
--- a/dev/scss/main/main.scss
+++ b/dev/scss/main/main.scss
@@ -8,6 +8,7 @@
@import "sidebar"; // Navigation on the left side
@import "tutorial"; // Embedded and non-embedded tutorial
@import "koralquery"; // KoralQuery
+@import "tagger"; // Tagger
@import "alertify";
div.intro {
diff --git a/dev/scss/main/tagger.scss b/dev/scss/main/tagger.scss
new file mode 100644
index 0000000..f794f0e
--- /dev/null
+++ b/dev/scss/main/tagger.scss
@@ -0,0 +1,55 @@
+@charset "utf-8";
+@import "../util";
+
+$border-size: 1px;
+
+.tagger {
+ display: table;
+ border-collapse: collapse;
+ width: 100%;
+ font-size: 100%;
+
+ // The tag list
+ > div {
+ display: table-cell;
+ font-size: inherit;
+ white-space: nowrap;
+ width: 0;
+
+ // The tag
+ > span {
+ display: inline-block;
+ white-space: nowrap;
+ background-color: $dark-orange;
+ padding: 0 4px;
+ color: rgba(0,0,0,0.3);
+ margin-right: 2px;
+ box-shadow: $choose-box-shadow;
+ border: $choose-border;
+ border-radius: $standard-border-radius;
+
+ > span {
+ cursor: pointer;
+ &::after {
+ font-size: 70%;
+ vertical-align: top;
+ margin-left: 2px;
+ color: rgba(0,0,0,0.2);
+ font-family: 'FontAwesome';
+ content: $fa-close;
+ }
+ }
+ }
+ }
+
+ // The tag input field
+ input[type=text] {
+ display: table-cell;
+ width: 100%;
+ border: none;
+ background-color: $light-grey;
+ font-size: inherit;
+ }
+}
+
+