371 lines
7.4 KiB
CSS
371 lines
7.4 KiB
CSS
/**
|
|
* Handsontable 0.9.9
|
|
* Handsontable is a simple jQuery plugin for editable tables with basic copy-paste compatibility with Excel and Google Docs
|
|
*
|
|
* Copyright 2012, Marcin Warpechowski
|
|
* Licensed under the MIT license.
|
|
* http://handsontable.com/
|
|
*
|
|
* Date: Sun Jun 30 2013 13:24:55 GMT+0200 (Central European Daylight Time)
|
|
*/
|
|
|
|
.handsontable {
|
|
position: relative;
|
|
font-family: Arial, Helvetica, sans-serif;
|
|
line-height: 1.3em;
|
|
font-size: 13px;
|
|
}
|
|
|
|
.handsontable.hidden {
|
|
display: none;
|
|
left: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
}
|
|
|
|
.handsontable * {
|
|
box-sizing: content-box;
|
|
-webkit-box-sizing: content-box;
|
|
-moz-box-sizing: content-box;
|
|
}
|
|
|
|
.handsontable table {
|
|
border-collapse: separate; /*it must be separate, otherwise there are offset miscalculations in WebKit: http://stackoverflow.com/questions/2655987/border-collapse-differences-in-ff-and-webkit*/
|
|
position: relative;
|
|
/*this actually only changes appearance of user selection - does not make text unselectable
|
|
-webkit-user-select: none;
|
|
-khtml-user-select: none;
|
|
-moz-user-select: none;
|
|
-o-user-select: none;
|
|
-ms-user-select: none;
|
|
/*user-select: none; /*no browser supports unprefixed version*/
|
|
border-spacing: 0;
|
|
margin: 0;
|
|
border-width: 0;
|
|
table-layout: fixed;
|
|
width: 0;
|
|
outline-width: 0;
|
|
/* reset bootstrap table style. for more info see: https://github.com/warpech/jquery-handsontable/issues/224 */
|
|
max-width: none;
|
|
max-height: none;
|
|
}
|
|
|
|
.handsontable col {
|
|
width: 50px;
|
|
}
|
|
|
|
.handsontable col.rowHeader {
|
|
width: 50px;
|
|
}
|
|
|
|
.handsontable th,
|
|
.handsontable td {
|
|
border-right: 1px solid #CCC;
|
|
border-bottom: 1px solid #CCC;
|
|
height: 22px;
|
|
empty-cells: show;
|
|
line-height: 21px;
|
|
padding: 0 4px 0 4px; /* top, bottom padding different than 0 is handled poorly by FF with HTML5 doctype */
|
|
background-color: #FFF;
|
|
font-size: 12px;
|
|
vertical-align: top;
|
|
overflow: hidden;
|
|
outline-width: 0;
|
|
white-space: pre-line; /* preserve new line character in cell */
|
|
}
|
|
|
|
.handsontable td.htInvalid {
|
|
-webkit-transition: background 0.75s ease;
|
|
-moz-transition: background 0.75s ease;
|
|
-ms-transition: background 0.75s ease;
|
|
-o-transition: background 0.75s ease;
|
|
transition: background 0.75s ease;
|
|
background-color: #ff4c42;
|
|
}
|
|
|
|
.handsontable th:last-child {
|
|
/*Foundation framework fix*/
|
|
border-right: 1px solid #CCC;
|
|
border-bottom: 1px solid #CCC;
|
|
}
|
|
|
|
.handsontable tr:first-child th.htNoFrame,
|
|
.handsontable th:first-child.htNoFrame,
|
|
.handsontable th.htNoFrame {
|
|
border-left-width: 0;
|
|
background-color: white;
|
|
border-color: #FFF;
|
|
}
|
|
|
|
.handsontable th:first-child,
|
|
.handsontable td:first-child,
|
|
.handsontable .htNoFrame + th,
|
|
.handsontable .htNoFrame + td {
|
|
border-left: 1px solid #CCC;
|
|
}
|
|
|
|
.handsontable tr:first-child th,
|
|
.handsontable tr:first-child td {
|
|
border-top: 1px solid #CCC;
|
|
}
|
|
|
|
.handsontable thead tr:last-child th {
|
|
border-bottom-width: 0;
|
|
}
|
|
|
|
.handsontable thead tr.lastChild th {
|
|
border-bottom-width: 0;
|
|
}
|
|
|
|
.handsontable th {
|
|
background-color: #EEE;
|
|
color: #222;
|
|
text-align: center;
|
|
font-weight: normal;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.handsontable th .small {
|
|
font-size: 12px;
|
|
}
|
|
|
|
.handsontable thead th {
|
|
padding: 0;
|
|
}
|
|
|
|
.handsontable th.active {
|
|
background-color: #CCC;
|
|
}
|
|
|
|
.handsontable thead th .relative {
|
|
position: relative;
|
|
padding: 2px 4px;
|
|
}
|
|
|
|
/* plugins */
|
|
|
|
.handsontable .manualColumnMover {
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
background-color: transparent;
|
|
width: 5px;
|
|
height: 25px;
|
|
z-index: 999;
|
|
cursor: move;
|
|
}
|
|
|
|
.handsontable th .manualColumnMover:hover,
|
|
.handsontable th .manualColumnMover.active {
|
|
background-color: #88F;
|
|
}
|
|
|
|
.handsontable .manualColumnResizer {
|
|
position: absolute;
|
|
right: -1px;
|
|
top: 0;
|
|
background-color: transparent;
|
|
width: 5px;
|
|
height: 25px;
|
|
z-index: 999;
|
|
cursor: col-resize;
|
|
}
|
|
|
|
.handsontable th .manualColumnResizer:hover,
|
|
.handsontable .manualColumnResizerLine .manualColumnResizer {
|
|
background-color: #AAB;
|
|
}
|
|
|
|
.handsontable .columnSorting:hover {
|
|
text-decoration: underline;
|
|
cursor: pointer;
|
|
}
|
|
|
|
/* border line */
|
|
.handsontable .wtBorder {
|
|
position: absolute;
|
|
font-size: 0;
|
|
}
|
|
|
|
.handsontable td.area {
|
|
background-color: #EEF4FF;
|
|
}
|
|
|
|
/* fill handle */
|
|
.handsontable .wtBorder.corner {
|
|
font-size: 0;
|
|
cursor: crosshair;
|
|
}
|
|
|
|
.handsontable .htBorder.htFillBorder {
|
|
background: red;
|
|
width: 1px;
|
|
height: 1px;
|
|
}
|
|
|
|
/* textarea border color */
|
|
textarea.handsontableInput {
|
|
border: 2px solid #5292F7;
|
|
outline-width: 0;
|
|
margin: 0;
|
|
padding: 1px 4px 0 2px;
|
|
font-family: Arial, Helvetica, sans-serif; /*repeat from .handsontable (inherit doesn't work with IE<8) */
|
|
line-height: 1.3em; /*repeat from .handsontable (inherit doesn't work with IE<8) */
|
|
font-size: 13px;
|
|
box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.4);
|
|
resize: none;
|
|
|
|
/*below are needed to overwrite stuff added by jQuery UI Bootstrap theme*/
|
|
display: inline-block;
|
|
font-size: 13px;
|
|
color: #000;
|
|
-webkit-border-radius: 0;
|
|
-moz-border-radius: 0;
|
|
border-radius: 0;
|
|
}
|
|
|
|
.handsontableInputHolder {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 1px;
|
|
height: 1px;
|
|
}
|
|
|
|
/*
|
|
TextRenderer readOnly cell
|
|
*/
|
|
.handsontable .htDimmed {
|
|
font-style: italic;
|
|
color: #777;
|
|
}
|
|
|
|
/*
|
|
AutocompleteRenderer down arrow
|
|
*/
|
|
.handsontable .htAutocomplete {
|
|
position: relative;
|
|
padding-right: 20px;
|
|
}
|
|
|
|
.handsontable .htAutocompleteArrow {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
font-size: 10px;
|
|
color: #EEE;
|
|
cursor: default;
|
|
width: 16px;
|
|
text-align: center;
|
|
}
|
|
|
|
.handsontable td .htAutocompleteArrow:hover {
|
|
color: #777;
|
|
}
|
|
|
|
/*
|
|
CheckboxRenderer
|
|
*/
|
|
.handsontable .htCheckboxRendererInput.noValue {
|
|
opacity: 0.5;
|
|
}
|
|
|
|
/*
|
|
NumericRenderer
|
|
*/
|
|
.handsontable .htNumeric {
|
|
text-align: right;
|
|
}
|
|
|
|
/* typeahead rules. Needed only if you are using the autocomplete feature */
|
|
.handsontable .typeahead {
|
|
position: absolute;
|
|
font-family: Arial, Helvetica, sans-serif;
|
|
line-height: 1.3em;
|
|
font-size: 13px;
|
|
z-index: 10;
|
|
top: 100%;
|
|
left: 0;
|
|
float: left;
|
|
display: none;
|
|
min-width: 160px;
|
|
padding: 4px 0;
|
|
margin: 2px 0 0 0;
|
|
list-style: none;
|
|
background-color: white;
|
|
border-color: #CCC;
|
|
border-color: rgba(0, 0, 0, 0.2);
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
-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);
|
|
-webkit-background-clip: padding-box;
|
|
background-clip: padding-box;
|
|
-webkit-border-radius: 4px;
|
|
-moz-border-radius: 4px;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.handsontable .typeahead li {
|
|
line-height: 18px;
|
|
min-height: 18px;
|
|
display: list-item;
|
|
margin: 0;
|
|
}
|
|
|
|
.handsontable .typeahead a {
|
|
display: block;
|
|
padding: 3px 15px;
|
|
clear: both;
|
|
font-weight: normal;
|
|
line-height: 18px;
|
|
min-height: 18px;
|
|
color: #333;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.handsontable .typeahead li > a:hover,
|
|
.handsontable .typeahead .active > a,
|
|
.handsontable .typeahead .active > a:hover {
|
|
color: white;
|
|
text-decoration: none;
|
|
background-color: #08C;
|
|
}
|
|
|
|
.handsontable .typeahead a {
|
|
color: #08C;
|
|
text-decoration: none;
|
|
}
|
|
|
|
/*context menu rules*/
|
|
ul.context-menu-list {
|
|
color: black;
|
|
}
|
|
|
|
ul.context-menu-list li {
|
|
margin-bottom: 0; /*Foundation framework fix*/
|
|
}
|
|
|
|
/**
|
|
* dragdealer
|
|
*/
|
|
|
|
.handsontable .dragdealer {
|
|
position: relative;
|
|
width: 9px;
|
|
height: 9px;
|
|
background: #F8F8F8;
|
|
border: 1px solid #DDD;
|
|
}
|
|
|
|
.handsontable .dragdealer .handle {
|
|
position: absolute;
|
|
width: 9px;
|
|
height: 9px;
|
|
background: #C5C5C5;
|
|
}
|
|
|
|
.handsontable .dragdealer .disabled {
|
|
background: #898989;
|
|
} |