You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
231 lines
5.5 KiB
231 lines
5.5 KiB
.date-picker
|
|
{
|
|
width:170px;
|
|
height:25px;
|
|
padding:0;
|
|
border:0;
|
|
line-height:25px;
|
|
padding-left:10px;
|
|
font-size:12px;
|
|
font-family:Arial;
|
|
font-weight:bold;
|
|
cursor:pointer;
|
|
color:#303030;
|
|
position:relative;
|
|
z-index:2;
|
|
}
|
|
.date-picker-wrapper
|
|
{
|
|
position:absolute;
|
|
z-index:1;
|
|
border:1px solid #bfbfbf;
|
|
background-color:#efefef;
|
|
width:428px;
|
|
padding: 5px 12px;
|
|
font-size:12px;
|
|
line-height:20px;
|
|
color:#aaa;
|
|
font-family:Arial;
|
|
box-shadow:3px 3px 10px rgba(0,0,0,0.5);
|
|
}
|
|
.date-picker-wrapper.single-date {
|
|
width:auto;
|
|
}
|
|
.date-picker-wrapper.no-shortcuts { padding-bottom:12px;}
|
|
.date-picker-wrapper .footer
|
|
{
|
|
font-size:11px;
|
|
padding-top: 3px;
|
|
}
|
|
.date-picker-wrapper b
|
|
{
|
|
color:#666;
|
|
font-weight:700;
|
|
}
|
|
.date-picker-wrapper a
|
|
{
|
|
color: rgb(107, 180, 214);
|
|
text-decoration:underline;
|
|
}
|
|
.date-picker-wrapper .month-name
|
|
{
|
|
text-transform: uppercase;
|
|
}
|
|
.date-picker-wrapper .month-wrapper
|
|
{
|
|
border:1px solid #bfbfbf;
|
|
border-radius:3px;
|
|
background-color:#fff;
|
|
padding:5px;
|
|
cursor:default;
|
|
position:relative;
|
|
_overflow:hidden;
|
|
}
|
|
.date-picker-wrapper .month-wrapper table
|
|
{
|
|
width:190px;
|
|
float:left;
|
|
}
|
|
.date-picker-wrapper .month-wrapper table.month2
|
|
{
|
|
width:190px;
|
|
float:right;
|
|
}
|
|
.date-picker-wrapper .month-wrapper table th,
|
|
.date-picker-wrapper .month-wrapper table td
|
|
{
|
|
vertical-align:middle;
|
|
text-align:center;
|
|
line-height:14px;
|
|
margin : 0px;
|
|
padding : 0px;
|
|
}
|
|
.date-picker-wrapper .month-wrapper table .day
|
|
{
|
|
height:19px;
|
|
line-height:19px;
|
|
font-size:12px;
|
|
margin-bottom:1px;
|
|
color:#999;
|
|
cursor:default;
|
|
}
|
|
.date-picker-wrapper .month-wrapper table div.day.lastMonth,
|
|
.date-picker-wrapper .month-wrapper table div.day.nextMonth
|
|
{
|
|
color:#999;
|
|
cursor:default;
|
|
}
|
|
.date-picker-wrapper .month-wrapper table .day.checked
|
|
{
|
|
background-color: rgba(156, 219, 247, 0.5);
|
|
}
|
|
.date-picker-wrapper .month-wrapper table .week-name
|
|
{
|
|
height:20px;
|
|
line-height:20px;
|
|
font-weight:100;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.date-picker-wrapper .month-wrapper table .day.has-tooltip { cursor:help !important;}
|
|
|
|
.date-picker-wrapper .month-wrapper table .day.toMonth.valid
|
|
{
|
|
color:#333;
|
|
cursor:pointer;
|
|
}
|
|
|
|
.date-picker-wrapper .month-wrapper table .day.real-today { background-color: rgb(255, 230, 132); }
|
|
.date-picker-wrapper .month-wrapper table .day.real-today.checked { background-color: rgb(112, 204, 213); }
|
|
|
|
.date-picker-wrapper table .caption
|
|
{
|
|
height:40px;
|
|
}
|
|
.date-picker-wrapper table .caption .next,
|
|
.date-picker-wrapper table .caption .prev
|
|
{
|
|
padding:0 5px;
|
|
cursor:pointer;
|
|
}
|
|
.date-picker-wrapper table .caption .next:hover,
|
|
.date-picker-wrapper table .caption .prev:hover
|
|
{
|
|
background-color:#ccc;
|
|
color:white;
|
|
}
|
|
.date-picker-wrapper .gap
|
|
{
|
|
position:absolute;
|
|
display:none;
|
|
top:0px;
|
|
left:193px;
|
|
z-index: 1;
|
|
width:15px;
|
|
height: 100%;
|
|
background-color:red;
|
|
font-size:0;
|
|
line-height:0;
|
|
}
|
|
.date-picker-wrapper .gap .gap-lines { height: 100%; overflow:hidden; }
|
|
.date-picker-wrapper .gap .gap-line { height:15px;width:15px; position:relative; }
|
|
.date-picker-wrapper .gap .gap-line .gap-1 { z-index:1; height:0; border-left:8px solid white; border-top:8px solid #eee;border-bottom:8px solid #eee; }
|
|
.date-picker-wrapper .gap .gap-line .gap-2 { position:absolute; right:0; top:0px; z-index:2; height:0; border-left:8px solid transparent; border-top:8px solid white; }
|
|
.date-picker-wrapper .gap .gap-line .gap-3 { position:absolute; right:0; top:8px; z-index:2; height:0; border-left:8px solid transparent; border-bottom:8px solid white; }
|
|
.date-picker-wrapper .gap .gap-top-mask { width: 6px; height:1px; position:absolute; top: -1px; left: 1px; background-color: #eee; z-index:3; }
|
|
.date-picker-wrapper .gap .gap-bottom-mask { width: 6px; height:1px; position:absolute; bottom: -1px; left: 7px; background-color: #eee; z-index:3; }
|
|
|
|
.date-picker-wrapper .selected-days
|
|
{
|
|
display:none;
|
|
}
|
|
.date-picker-wrapper .drp_top-bar
|
|
{
|
|
line-height:40px;
|
|
height:40px;
|
|
position:relative;
|
|
}
|
|
.date-picker-wrapper .drp_top-bar .error-top { display:none; }
|
|
.date-picker-wrapper .drp_top-bar .normal-top { display:none; }
|
|
.date-picker-wrapper .drp_top-bar .default-top { display:block; }
|
|
|
|
.date-picker-wrapper .drp_top-bar.error .default-top { display:none; }
|
|
.date-picker-wrapper .drp_top-bar.error .error-top { display:block; color:red; }
|
|
|
|
.date-picker-wrapper .drp_top-bar.normal .default-top { display:none; }
|
|
.date-picker-wrapper .drp_top-bar.normal .normal-top { display:block; }
|
|
|
|
.date-picker-wrapper .drp_top-bar .apply-btn
|
|
{
|
|
position:absolute;
|
|
right: 0px;
|
|
top: 6px;
|
|
padding:3px 5px;
|
|
margin:0;
|
|
font-size:12px;
|
|
border-radius:4px;
|
|
cursor:pointer;
|
|
|
|
color: #d9eef7;
|
|
border: solid 1px #0076a3;
|
|
background: #0095cd;
|
|
background: -webkit-gradient(linear, left top, left bottom, from(#00adee), to(#0078a5));
|
|
background: -moz-linear-gradient(top, #00adee, #0078a5);
|
|
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00adee', endColorstr='#0078a5');
|
|
color:white;
|
|
}
|
|
|
|
.date-picker-wrapper .drp_top-bar .apply-btn.disabled
|
|
{
|
|
cursor: pointer;
|
|
color: #606060;
|
|
border: solid 1px #b7b7b7;
|
|
background: #fff;
|
|
background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
|
|
background: -moz-linear-gradient(top, #fff, #ededed);
|
|
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
|
|
}
|
|
/*time styling*/
|
|
.time {
|
|
position: relative;
|
|
}
|
|
.time input[type=range] {
|
|
vertical-align: middle;
|
|
}
|
|
.time1, .time2 {
|
|
width: 180px;
|
|
padding: 0 5px;
|
|
text-align: center;
|
|
}
|
|
.time1 {
|
|
float: left;
|
|
}
|
|
.time2 {
|
|
float: right;
|
|
}
|
|
.hour, .minute {
|
|
text-align: right;
|
|
}
|
|
.hide {
|
|
display: none;
|
|
}
|