mirror of
https://github.com/prymitive/karma
synced 2026-05-05 03:16:51 +00:00
Provide .less style for bootstrap-tagsinput
We use flatly theme for bootstrap while bootstrap-tagsinput bundles a css file that follow vanilla style, create a less version and use it instead of the css one bundles with bootstrap-tagsinput. typeahead.js allows to customize class names used for UI elements, but bootstrap-tagsinput doesn't support passing that and is no longer maintained, so we need to follow default typeahead.js classes.
This commit is contained in:
@@ -353,17 +353,6 @@ button.silence-delete:focus {
|
||||
background-color: #e74c3c;
|
||||
}
|
||||
|
||||
/* tweak typeahead look for flatly */
|
||||
.tt-cursor,
|
||||
.tt-suggestion:hover,
|
||||
.tt-suggestion:focus {
|
||||
color: #ffffff;
|
||||
text-decoration: none;
|
||||
outline: 0;
|
||||
background-color: #2c3e50;
|
||||
}
|
||||
|
||||
|
||||
/* tweak nprogress look for flatly */
|
||||
#nprogress .nprogress-flatly.bar {
|
||||
background: #f39c12;
|
||||
|
||||
53
assets/static/bootstrap-tagsinput.less
vendored
Normal file
53
assets/static/bootstrap-tagsinput.less
vendored
Normal file
@@ -0,0 +1,53 @@
|
||||
// lessified version of https://github.com/bootstrap-tagsinput/bootstrap-tagsinput/blob/master/src/bootstrap-tagsinput-typeahead.css
|
||||
|
||||
@import "bootstrap/less/variables.less";
|
||||
|
||||
.twitter-typeahead .tt-query,
|
||||
.twitter-typeahead .tt-hint {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.twitter-typeahead .tt-hint {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.tt-menu {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
z-index: @zindex-dropdown;
|
||||
display: none;
|
||||
float: left;
|
||||
min-width: 160px;
|
||||
padding: 5px 0;
|
||||
margin: 2px 0 0;
|
||||
list-style: none;
|
||||
font-size: @font-size-base;
|
||||
background-color: @dropdown-bg;
|
||||
border: 1px solid @dropdown-fallback-border;
|
||||
border: 1px solid @dropdown-border;
|
||||
border-radius: @border-radius-base;
|
||||
-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
|
||||
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
|
||||
background-clip: padding-box;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.tt-suggestion {
|
||||
display: block;
|
||||
padding: 3px 20px;
|
||||
clear: both;
|
||||
font-weight: normal;
|
||||
line-height: @line-height-base;
|
||||
color: @dropdown-link-color;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.tt-cursor,
|
||||
.tt-suggestion:hover,
|
||||
.tt-suggestion:focus {
|
||||
color: @dropdown-link-hover-color;
|
||||
text-decoration: none;
|
||||
outline: 0;
|
||||
background-color: @dropdown-link-hover-bg;
|
||||
}
|
||||
@@ -8,7 +8,7 @@ require("./jquery.typing-0.3.2.js");
|
||||
require("corejs-typeahead");
|
||||
require("bootstrap-tagsinput");
|
||||
require("bootstrap-tagsinput/dist/bootstrap-tagsinput.css");
|
||||
require("bootstrap-tagsinput/dist/bootstrap-tagsinput-typeahead.css");
|
||||
require("./bootstrap-tagsinput.less");
|
||||
|
||||
const autocomplete = require("./autocomplete");
|
||||
const unsee = require("./unsee");
|
||||
|
||||
Reference in New Issue
Block a user