123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214 |
- /*!
- * Bootstrap Colorpicker
- * http://mjolnic.github.io/bootstrap-colorpicker/
- *
- * Originally written by (c) 2012 Stefan Petre
- * Licensed under the Apache License v2.0
- * http://www.apache.org/licenses/LICENSE-2.0.txt
- *
- */
- .colorpicker-saturation {
- float: left;
- width: 100px;
- height: 100px;
- cursor: crosshair;
- background-image: url("img/saturation.png");
- }
- .colorpicker-saturation i {
- position: absolute;
- top: 0;
- left: 0;
- display: block;
- width: 5px;
- height: 5px;
- margin: -4px 0 0 -4px;
- border: 1px solid #000;
- -webkit-border-radius: 5px;
- -moz-border-radius: 5px;
- border-radius: 5px;
- }
- .colorpicker-saturation i b {
- display: block;
- width: 5px;
- height: 5px;
- border: 1px solid #fff;
- -webkit-border-radius: 5px;
- -moz-border-radius: 5px;
- border-radius: 5px;
- }
- .colorpicker-hue,
- .colorpicker-alpha {
- float: left;
- width: 15px;
- height: 100px;
- margin-bottom: 4px;
- margin-left: 4px;
- cursor: row-resize;
- }
- .colorpicker-hue i,
- .colorpicker-alpha i {
- position: absolute;
- top: 0;
- left: 0;
- display: block;
- width: 100%;
- height: 1px;
- margin-top: -1px;
- background: #000;
- border-top: 1px solid #fff;
- }
- .colorpicker-hue {
- background-image: url("img/hue.png");
- }
- .colorpicker-alpha {
- display: none;
- background-image: url("img/alpha.png");
- }
- .colorpicker {
- top: 0;
- left: 0;
- z-index: 2500;
- min-width: 130px;
- padding: 4px;
- margin-top: 1px;
- -webkit-border-radius: 4px;
- -moz-border-radius: 4px;
- border-radius: 4px;
- *zoom: 1;
- }
- .colorpicker:before,
- .colorpicker:after {
- display: table;
- line-height: 0;
- content: "";
- }
- .colorpicker:after {
- clear: both;
- }
- .colorpicker:before {
- position: absolute;
- top: -7px;
- left: 6px;
- display: inline-block;
- border-right: 7px solid transparent;
- border-bottom: 7px solid #ccc;
- border-left: 7px solid transparent;
- border-bottom-color: rgba(0, 0, 0, 0.2);
- content: '';
- }
- .colorpicker:after {
- position: absolute;
- top: -6px;
- left: 7px;
- display: inline-block;
- border-right: 6px solid transparent;
- border-bottom: 6px solid #ffffff;
- border-left: 6px solid transparent;
- content: '';
- }
- .colorpicker div {
- position: relative;
- }
- .colorpicker.colorpicker-with-alpha {
- min-width: 140px;
- }
- .colorpicker.colorpicker-with-alpha .colorpicker-alpha {
- display: block;
- }
- .colorpicker-color {
- height: 10px;
- margin-top: 5px;
- clear: both;
- background-image: url("img/alpha.png");
- background-position: 0 100%;
- }
- .colorpicker-color div {
- height: 10px;
- }
- .colorpicker-element .input-group-addon i {
- display: block;
- width: 16px;
- height: 16px;
- cursor: pointer;
- }
- .colorpicker.colorpicker-inline {
- position: relative;
- display: inline-block;
- float: none;
- }
- .colorpicker.colorpicker-horizontal {
- width: 110px;
- height: auto;
- min-width: 110px;
- }
- .colorpicker.colorpicker-horizontal .colorpicker-saturation {
- margin-bottom: 4px;
- }
- .colorpicker.colorpicker-horizontal .colorpicker-color {
- width: 100px;
- }
- .colorpicker.colorpicker-horizontal .colorpicker-hue,
- .colorpicker.colorpicker-horizontal .colorpicker-alpha {
- float: left;
- width: 100px;
- height: 15px;
- margin-bottom: 4px;
- margin-left: 0;
- cursor: col-resize;
- }
- .colorpicker.colorpicker-horizontal .colorpicker-hue i,
- .colorpicker.colorpicker-horizontal .colorpicker-alpha i {
- position: absolute;
- top: 0;
- left: 0;
- display: block;
- width: 1px;
- height: 15px;
- margin-top: 0;
- background: #ffffff;
- border: none;
- }
- .colorpicker.colorpicker-horizontal .colorpicker-hue {
- background-image: url("img/hue-horizontal.png");
- }
- .colorpicker.colorpicker-horizontal .colorpicker-alpha {
- background-image: url("img/alpha-horizontal.png");
- }
- .colorpicker.colorpicker-hidden {
- display: none;
- }
- .colorpicker.colorpicker-visible {
- display: block;
- }
- .colorpicker-inline.colorpicker-visible {
- display: inline-block;
- }
|