summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorSebastin Santy <sebastinssanty@gmail.com>2017-07-21 21:34:55 +0200
committerDylan William Hardison <dylan@hardison.net>2017-07-21 21:34:55 +0200
commitcc1372e99236ffc5987e46fc09b5454b2425d9f7 (patch)
treea5ec88378d12b9d764efecfb038389a290bcdffd
parent87fed0b46b4b7868f0c15a9f6fb7a4291b4bbc1f (diff)
downloadbugzilla-cc1372e99236ffc5987e46fc09b5454b2425d9f7.tar.gz
bugzilla-cc1372e99236ffc5987e46fc09b5454b2425d9f7.tar.xz
Bug 1381752 - Re-organize the layout
-rw-r--r--extensions/BugModal/template/en/default/bug_modal/common_header.html.tmpl4
-rw-r--r--extensions/BugModal/template/en/default/bug_modal/common_new_comment.html.tmpl14
-rw-r--r--extensions/BugModal/web/common_bug_modal.css2
-rw-r--r--extensions/BugModal/web/common_bug_modal.js3
-rw-r--r--extensions/BugModal/web/new_bug.css47
-rw-r--r--extensions/BugModal/web/new_bug.js12
-rw-r--r--js/jquery/plugins/selectize/selectize.bootstrap2.css494
-rw-r--r--js/jquery/plugins/selectize/selectize.bootstrap3.css408
-rw-r--r--js/jquery/plugins/selectize/selectize.css324
-rw-r--r--template/en/default/bug/new_bug.html.tmpl320
10 files changed, 1445 insertions, 183 deletions
diff --git a/extensions/BugModal/template/en/default/bug_modal/common_header.html.tmpl b/extensions/BugModal/template/en/default/bug_modal/common_header.html.tmpl
index 2ffee3bd7..814464f27 100644
--- a/extensions/BugModal/template/en/default/bug_modal/common_header.html.tmpl
+++ b/extensions/BugModal/template/en/default/bug_modal/common_header.html.tmpl
@@ -49,7 +49,7 @@
"contextMenu",
"visibility"
);
- style_urls.push(
+ style_urls.unshift(
"extensions/BugModal/web/common_bug_modal.css",
"extensions/BugModal/web/dropdown.css",
"skins/custom/bug_groups.css",
@@ -76,4 +76,4 @@
};
[% END %]
-[% Hook.process("end") %] \ No newline at end of file
+[% Hook.process("end") %]
diff --git a/extensions/BugModal/template/en/default/bug_modal/common_new_comment.html.tmpl b/extensions/BugModal/template/en/default/bug_modal/common_new_comment.html.tmpl
index 2ba3948d1..184310277 100644
--- a/extensions/BugModal/template/en/default/bug_modal/common_new_comment.html.tmpl
+++ b/extensions/BugModal/template/en/default/bug_modal/common_new_comment.html.tmpl
@@ -39,17 +39,19 @@
Preview
<img id="preview-throbber" src="extensions/BugModal/web/throbber.gif" width="16" height="11" style="display:none">
</li>
+ <!-- <li id="comment-guide-tab" role="tab" tabindex="-2" aria-controls="comment-guide-tabpanel" aria-selected="false">
+ <a href="page.cgi?id=etiquette.html" target="_blank" tabindex="-1">
+ Comments Subject to Etiquette and Contributor Guidelines</a>
+ </li> -->
</ul>
+<!-- <div id="bugzilla-etiquette">
+
+ </div> -->
<div id="comment-edit-tabpanel" class="comment-tabpanel" role="tabpanel" aria-labelledby="comment-edit-tab">
- <textarea rows="5" cols="80" name="comment" id="comment" aria-labelledby="comment-edit-tab"></textarea>
+ <textarea rows="5" [%+ UNLESS disable_cols %] cols="80" [% END +%] name="comment" id="comment" aria-labelledby="comment-edit-tab"></textarea>
</div>
<div id="comment-preview-tabpanel" class="comment-tabpanel" role="tabpanel" aria-labelledby="comment-preview-tab" style="display:none">
<pre id="comment-preview" class="comment-text"></pre>
</div>
-
- <div id="bugzilla-etiquette">
- <a href="page.cgi?id=etiquette.html" target="_blank" tabindex="-1">
- Comments Subject to Etiquette and Contributor Guidelines</a>
- </div>
</div>
diff --git a/extensions/BugModal/web/common_bug_modal.css b/extensions/BugModal/web/common_bug_modal.css
index 36b84e380..7eeefd6ff 100644
--- a/extensions/BugModal/web/common_bug_modal.css
+++ b/extensions/BugModal/web/common_bug_modal.css
@@ -692,7 +692,7 @@ body.platform-Win32 .comment-text, body.platform-Win64 .comment-text {
/* add comment */
#add-comment {
- margin-top: 20px;
+ margin-top: 10px;
}
#add-comment-private,
diff --git a/extensions/BugModal/web/common_bug_modal.js b/extensions/BugModal/web/common_bug_modal.js
index b275c3a29..a06b391d9 100644
--- a/extensions/BugModal/web/common_bug_modal.js
+++ b/extensions/BugModal/web/common_bug_modal.js
@@ -871,9 +871,6 @@ $(function() {
$.scrollTo($('#comment'), function() { $('#comment').focus(); });
});
- // auto-enlarge comment area (up to its max-height)
- autosize($('#comment'));
-
// add comment --> private
$('#add-comment-private-cb')
.click(function(event) {
diff --git a/extensions/BugModal/web/new_bug.css b/extensions/BugModal/web/new_bug.css
index 45c3abcea..a96083d81 100644
--- a/extensions/BugModal/web/new_bug.css
+++ b/extensions/BugModal/web/new_bug.css
@@ -1,7 +1,46 @@
-#bugzilla-etiquette {
- float: left;
+#bugzilla-body {
+ max-width: initial;
+ min-width: initial;
+ width: initial;
}
+
#create-btn {
- margin: 0 0 5px 0;
- float: right;
+ margin: 5px 0 5px 0;
+ float: right;
+ padding: 8px;
+}
+
+.new-bug-container {
+ display: flex;
+ display: -webkit-flex;
+ flex-direction: column;
+ padding:5px;
+}
+
+.new-bug {
+ display: flex;
+ display: -webkit-flex;
+ flex-flow: row wrap;
+ padding:5px;
+}
+
+.new-bug-split-1 {
+ flex: 2 1 30px;
+ margin:5px;
+}
+.new-bug-split-2 {
+ flex: 4 1 30px;
+ margin:5px;
+}
+.new-bug-pad {
+ flex: 1 1 30px;
+ margin:5px;
+}
+
+.new-bug-title {
+ flex: 6 1 30px;
+ margin:5px;
+}
+input, label {
+ display: block; !important
}
diff --git a/extensions/BugModal/web/new_bug.js b/extensions/BugModal/web/new_bug.js
index d00770e3a..9da5abce9 100644
--- a/extensions/BugModal/web/new_bug.js
+++ b/extensions/BugModal/web/new_bug.js
@@ -16,6 +16,7 @@ $(document).ready(function() {
var product_sel = $("#product").selectize({
valueField: 'name',
labelField: 'name',
+ placeholder: 'Product',
searchField: 'name',
options: [],
preload: true,
@@ -27,6 +28,7 @@ $(document).ready(function() {
var component_sel = $("#component").selectize({
valueField: 'name',
labelField: 'name',
+ placeholder: 'Component',
searchField: 'name',
options: [],
});
@@ -34,6 +36,7 @@ $(document).ready(function() {
var version_sel = $("#version").selectize({
valueField: 'name',
labelField: 'name',
+ placeholder: 'Version',
searchField: 'name',
options: [],
});
@@ -42,6 +45,7 @@ $(document).ready(function() {
delimiter: ', ',
valueField: 'name',
labelField: 'name',
+ placeholder: 'Keywords',
searchField: 'name',
options: [],
preload: true,
@@ -93,9 +97,13 @@ $(document).ready(function() {
$('.create-btn')
.click(function(event) {
event.preventDefault();
- if (document.newbugform.checkValidity && !document.newbugform.checkValidity())
+ if (document.newbugform.checkValidity && !document.newbugform.checkValidity()) {
+ alert("Required fields are empty");
return;
- this.form.submit()
+ }
+ else {
+ this.form.submit()
+ }
});
});
diff --git a/js/jquery/plugins/selectize/selectize.bootstrap2.css b/js/jquery/plugins/selectize/selectize.bootstrap2.css
new file mode 100644
index 000000000..419862fb2
--- /dev/null
+++ b/js/jquery/plugins/selectize/selectize.bootstrap2.css
@@ -0,0 +1,494 @@
+/**
+ * selectize.bootstrap2.css (v0.12.4) - Bootstrap 2 Theme
+ * Copyright (c) 2013–2015 Brian Reavis & contributors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
+ * file except in compliance with the License. You may obtain a copy of the License at:
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
+ * ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ *
+ * @author Brian Reavis <brian@thirdroute.com>
+ */
+.selectize-control.plugin-drag_drop.multi > .selectize-input > div.ui-sortable-placeholder {
+ visibility: visible !important;
+ background: #f2f2f2 !important;
+ background: rgba(0, 0, 0, 0.06) !important;
+ border: 0 none !important;
+ -webkit-box-shadow: inset 0 0 12px 4px #ffffff;
+ box-shadow: inset 0 0 12px 4px #ffffff;
+}
+.selectize-control.plugin-drag_drop .ui-sortable-placeholder::after {
+ content: '!';
+ visibility: hidden;
+}
+.selectize-control.plugin-drag_drop .ui-sortable-helper {
+ -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
+ box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
+}
+.selectize-dropdown-header {
+ position: relative;
+ padding: 3px 10px;
+ border-bottom: 1px solid #d0d0d0;
+ background: #f8f8f8;
+ -webkit-border-radius: 4px 4px 0 0;
+ -moz-border-radius: 4px 4px 0 0;
+ border-radius: 4px 4px 0 0;
+}
+.selectize-dropdown-header-close {
+ position: absolute;
+ right: 10px;
+ top: 50%;
+ color: #333333;
+ opacity: 0.4;
+ margin-top: -12px;
+ line-height: 20px;
+ font-size: 20px !important;
+}
+.selectize-dropdown-header-close:hover {
+ color: #000000;
+}
+.selectize-dropdown.plugin-optgroup_columns .optgroup {
+ border-right: 1px solid #f2f2f2;
+ border-top: 0 none;
+ float: left;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+}
+.selectize-dropdown.plugin-optgroup_columns .optgroup:last-child {
+ border-right: 0 none;
+}
+.selectize-dropdown.plugin-optgroup_columns .optgroup:before {
+ display: none;
+}
+.selectize-dropdown.plugin-optgroup_columns .optgroup-header {
+ border-top: 0 none;
+}
+.selectize-control.plugin-remove_button [data-value] {
+ position: relative;
+ padding-right: 24px !important;
+}
+.selectize-control.plugin-remove_button [data-value] .remove {
+ z-index: 1;
+ /* fixes ie bug (see #392) */
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ width: 17px;
+ text-align: center;
+ font-weight: bold;
+ font-size: 12px;
+ color: inherit;
+ text-decoration: none;
+ vertical-align: middle;
+ display: inline-block;
+ padding: 1px 0 0 0;
+ border-left: 1px solid #cccccc;
+ -webkit-border-radius: 0 2px 2px 0;
+ -moz-border-radius: 0 2px 2px 0;
+ border-radius: 0 2px 2px 0;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+}
+.selectize-control.plugin-remove_button [data-value] .remove:hover {
+ background: rgba(0, 0, 0, 0.05);
+}
+.selectize-control.plugin-remove_button [data-value].active .remove {
+ border-left-color: #0077b3;
+}
+.selectize-control.plugin-remove_button .disabled [data-value] .remove:hover {
+ background: none;
+}
+.selectize-control.plugin-remove_button .disabled [data-value] .remove {
+ border-left-color: #e0e0e0;
+}
+.selectize-control.plugin-remove_button .remove-single {
+ position: absolute;
+ right: 28px;
+ top: 6px;
+ font-size: 23px;
+}
+.selectize-control {
+ position: relative;
+}
+.selectize-dropdown,
+.selectize-input,
+.selectize-input input {
+ color: #333333;
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ font-size: 14px;
+ line-height: 20px;
+ -webkit-font-smoothing: inherit;
+}
+.selectize-input,
+.selectize-control.single .selectize-input.input-active {
+ background: #ffffff;
+ cursor: text;
+ display: inline-block;
+}
+.selectize-input {
+ border: 1px solid #d0d0d0;
+ padding: 7px 10px;
+ display: inline-block;
+ width: 100%;
+ overflow: hidden;
+ position: relative;
+ z-index: 1;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ -webkit-border-radius: 4px;
+ -moz-border-radius: 4px;
+ border-radius: 4px;
+}
+.selectize-control.multi .selectize-input.has-items {
+ padding: 5px 10px 2px;
+}
+.selectize-input.full {
+ background-color: #ffffff;
+}
+.selectize-input.disabled,
+.selectize-input.disabled * {
+ cursor: default !important;
+}
+.selectize-input.focus {
+ -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
+ box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
+}
+.selectize-input.dropdown-active {
+ -webkit-border-radius: 4px 4px 0 0;
+ -moz-border-radius: 4px 4px 0 0;
+ border-radius: 4px 4px 0 0;
+}
+.selectize-input > * {
+ vertical-align: baseline;
+ display: -moz-inline-stack;
+ display: inline-block;
+ zoom: 1;
+ *display: inline;
+}
+.selectize-control.multi .selectize-input > div {
+ cursor: pointer;
+ margin: 0 3px 3px 0;
+ padding: 1px 3px;
+ background: #e6e6e6;
+ color: #333333;
+ border: 1px solid #cccccc;
+}
+.selectize-control.multi .selectize-input > div.active {
+ background: #0088cc;
+ color: #ffffff;
+ border: 1px solid #0077b3;
+}
+.selectize-control.multi .selectize-input.disabled > div,
+.selectize-control.multi .selectize-input.disabled > div.active {
+ color: #474747;
+ background: #fafafa;
+ border: 1px solid #e0e0e0;
+}
+.selectize-input > input {
+ display: inline-block !important;
+ padding: 0 !important;
+ min-height: 0 !important;
+ max-height: none !important;
+ max-width: 100% !important;
+ margin: 0 !important;
+ text-indent: 0 !important;
+ border: 0 none !important;
+ background: none !important;
+ line-height: inherit !important;
+ -webkit-user-select: auto !important;
+ -webkit-box-shadow: none !important;
+ box-shadow: none !important;
+}
+.selectize-input > input::-ms-clear {
+ display: none;
+}
+.selectize-input > input:focus {
+ outline: none !important;
+}
+.selectize-input::after {
+ content: ' ';
+ display: block;
+ clear: left;
+}
+.selectize-input.dropdown-active::before {
+ content: ' ';
+ display: block;
+ position: absolute;
+ background: #e5e5e5;
+ height: 1px;
+ bottom: 0;
+ left: 0;
+ right: 0;
+}
+.selectize-dropdown {
+ position: absolute;
+ z-index: 10;
+ border: 1px solid #cccccc;
+ background: #ffffff;
+ margin: -1px 0 0 0;
+ border-top: 0 none;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+ -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+ -webkit-border-radius: 0 0 4px 4px;
+ -moz-border-radius: 0 0 4px 4px;
+ border-radius: 0 0 4px 4px;
+}
+.selectize-dropdown [data-selectable] {
+ cursor: pointer;
+ overflow: hidden;
+}
+.selectize-dropdown [data-selectable] .highlight {
+ background: rgba(255, 237, 40, 0.4);
+ -webkit-border-radius: 1px;
+ -moz-border-radius: 1px;
+ border-radius: 1px;
+}
+.selectize-dropdown [data-selectable],
+.selectize-dropdown .optgroup-header {
+ padding: 3px 10px;
+}
+.selectize-dropdown .optgroup:first-child .optgroup-header {
+ border-top: 0 none;
+}
+.selectize-dropdown .optgroup-header {
+ color: #999999;
+ background: #ffffff;
+ cursor: default;
+}
+.selectize-dropdown .active {
+ background-color: #0088cc;
+ color: #ffffff;
+}
+.selectize-dropdown .active.create {
+ color: #ffffff;
+}
+.selectize-dropdown .create {
+ color: rgba(51, 51, 51, 0.5);
+}
+.selectize-dropdown-content {
+ overflow-y: auto;
+ overflow-x: hidden;
+ max-height: 200px;
+ -webkit-overflow-scrolling: touch;
+}
+.selectize-control.single .selectize-input,
+.selectize-control.single .selectize-input input {
+ cursor: pointer;
+}
+.selectize-control.single .selectize-input.input-active,
+.selectize-control.single .selectize-input.input-active input {
+ cursor: text;
+}
+.selectize-control.single .selectize-input:after {
+ content: ' ';
+ display: block;
+ position: absolute;
+ top: 50%;
+ right: 15px;
+ margin-top: -3px;
+ width: 0;
+ height: 0;
+ border-style: solid;
+ border-width: 5px 5px 0 5px;
+ border-color: #000000 transparent transparent transparent;
+}
+.selectize-control.single .selectize-input.dropdown-active:after {
+ margin-top: -4px;
+ border-width: 0 5px 5px 5px;
+ border-color: transparent transparent #000000 transparent;
+}
+.selectize-control.rtl.single .selectize-input:after {
+ left: 15px;
+ right: auto;
+}
+.selectize-control.rtl .selectize-input > input {
+ margin: 0 4px 0 -2px !important;
+}
+.selectize-control .selectize-input.disabled {
+ opacity: 0.5;
+ background-color: #ffffff;
+}
+.selectize-dropdown {
+ margin: 2px 0 0 0;
+ z-index: 1000;
+ border: 1px solid rgba(0, 0, 0, 0.2);
+ border-radius: 4px;
+ -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
+ -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
+ box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
+}
+.selectize-dropdown .optgroup-header {
+ font-size: 11px;
+ font-weight: bold;
+ text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
+ text-transform: uppercase;
+}
+.selectize-dropdown .optgroup:first-child:before {
+ display: none;
+}
+.selectize-dropdown .optgroup:before {
+ content: ' ';
+ display: block;
+ *width: 100%;
+ height: 1px;
+ margin: 9px 1px;
+ *margin: -5px 0 5px;
+ overflow: hidden;
+ background-color: #e5e5e5;
+ border-bottom: 1px solid #ffffff;
+ margin-left: -10px;
+ margin-right: -10px;
+}
+.selectize-dropdown [data-selectable].active {
+ background-color: #0081c2;
+ background-image: -moz-linear-gradient(top, #0088cc, #0077b3);
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0077b3));
+ background-image: -webkit-linear-gradient(top, #0088cc, #0077b3);
+ background-image: -o-linear-gradient(top, #0088cc, #0077b3);
+ background-image: linear-gradient(to bottom, #0088cc, #0077b3);
+ background-repeat: repeat-x;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0077b3', GradientType=0);
+}
+.selectize-dropdown-content {
+ padding: 5px 0;
+}
+.selectize-dropdown-header {
+ padding: 6px 10px;
+}
+.selectize-input {
+ -webkit-transition: border linear .2s, box-shadow linear .2s;
+ -moz-transition: border linear .2s, box-shadow linear .2s;
+ -o-transition: border linear .2s, box-shadow linear .2s;
+ transition: border linear .2s, box-shadow linear .2s;
+}
+.selectize-input.dropdown-active {
+ -webkit-border-radius: 4px;
+ -moz-border-radius: 4px;
+ border-radius: 4px;
+}
+.selectize-input.dropdown-active::before {
+ display: none;
+}
+.selectize-input.input-active,
+.selectize-input.input-active:hover,
+.selectize-control.multi .selectize-input.focus {
+ background: #ffffff !important;
+ border-color: rgba(82, 168, 236, 0.8) !important;
+ outline: 0 !important;
+ outline: thin dotted \9 !important;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6) !important;
+ -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6) !important;
+ box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6) !important;
+}
+.selectize-control.single .selectize-input {
+ color: #333333;
+ text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
+ background-color: #f5f5f5;
+ background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
+ background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
+ background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
+ background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
+ background-repeat: repeat-x;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
+ border-color: #e6e6e6 #e6e6e6 #bfbfbf;
+ border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+ *background-color: #e6e6e6;
+ /* Darken IE7 buttons by default so they stand out more given they won't have borders */
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+ -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
+ -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
+ box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
+}
+.selectize-control.single .selectize-input:hover,
+.selectize-control.single .selectize-input:focus,
+.selectize-control.single .selectize-input:active,
+.selectize-control.single .selectize-input.active,
+.selectize-control.single .selectize-input.disabled,
+.selectize-control.single .selectize-input[disabled] {
+ color: #333333;
+ background-color: #e6e6e6;
+ *background-color: #d9d9d9;
+}
+.selectize-control.single .selectize-input:active,
+.selectize-control.single .selectize-input.active {
+ background-color: #cccccc \9;
+}
+.selectize-control.single .selectize-input:hover {
+ color: #333333;
+ text-decoration: none;
+ background-position: 0 -15px;
+ -webkit-transition: background-position 0.1s linear;
+ -moz-transition: background-position 0.1s linear;
+ -o-transition: background-position 0.1s linear;
+ transition: background-position 0.1s linear;
+}
+.selectize-control.single .selectize-input.disabled {
+ background: #e6e6e6 !important;
+ -webkit-box-shadow: none;
+ -moz-box-shadow: none;
+ box-shadow: none;
+}
+.selectize-control.multi .selectize-input {
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+ -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+}
+.selectize-control.multi .selectize-input.has-items {
+ padding-left: 7px;
+ padding-right: 7px;
+}
+.selectize-control.multi .selectize-input > div {
+ color: #333333;
+ text-shadow: none;
+ background-color: #f5f5f5;
+ background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
+ background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
+ background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
+ background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
+ background-repeat: repeat-x;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
+ border-color: #e6e6e6 #e6e6e6 #bfbfbf;
+ border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+ *background-color: #e6e6e6;
+ border: 1px solid #cccccc;
+ -webkit-border-radius: 4px;
+ -moz-border-radius: 4px;
+ border-radius: 4px;
+ -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
+ -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
+ box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
+}
+.selectize-control.multi .selectize-input > div.active {
+ -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.05);
+ -moz-box-shadow: 0 1px 2px rgba(0,0,0,.05);
+ box-shadow: 0 1px 2px rgba(0,0,0,.05);
+ color: #ffffff;
+ text-shadow: none;
+ background-color: #0081c2;
+ background-image: -moz-linear-gradient(top, #0088cc, #0077b3);
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0077b3));
+ background-image: -webkit-linear-gradient(top, #0088cc, #0077b3);
+ background-image: -o-linear-gradient(top, #0088cc, #0077b3);
+ background-image: linear-gradient(to bottom, #0088cc, #0077b3);
+ background-repeat: repeat-x;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0077b3', GradientType=0);
+ border-color: #0077b3 #0077b3 #004466;
+ border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+ *background-color: #0088cc;
+ border: 1px solid #0088cc;
+} \ No newline at end of file
diff --git a/js/jquery/plugins/selectize/selectize.bootstrap3.css b/js/jquery/plugins/selectize/selectize.bootstrap3.css
new file mode 100644
index 000000000..411d8d92e
--- /dev/null
+++ b/js/jquery/plugins/selectize/selectize.bootstrap3.css
@@ -0,0 +1,408 @@
+/**
+ * selectize.bootstrap3.css (v0.12.4) - Bootstrap 3 Theme
+ * Copyright (c) 2013–2015 Brian Reavis & contributors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
+ * file except in compliance with the License. You may obtain a copy of the License at:
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
+ * ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ *
+ * @author Brian Reavis <brian@thirdroute.com>
+ */
+.selectize-control.plugin-drag_drop.multi > .selectize-input > div.ui-sortable-placeholder {
+ visibility: visible !important;
+ background: #f2f2f2 !important;
+ background: rgba(0, 0, 0, 0.06) !important;
+ border: 0 none !important;
+ -webkit-box-shadow: inset 0 0 12px 4px #ffffff;
+ box-shadow: inset 0 0 12px 4px #ffffff;
+}
+.selectize-control.plugin-drag_drop .ui-sortable-placeholder::after {
+ content: '!';
+ visibility: hidden;
+}
+.selectize-control.plugin-drag_drop .ui-sortable-helper {
+ -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
+ box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
+}
+.selectize-dropdown-header {
+ position: relative;
+ padding: 3px 12px;
+ border-bottom: 1px solid #d0d0d0;
+ background: #f8f8f8;
+ -webkit-border-radius: 4px 4px 0 0;
+ -moz-border-radius: 4px 4px 0 0;
+ border-radius: 4px 4px 0 0;
+}
+.selectize-dropdown-header-close {
+ position: absolute;
+ right: 12px;
+ top: 50%;
+ color: #333333;
+ opacity: 0.4;
+ margin-top: -12px;
+ line-height: 20px;
+ font-size: 20px !important;
+}
+.selectize-dropdown-header-close:hover {
+ color: #000000;
+}
+.selectize-dropdown.plugin-optgroup_columns .optgroup {
+ border-right: 1px solid #f2f2f2;
+ border-top: 0 none;
+ float: left;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+}
+.selectize-dropdown.plugin-optgroup_columns .optgroup:last-child {
+ border-right: 0 none;
+}
+.selectize-dropdown.plugin-optgroup_columns .optgroup:before {
+ display: none;
+}
+.selectize-dropdown.plugin-optgroup_columns .optgroup-header {
+ border-top: 0 none;
+}
+.selectize-control.plugin-remove_button [data-value] {
+ position: relative;
+ padding-right: 24px !important;
+}
+.selectize-control.plugin-remove_button [data-value] .remove {
+ z-index: 1;
+ /* fixes ie bug (see #392) */
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ width: 17px;
+ text-align: center;
+ font-weight: bold;
+ font-size: 12px;
+ color: inherit;
+ text-decoration: none;
+ vertical-align: middle;
+ display: inline-block;
+ padding: 1px 0 0 0;
+ border-left: 1px solid rgba(0, 0, 0, 0);
+ -webkit-border-radius: 0 2px 2px 0;
+ -moz-border-radius: 0 2px 2px 0;
+ border-radius: 0 2px 2px 0;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+}
+.selectize-control.plugin-remove_button [data-value] .remove:hover {
+ background: rgba(0, 0, 0, 0.05);
+}
+.selectize-control.plugin-remove_button [data-value].active .remove {
+ border-left-color: rgba(0, 0, 0, 0);
+}
+.selectize-control.plugin-remove_button .disabled [data-value] .remove:hover {
+ background: none;
+}
+.selectize-control.plugin-remove_button .disabled [data-value] .remove {
+ border-left-color: rgba(77, 77, 77, 0);
+}
+.selectize-control.plugin-remove_button .remove-single {
+ position: absolute;
+ right: 28px;
+ top: 6px;
+ font-size: 23px;
+}
+.selectize-control {
+ position: relative;
+}
+.selectize-dropdown,
+.selectize-input,
+.selectize-input input {
+ color: #333333;
+ font-family: inherit;
+ font-size: inherit;
+ line-height: 20px;
+ -webkit-font-smoothing: inherit;
+}
+.selectize-input,
+.selectize-control.single .selectize-input.input-active {
+ background: #ffffff;
+ cursor: text;
+ display: inline-block;
+}
+.selectize-input {
+ border: 1px solid #cccccc;
+ padding: 6px 12px;
+ display: inline-block;
+ width: 100%;
+ overflow: hidden;
+ position: relative;
+ z-index: 1;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ -webkit-border-radius: 4px;
+ -moz-border-radius: 4px;
+ border-radius: 4px;
+}
+.selectize-control.multi .selectize-input.has-items {
+ padding: 5px 12px 2px;
+}
+.selectize-input.full {
+ background-color: #ffffff;
+}
+.selectize-input.disabled,
+.selectize-input.disabled * {
+ cursor: default !important;
+}
+.selectize-input.focus {
+ -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
+ box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
+}
+.selectize-input.dropdown-active {
+ -webkit-border-radius: 4px 4px 0 0;
+ -moz-border-radius: 4px 4px 0 0;
+ border-radius: 4px 4px 0 0;
+}
+.selectize-input > * {
+ vertical-align: baseline;
+ display: -moz-inline-stack;
+ display: inline-block;
+ zoom: 1;
+ *display: inline;
+}
+.selectize-control.multi .selectize-input > div {
+ cursor: pointer;
+ margin: 0 3px 3px 0;
+ padding: 1px 3px;
+ background: #efefef;
+ color: #333333;
+ border: 0 solid rgba(0, 0, 0, 0);
+}
+.selectize-control.multi .selectize-input > div.active {
+ background: #428bca;
+ color: #ffffff;
+ border: 0 solid rgba(0, 0, 0, 0);
+}
+.selectize-control.multi .selectize-input.disabled > div,
+.selectize-control.multi .selectize-input.disabled > div.active {
+ color: #808080;
+ background: #ffffff;
+ border: 0 solid rgba(77, 77, 77, 0);
+}
+.selectize-input > input {
+ display: inline-block !important;
+ padding: 0 !important;
+ min-height: 0 !important;
+ max-height: none !important;
+ max-width: 100% !important;
+ margin: 0 !important;
+ text-indent: 0 !important;
+ border: 0 none !important;
+ background: none !important;
+ line-height: inherit !important;
+ -webkit-user-select: auto !important;
+ -webkit-box-shadow: none !important;
+ box-shadow: none !important;
+}
+.selectize-input > input::-ms-clear {
+ display: none;
+}
+.selectize-input > input:focus {
+ outline: none !important;
+}
+.selectize-input::after {
+ content: ' ';
+ display: block;
+ clear: left;
+}
+.selectize-input.dropdown-active::before {
+ content: ' ';
+ display: block;
+ position: absolute;
+ background: #ffffff;
+ height: 1px;
+ bottom: 0;
+ left: 0;
+ right: 0;
+}
+.selectize-dropdown {
+ position: absolute;
+ z-index: 10;
+ border: 1px solid #d0d0d0;
+ background: #ffffff;
+ margin: -1px 0 0 0;
+ border-top: 0 none;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+ -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+ -webkit-border-radius: 0 0 4px 4px;
+ -moz-border-radius: 0 0 4px 4px;
+ border-radius: 0 0 4px 4px;
+}
+.selectize-dropdown [data-selectable] {
+ cursor: pointer;
+ overflow: hidden;
+}
+.selectize-dropdown [data-selectable] .highlight {
+ background: rgba(255, 237, 40, 0.4);
+ -webkit-border-radius: 1px;
+ -moz-border-radius: 1px;
+ border-radius: 1px;
+}
+.selectize-dropdown [data-selectable],
+.selectize-dropdown .optgroup-header {
+ padding: 3px 12px;
+}
+.selectize-dropdown .optgroup:first-child .optgroup-header {
+ border-top: 0 none;
+}
+.selectize-dropdown .optgroup-header {
+ color: #777777;
+ background: #ffffff;
+ cursor: default;
+}
+.selectize-dropdown .active {
+ background-color: #f5f5f5;
+ color: #262626;
+}
+.selectize-dropdown .active.create {
+ color: #262626;
+}
+.selectize-dropdown .create {
+ color: rgba(51, 51, 51, 0.5);
+}
+.selectize-dropdown-content {
+ overflow-y: auto;
+ overflow-x: hidden;
+ max-height: 200px;
+ -webkit-overflow-scrolling: touch;
+}
+.selectize-control.single .selectize-input,
+.selectize-control.single .selectize-input input {
+ cursor: pointer;
+}
+.selectize-control.single .selectize-input.input-active,
+.selectize-control.single .selectize-input.input-active input {
+ cursor: text;
+}
+.selectize-control.single .selectize-input:after {
+ content: ' ';
+ display: block;
+ position: absolute;
+ top: 50%;
+ right: 17px;
+ margin-top: -3px;
+ width: 0;
+ height: 0;
+ border-style: solid;
+ border-width: 5px 5px 0 5px;
+ border-color: #333333 transparent transparent transparent;
+}
+.selectize-control.single .selectize-input.dropdown-active:after {
+ margin-top: -4px;
+ border-width: 0 5px 5px 5px;
+ border-color: transparent transparent #333333 transparent;
+}
+.selectize-control.rtl.single .selectize-input:after {
+ left: 17px;
+ right: auto;
+}
+.selectize-control.rtl .selectize-input > input {
+ margin: 0 4px 0 -2px !important;
+}
+.selectize-control .selectize-input.disabled {
+ opacity: 0.5;
+ background-color: #ffffff;
+}
+.selectize-dropdown,
+.selectize-dropdown.form-control {
+ height: auto;
+ padding: 0;
+ margin: 2px 0 0 0;
+ z-index: 1000;
+ background: #ffffff;
+ border: 1px solid #cccccc;
+ border: 1px solid rgba(0, 0, 0, 0.15);
+ -webkit-border-radius: 4px;
+ -moz-border-radius: 4px;
+ border-radius: 4px;
+ -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+ box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+}
+.selectize-dropdown .optgroup-header {
+ font-size: 12px;
+ line-height: 1.42857143;
+}
+.selectize-dropdown .optgroup:first-child:before {
+ display: none;
+}
+.selectize-dropdown .optgroup:before {
+ content: ' ';
+ display: block;
+ height: 1px;
+ margin: 9px 0;
+ overflow: hidden;
+ background-color: #e5e5e5;
+ margin-left: -12px;
+ margin-right: -12px;
+}
+.selectize-dropdown-content {
+ padding: 5px 0;
+}
+.selectize-dropdown-header {
+ padding: 6px 12px;
+}
+.selectize-input {
+ min-height: 34px;
+}
+.selectize-input.dropdown-active {
+ -webkit-border-radius: 4px;
+ -moz-border-radius: 4px;
+ border-radius: 4px;
+}
+.selectize-input.dropdown-active::before {
+ display: none;
+}
+.selectize-input.focus {
+ border-color: #66afe9;
+ outline: 0;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
+ box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
+}
+.has-error .selectize-input {
+ border-color: #a94442;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+}
+.has-error .selectize-input:focus {
+ border-color: #843534;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
+}
+.selectize-control.multi .selectize-input.has-items {
+ padding-left: 9px;
+ padding-right: 9px;
+}
+.selectize-control.multi .selectize-input > div {
+ -webkit-border-radius: 3px;
+ -moz-border-radius: 3px;
+ border-radius: 3px;
+}
+.form-control.selectize-control {
+ padding: 0;
+ height: auto;
+ border: none;
+ background: none;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ -webkit-border-radius: 0;
+ -moz-border-radius: 0;
+ border-radius: 0;
+} \ No newline at end of file
diff --git a/js/jquery/plugins/selectize/selectize.css b/js/jquery/plugins/selectize/selectize.css
new file mode 100644
index 000000000..96d0e1934
--- /dev/null
+++ b/js/jquery/plugins/selectize/selectize.css
@@ -0,0 +1,324 @@
+/**
+ * selectize.css (v0.12.4)
+ * Copyright (c) 2013–2015 Brian Reavis & contributors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
+ * file except in compliance with the License. You may obtain a copy of the License at:
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
+ * ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ *
+ * @author Brian Reavis <brian@thirdroute.com>
+ */
+
+.selectize-control.plugin-drag_drop.multi > .selectize-input > div.ui-sortable-placeholder {
+ visibility: visible !important;
+ background: #f2f2f2 !important;
+ background: rgba(0, 0, 0, 0.06) !important;
+ border: 0 none !important;
+ -webkit-box-shadow: inset 0 0 12px 4px #ffffff;
+ box-shadow: inset 0 0 12px 4px #ffffff;
+}
+.selectize-control.plugin-drag_drop .ui-sortable-placeholder::after {
+ content: '!';
+ visibility: hidden;
+}
+.selectize-control.plugin-drag_drop .ui-sortable-helper {
+ -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
+ box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
+}
+.selectize-dropdown-header {
+ position: relative;
+ padding: 5px 8px;
+ border-bottom: 1px solid #d0d0d0;
+ background: #f8f8f8;
+ -webkit-border-radius: 3px 3px 0 0;
+ -moz-border-radius: 3px 3px 0 0;
+ border-radius: 3px 3px 0 0;
+}
+.selectize-dropdown-header-close {
+ position: absolute;
+ right: 8px;
+ top: 50%;
+ color: #303030;
+ opacity: 0.4;
+ margin-top: -12px;
+ line-height: 20px;
+ font-size: 20px !important;
+}
+.selectize-dropdown-header-close:hover {
+ color: #000000;
+}
+.selectize-dropdown.plugin-optgroup_columns .optgroup {
+ border-right: 1px solid #f2f2f2;
+ border-top: 0 none;
+ float: left;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+}
+.selectize-dropdown.plugin-optgroup_columns .optgroup:last-child {
+ border-right: 0 none;
+}
+.selectize-dropdown.plugin-optgroup_columns .optgroup:before {
+ display: none;
+}
+.selectize-dropdown.plugin-optgroup_columns .optgroup-header {
+ border-top: 0 none;
+}
+.selectize-control.plugin-remove_button [data-value] {
+ position: relative;
+ padding-right: 24px !important;
+}
+.selectize-control.plugin-remove_button [data-value] .remove {
+ z-index: 1;
+ /* fixes ie bug (see #392) */
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ width: 17px;
+ text-align: center;
+ font-weight: bold;
+ font-size: 12px;
+ color: inherit;
+ text-decoration: none;
+ vertical-align: middle;
+ display: inline-block;
+ padding: 2px 0 0 0;
+ border-left: 1px solid #d0d0d0;
+ -webkit-border-radius: 0 2px 2px 0;
+ -moz-border-radius: 0 2px 2px 0;
+ border-radius: 0 2px 2px 0;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+}
+.selectize-control.plugin-remove_button [data-value] .remove:hover {
+ background: rgba(0, 0, 0, 0.05);
+}
+.selectize-control.plugin-remove_button [data-value].active .remove {
+ border-left-color: #cacaca;
+}
+.selectize-control.plugin-remove_button .disabled [data-value] .remove:hover {
+ background: none;
+}
+.selectize-control.plugin-remove_button .disabled [data-value] .remove {
+ border-left-color: #ffffff;
+}
+.selectize-control.plugin-remove_button .remove-single {
+ position: absolute;
+ right: 28px;
+ top: 6px;
+ font-size: 23px;
+}
+.selectize-control {
+ position: relative;
+}
+.selectize-dropdown,
+.selectize-input,
+.selectize-input input {
+ color: #303030;
+ font-family: inherit;
+ font-size: 13px;
+ line-height: 18px;
+ -webkit-font-smoothing: inherit;
+}
+.selectize-input,
+.selectize-control.single .selectize-input.input-active {
+ background: #ffffff;
+ cursor: text;
+ display: inline-block;
+}
+.selectize-input {
+ border: 1px solid #d0d0d0;
+ padding: 8px 8px;
+ display: inline-block;
+ width: 100%;
+ overflow: hidden;
+ position: relative;
+ z-index: 1;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
+ -webkit-border-radius: 3px;
+ -moz-border-radius: 3px;
+ border-radius: 3px;
+}
+.selectize-control.multi .selectize-input.has-items {
+ padding: 6px 8px 3px;
+}
+.selectize-input.full {
+ background-color: #ffffff;
+}
+.selectize-input.disabled,
+.selectize-input.disabled * {
+ cursor: default !important;
+}
+.selectize-input.focus {
+ -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
+ box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
+}
+.selectize-input.dropdown-active {
+ -webkit-border-radius: 3px 3px 0 0;
+ -moz-border-radius: 3px 3px 0 0;
+ border-radius: 3px 3px 0 0;
+}
+.selectize-input > * {
+ vertical-align: baseline;
+ display: -moz-inline-stack;
+ display: inline-block;
+ zoom: 1;
+ *display: inline;
+}
+.selectize-control.multi .selectize-input > div {
+ cursor: pointer;
+ margin: 0 3px 3px 0;
+ padding: 2px 6px;
+ background: #f2f2f2;
+ color: #303030;
+ border: 0 solid #d0d0d0;
+}
+.selectize-control.multi .selectize-input > div.active {
+ background: #e8e8e8;
+ color: #303030;
+ border: 0 solid #cacaca;
+}
+.selectize-control.multi .selectize-input.disabled > div,
+.selectize-control.multi .selectize-input.disabled > div.active {
+ color: #7d7d7d;
+ background: #ffffff;
+ border: 0 solid #ffffff;
+}
+.selectize-input > input {
+ display: inline-block !important;
+ padding: 0 !important;
+ min-height: 0 !important;
+ max-height: none !important;
+ max-width: 100% !important;
+ margin: 0 2px 0 0 !important;
+ text-indent: 0 !important;
+ border: 0 none !important;
+ background: none !important;
+ line-height: inherit !important;
+ -webkit-user-select: auto !important;
+ -webkit-box-shadow: none !important;
+ box-shadow: none !important;
+}
+.selectize-input > input::-ms-clear {
+ display: none;
+}
+.selectize-input > input:focus {
+ outline: none !important;
+}
+.selectize-input::after {
+ content: ' ';
+ display: block;
+ clear: left;
+}
+.selectize-input.dropdown-active::before {
+ content: ' ';
+ display: block;
+ position: absolute;
+ background: #f0f0f0;
+ height: 1px;
+ bottom: 0;
+ left: 0;
+ right: 0;
+}
+.selectize-dropdown {
+ position: absolute;
+ z-index: 10;
+ border: 1px solid #d0d0d0;
+ background: #ffffff;
+ margin: -1px 0 0 0;
+ border-top: 0 none;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+ -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+ -webkit-border-radius: 0 0 3px 3px;
+ -moz-border-radius: 0 0 3px 3px;
+ border-radius: 0 0 3px 3px;
+}
+.selectize-dropdown [data-selectable] {
+ cursor: pointer;
+ overflow: hidden;
+}
+.selectize-dropdown [data-selectable] .highlight {
+ background: rgba(125, 168, 208, 0.2);
+ -webkit-border-radius: 1px;
+ -moz-border-radius: 1px;
+ border-radius: 1px;
+}
+.selectize-dropdown [data-selectable],
+.selectize-dropdown .optgroup-header {
+ padding: 5px 8px;
+}
+.selectize-dropdown .optgroup:first-child .optgroup-header {
+ border-top: 0 none;
+}
+.selectize-dropdown .optgroup-header {
+ color: #303030;
+ background: #ffffff;
+ cursor: default;
+}
+.selectize-dropdown .active {
+ background-color: #f5fafd;
+ color: #495c68;
+}
+.selectize-dropdown .active.create {
+ color: #495c68;
+}
+.selectize-dropdown .create {
+ color: rgba(48, 48, 48, 0.5);
+}
+.selectize-dropdown-content {
+ overflow-y: auto;
+ overflow-x: hidden;
+ max-height: 200px;
+ -webkit-overflow-scrolling: touch;
+}
+.selectize-control.single .selectize-input,
+.selectize-control.single .selectize-input input {
+ cursor: pointer;
+}
+.selectize-control.single .selectize-input.input-active,
+.selectize-control.single .selectize-input.input-active input {
+ cursor: text;
+}
+.selectize-control.single .selectize-input:after {
+ content: ' ';
+ display: block;
+ position: absolute;
+ top: 50%;
+ right: 15px;
+ margin-top: -3px;
+ width: 0;
+ height: 0;
+ border-style: solid;
+ border-width: 5px 5px 0 5px;
+ border-color: #808080 transparent transparent transparent;
+}
+.selectize-control.single .selectize-input.dropdown-active:after {
+ margin-top: -4px;
+ border-width: 0 5px 5px 5px;
+ border-color: transparent transparent #808080 transparent;
+}
+.selectize-control.rtl.single .selectize-input:after {
+ left: 15px;
+ right: auto;
+}
+.selectize-control.rtl .selectize-input > input {
+ margin: 0 4px 0 -2px !important;
+}
+.selectize-control .selectize-input.disabled {
+ opacity: 0.5;
+ background-color: #fafafa;
+} \ No newline at end of file
diff --git a/template/en/default/bug/new_bug.html.tmpl b/template/en/default/bug/new_bug.html.tmpl
index 814c6b9b9..83ec1e924 100644
--- a/template/en/default/bug/new_bug.html.tmpl
+++ b/template/en/default/bug/new_bug.html.tmpl
@@ -10,185 +10,175 @@
[% PROCESS bug_modal/common_header.html.tmpl
title = title
jquery = [ "selectize" ]
- jquery_css = [ "js/jquery/plugins/selectize/selectize.default.css" ]
+ jquery_css = [ "js/jquery/plugins/selectize/selectize.bootstrap3.css" ]
javascript_urls = ['extensions/BugModal/web/new_bug.js']
style_urls = ['extensions/BugModal/web/new_bug.css']
%]
[% PROCESS global/header.html.tmpl %]
-<p>Coming Soon!</p>
-<p>This is a demonstration of a reusable comment component</p>
-<form name="newbugform" id="newbugform" method="post" action="new_bug.cgi">
-
-<input type="hidden" value="[% issue_hash_token(['new_bug']) FILTER html %]" name="token">
-
-[% WRAPPER bug_modal/module.html.tmpl
- title = ""
-%]
- <div id="summary-container">
- [%# summary %]
- [% INCLUDE bug_modal/field.html.tmpl
- field = bug_fields.short_desc
- field_type = constants.FIELD_TYPE_FREETEXT
- edit_only = 1
- editable = 1
- required = 1
- help = "https://wiki.mozilla.org/BMO/UserGuide/BugFields#short_desc"
- %]
-
- </div>
- <div id="mode-container">
- <div id="user-guide">
- <a title="User guide for [% terms.Bugzilla %]" href="#">Get help with this page</a>
- </div>
- </div>
-[%END%]
-
-
-[%# === status === %]
-
-[% WRAPPER bug_modal/module.html.tmpl
- title = "Status"
-%]
- [% WRAPPER fields_lhs %]
-
- [%# product %]
- [% can_edit_product = bug.check_can_change_field("product", 0, 1) %]
- [% filtered_product = bug.product_obj.name FILTER uri %]
- [% filtered_component = bug.component_obj.name FILTER uri %]
- [% WRAPPER bug_modal/field.html.tmpl
- field = bug_fields.product
- field_type = constants.FIELD_TYPE_SINGLE_SELECT
- edit_only = 1
- editable = 1
- help = "describecomponents.cgi?product=$filtered_product"
- %]
- <span aria-owns="product-name product-latch">
- <span role="button" aria-label="show product information" aria-expanded="false" tabindex="0"
- class="spin-latch" id="product-latch" data-latch="product" data-for="product">&#9656;</span>
- <div title="show product information" tabindex="0" class="spin-toggle"
- id="product-name" data-latch="product" data-for="product">
- [% bug.product FILTER html %]
+[% IF user.id %]
+ <div style="display: none" id="xhr-error"></div>
+ <form name="newbugform" id="newbugform" method="post" action="new_bug.cgi">
+ <input type="hidden" value="[% issue_hash_token(['new_bug']) FILTER html %]" name="token">
+ <div class="new-bug-container">
+ <div class="new-bug">
+ <div class="new-bug-pad">
</div>
- <div id="product-info" style="display:none">
- [% bug.product_obj.description FILTER html_light %]
+ <div class="new-bug-title">
+ <h2>Create New [% terms.Bug %]</h2>
+ <p>Before reporting a bug, make sure you've read our
+ <a href="https://developer.mozilla.org/en/Bug_writing_guidelines">bug writing guidelines</a> and double checked that your bug hasn't already
+ been reported. Consult our list of <a href="https://bugzilla.mozilla.org/duplicates.cgi">
+ most frequently reported bugs</a> and <a href="https://bugzilla.mozilla.org/query.cgi">
+ search through descriptions</a> of previously reported bugs.
+ </p>
</div>
- </span>
- [% END %]
- [% WRAPPER bug_modal/field.html.tmpl
- field = bug_fields.product
- field_type = constants.FIELD_TYPE_SINGLE_SELECT
- hide_on_view = 1
- hide_on_edit = !can_edit_product
- append_content = 1
- help = "describecomponents.cgi?product=$filtered_product"
- %]
- <span id="product-search-container">
- [% INCLUDE prodcompsearch/form.html.tmpl
- id = "pcs"
- custom_select = 1
- hidden = 1
- throbber = "product-throbber"
- %]
- <button id="product-search" type="button" class="minor">Search</button>
- <button id="product-search-cancel" type="button" class="minor" style="display:none">X</button>
- <img id="product-throbber" src="extensions/BugModal/web/throbber.gif"
- width="16" height="11" style="display:none">
- <img id="product-search-error" class="tt" src="extensions/BugModal/web/error.png"
- width="16" height="16" style="display:none">
- </span>
- [% END %]
-
- [%# component %]
- [% WRAPPER bug_modal/field.html.tmpl
- field = bug_fields.component
- field_type = constants.FIELD_TYPE_SINGLE_SELECT
- help = "describecomponents.cgi?product=$filtered_product&component=$filtered_component#$filtered_component"
- edit_only = 1
- editable = 1
- %]
- <span aria-owns="component-name component-latch">
- <span role="button" aria-label="show component description" aria-expanded="false" tabindex="0"
- class="spin-latch" id="component-latch" data-latch="component" data-for="component">&#9656;</span>
- <div title="show component information" tabindex="0" class="spin-toggle" id="component-name"
- data-latch="#component-latch" data-for="component">
- [% bug.component FILTER html %]
+ <div class="new-bug-pad">
</div>
- <div id="component-info" style="display:none">
- <div>[% bug.component_obj.description FILTER html_light %]</div>
- <a href="buglist.cgi?component=[% bug.component FILTER uri %]&amp;
- [%~ %]product=[% bug.product FILTER uri %]&amp;
- [%~ %]bug_status=__open__" target="_blank">Other [% terms.Bugs %]</a>
+ </div>
+ <div class="new-bug">
+ <div class="new-bug-pad">
</div>
- </span>
- [% END %]
- [% END %]
- [% WRAPPER fields_rhs %]
- <td colspan="2" id="comp_desc_container">
- <table>
- <tr>
- <td>
- <fieldset>
- <legend>Component Description</legend>
- <div id="comp_desc" class="comment">Select a component to read its description.</div>
- </fieldset>
- </td>
- </tr>
- </table>
- </td>
- [% END %]
+ <div class="new-bug-split-2">
+ [% WRAPPER bug_modal/module.html.tmpl title = "" %]
+ [%# summary %]
+ [% INCLUDE bug_modal/field.html.tmpl
+ field = bug_fields.short_desc
+ field_type = constants.FIELD_TYPE_FREETEXT
+ edit_only = 1
+ editable = 1
+ required = 1
+ help = "https://wiki.mozilla.org/BMO/UserGuide/BugFields#short_desc"
+ %]
+
+ [% INCLUDE bug_modal/common_new_comment.html.tmpl disable_cols=1 %]
+ [% END %]
+ [% WRAPPER bug_modal/module.html.tmpl title = "Attach a File" collapsed = 1 %]
+ <p>Coming Soon.</p>
+ [% END %]
+ <button type="submit" id="create-btn" class="create-btn major">Submit</button>
+ </div>
+ <div class="new-bug-split-1">
+ [% WRAPPER bug_modal/module.html.tmpl title = "Status" %]
+ [% can_edit_product = bug.check_can_change_field("product", 0, 1) %]
+ [% filtered_product = bug.product_obj.name FILTER uri %]
+ [% filtered_component = bug.component_obj.name FILTER uri %]
+
+ [% WRAPPER bug_modal/field.html.tmpl
+ field = bug_fields.product
+ field_type = constants.FIELD_TYPE_SINGLE_SELECT
+ edit_only = 1
+ editable = 1
+ help = "describecomponents.cgi?product=$filtered_product"
+ %]
+ <span aria-owns="product-name product-latch">
+ <span role="button" aria-label="show product information" aria-expanded="false" tabindex="0"
+ class="spin-latch" id="product-latch" data-latch="product" data-for="product">&#9656;</span>
+ <div title="show product information" tabindex="0" class="spin-toggle"
+ id="product-name" data-latch="product" data-for="product">
+ [% bug.product FILTER html %]
+ </div>
+ <div id="product-info" style="display:none">
+ [% bug.product_obj.description FILTER html_light %]
+ </div>
+ </span>
+ [% END %]
+
+ [% WRAPPER bug_modal/field.html.tmpl
+ field = bug_fields.product
+ field_type = constants.FIELD_TYPE_SINGLE_SELECT
+ hide_on_view = 1
+ hide_on_edit = !can_edit_product
+ append_content = 1
+ help = "describecomponents.cgi?product=$filtered_product"
+ %]
+ <span id="product-search-container">
+ [% INCLUDE prodcompsearch/form.html.tmpl
+ id = "pcs"
+ custom_select = 1
+ hidden = 1
+ throbber = "product-throbber"
+ %]
+ <button id="product-search" type="button" class="minor">Search</button>
+ <button id="product-search-cancel" type="button" class="minor" style="display:none">X</button>
+ <img id="product-throbber" src="extensions/BugModal/web/throbber.gif"
+ width="16" height="11" style="display:none">
+ <img id="product-search-error" class="tt" src="extensions/BugModal/web/error.png"
+ width="16" height="16" style="display:none">
+ </span>
+ [% END %]
+
+ [%# component %]
+ [% WRAPPER bug_modal/field.html.tmpl
+ field = bug_fields.component
+ field_type = constants.FIELD_TYPE_SINGLE_SELECT
+ help = "describecomponents.cgi?product=$filtered_product&component=$filtered_component#$filtered_component"
+ edit_only = 1
+ editable = 1
+ %]
+ <span aria-owns="component-name component-latch">
+ <span role="button" aria-label="show component description" aria-expanded="false" tabindex="0"
+ class="spin-latch" id="component-latch" data-latch="component" data-for="component">&#9656;</span>
+ <div title="show component information" tabindex="0" class="spin-toggle" id="component-name"
+ data-latch="#component-latch" data-for="component">
+ [% bug.component FILTER html %]
+ </div>
+ <div id="component-info" style="display:none">
+ <div>[% bug.component_obj.description FILTER html_light %]</div>
+ <a href="buglist.cgi?component=[% bug.component FILTER uri %]&amp;
+ [%~ %]product=[% bug.product FILTER uri %]&amp;
+ [%~ %]bug_status=__open__" target="_blank">Other [% terms.Bugs %]</a>
+ </div>
+ </span>
+ [% END %]
+
+ [% INCLUDE bug_modal/field.html.tmpl
+ field = bug_fields.version
+ field_type = constants.FIELD_TYPE_SINGLE_SELECT
+ help = "https://wiki.mozilla.org/BMO/UserGuide/BugFields#version"
+ edit_only = 1
+ editable = 1
+ %]
+ [% END %]
+ [% WRAPPER bug_modal/module.html.tmpl title = "Labels" %]
+ [%# keywords %]
+ [% INCLUDE bug_modal/field.html.tmpl
+ field = bug_fields.keywords
+ field_type = constants.FIELD_TYPE_MULTI_SELECT
+ edit_only = 1
+ editable = 1
+ help = "describekeywords.cgi"
+ %]
+
+ [% WRAPPER bug_modal/field.html.tmpl
+ field = bug_fields.status_whiteboard
+ field_type = constants.FIELD_TYPE_FREETEXT
+ help = "https://wiki.mozilla.org/BMO/UserGuide/Whiteboard"
+ edit_only = 1
+ editable = 1
+ %]
+ [% bug.status_whiteboard == "" ? "---" : bug.status_whiteboard FILTER html %]
+ [% END %]
+ [% END %]
+ </div>
+ <div class="new-bug-pad">
+ </div>
+ </div>
+ </div>
+ </form>
+[% ELSE %]
+ <div id="new-comment-notice">
+ You need to <a href="new-bug&amp;GoAheadAndLogIn=1">log in</a>
+ before you can file a [% terms.bug %].
+ </div>
[% END %]
-[%# === tracking === %]
-
-[% WRAPPER bug_modal/module.html.tmpl
- title = "Tracking"
- subtitle = sub
- collapsed = col
-%]
- [% WRAPPER fields_lhs %]
-
- [%# version %]
- [% INCLUDE bug_modal/field.html.tmpl
- field = bug_fields.version
- field_type = constants.FIELD_TYPE_SINGLE_SELECT
- help = "https://wiki.mozilla.org/BMO/UserGuide/BugFields#version"
- edit_only = 1
- editable = 1
- %]
- [%# keywords %]
- [% INCLUDE bug_modal/field.html.tmpl
- field = bug_fields.keywords
- field_type = constants.FIELD_TYPE_MULTI_SELECT
- edit_only = 1
- editable = 1
- help = "describekeywords.cgi"
- %]
- [% END %]
-[% END %]
+[% PROCESS global/footer.html.tmpl %]
[% BLOCK fields_lhs %]
- <div class="fields-lhs">[% content FILTER none %]</div>
+ <div class="fields-lhs">[% content FILTER none %]</div>
[% END %]
[% BLOCK fields_rhs %]
- <div class="fields-rhs">[% content FILTER none %]</div>
+ <div class="fields-rhs">[% content FILTER none %]</div>
[% END %]
-
-[%
- IF user.id;
- INCLUDE bug_modal/common_new_comment.html.tmpl;
- ELSE;
- %]
- <div id="new-comment-notice">
- You need to <a href="new-bug&amp;GoAheadAndLogIn=1">log in</a>
- before you can file a [% terms.bug %].
- </div>
- [%
- END;
- %]
-
-<div style="display: none" id="xhr-error"></div>
-<button type="submit" id="create-btn" class="create-btn major">Create New [% terms.Bug %]</button>
-</form>
-[% PROCESS global/footer.html.tmpl %] \ No newline at end of file