File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
/* ==========================================================================
$BASE-PICKER
========================================================================== */
/**
* Note: the root picker element should *NOT* be styled more than what’s here.
*/
.picker {
font-size: 16px;
text-align: left;
line-height: 1.2;
color: #000;
position: absolute;
z-index: 16;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
outline: none;
}
/**
* The picker input element.
*/
.picker__input {
width: 180px;
cursor: default;
background-image: url(/kcccesPb/publish/images/content/calendarIcon.png);
background-repeat: no-repeat;
background-position: 90% 45%;
}
/**
* When the picker is opened, the input element is “activated”.
*/
.picker__input.picker__input--active {
border-color: #0089ec;
}
/**
* The holder is the only “scrollable” top-level container element.
*/
.picker__holder {
width: 335px;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}
/*!
* Classic picker styling for pickadate.js
* Demo: http://amsul.github.io/pickadate.js
*/
/**
* Note: the root picker element should *NOT* be styled more than what’s here.
*/
.picker {
width: 100%;
}
/**
* The holder is the base of the picker.
*/
.picker__holder {
position: absolute;
background: #fff;
border: 1px solid #aaaaaa;
border-top-width: 0;
border-bottom-width: 0;
border-radius: 5px;
box-sizing: border-box;
min-width: 176px;
max-width: 336px;
max-height: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
-moz-opacity: 0;
opacity: 0;
transform: translateY(-1em) perspective(600px) rotateX(10deg);
transition: transform 0.15s ease-out, opacity 0.15s ease-out, max-height 0s 0.15s, border-width 0s 0.15s;
overflow: hidden;
}
/**
* The frame and wrap work together to ensure that
* clicks within the picker don’t reach the holder.
*/
.picker__wrap {
margin: -1px;
}
/**
* When the picker opens...
*/
.picker--opened .picker__holder {
max-height: 25em;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
border-top-width: 1px;
border-bottom-width: 1px;
transform: translateY(0) perspective(600px) rotateX(0);
transition: transform 0.15s ease-out, opacity 0.15s ease-out, max-height 0s, border-width 0s;
box-shadow: 0 6px 18px 1px rgba(0, 0, 0, 0.12);
}
@media all and (max-width: 767px) {
.picker__input {background-position: 95% 45%;}
.picker__holder {width: 100%; min-width: auto; min-height: 100%;}
}