openaire-library/utils/my-date-picker/my-date-picker.component.css

462 lines
15 KiB
CSS
Raw Permalink Normal View History

.mydp {
min-width: 30px;
border-radius: 2px;
line-height: 1.1;
display: inline-block;
position: relative;
}
.mydp * {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
font-family: Arial, Helvetica, sans-serif;
padding: 0;
margin: 0;
}
.mydp .selector {
margin-top: 2px;
margin-left: -1px;
position: absolute;
width: 252px;
padding: 0;
border: 1px solid #CCC;
border-radius: 2px;
z-index: 100;
animation: selectorfadein 0.1s;
}
.mydp .selector:focus {
border: 1px solid #ADD8E6;
outline: none;
}
@keyframes selectorfadein {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.mydp .selectorarrow {
background: #FAFAFA;
margin-top: 12px;
padding: 0;
}
.mydp .selectorarrow:after,
.mydp .selectorarrow:before {
bottom: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
}
.mydp .selectorarrow:after {
border-color: rgba(250, 250, 250, 0);
border-bottom-color: #FAFAFA;
border-width: 10px;
margin-left: -10px;
}
.mydp .selectorarrow:before {
border-color: rgba(204, 204, 204, 0);
border-bottom-color: #CCC;
border-width: 11px;
margin-left: -11px;
}
.mydp .selectorarrow:focus:before {
border-bottom-color: #ADD8E6;
}
.mydp .selectorarrowleft:after,
.mydp .selectorarrowleft:before {
left: 24px;
}
.mydp .selectorarrowright:after,
.mydp .selectorarrowright:before {
left: 224px;
}
.mydp .alignselectorright {
right: -1px;
}
.mydp .selectiongroup {
position: relative;
display: table;
border: none;
border-spacing: 0;
background-color: #FFF;
}
.mydp .selection {
outline: none;
background-color: #FFF;
display: table-cell;
position: absolute;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text-align: center;
}
.mydp .invaliddate,
.mydp .invalidmonth,
.mydp .invalidyear {
background-color: #F1DEDE;
}
.mydp ::-ms-clear {
display: none;
}
.mydp .selbtngroup {
position: relative;
vertical-align: middle;
white-space: nowrap;
width: 1%;
display: table-cell;
font-size: 0;
}
.mydp .btnpicker,
.mydp .btnclear {
height: 100%;
width: 30px;
border: none;
padding: 0;
outline: 0;
font: inherit;
-moz-user-select: none;
}
.mydp .btnleftborder {
border-left: 1px solid #CCC;
}
.mydp .btnpickerenabled,
.mydp .btnclearenabled,
.mydp .headertodaybtnenabled,
.mydp .headerbtnenabled {
cursor: pointer;
}
.mydp .btnpickerdisabled,
.mydp .btncleardisabled,
.mydp .headertodaybtndisabled,
.mydp .headerbtndisabled {
cursor: not-allowed;
}
.mydp .headerbtndisabled {
opacity: 0.4;
}
.mydp .btnpicker,
.mydp .btnclear,
.mydp .headertodaybtn {
background: #FFF;
}
.mydp .header {
width: 100%;
height: 30px;
background-color: #FAFAFA;
}
.mydp .header td {
vertical-align: middle;
border: none;
line-height: 0;
}
.mydp .header td:nth-child(1) {
padding-left: 4px;
}
.mydp .header td:nth-child(2) {
text-align: center;
}
.mydp .header td:nth-child(3) {
padding-right: 4px;
}
.mydp .caltable {
table-layout: fixed;
width: 100%;
background-color: #FFF;
font-size: 14px;
}
.mydp .caltable,
.mydp .weekdaytitle,
.mydp .daycell {
border-collapse: collapse;
color: #003366;
line-height: 1.1;
}
.mydp .weekdaytitle,
.mydp .daycell {
padding: 5px;
text-align: center;
}
.mydp .weekdaytitle {
background-color: #DDD;
font-size: 12px;
font-weight: bold;
vertical-align: middle;
max-width: 36px;
overflow: hidden;
white-space: nowrap;
}
.mydp .weekdaytitleweeknbr {
width: 20px;
border-right: 1px solid #BBB;
}
.mydp .daycell {
cursor: pointer;
height: 30px;
}
.mydp .daycell div {
background-color: inherit;
vertical-align: middle;
}
.mydp .daycell div span {
vertical-align: middle;
}
.mydp .daycellweeknbr {
font-size: 10px;
border-right: 1px solid #CCC;
cursor: default;
color: #000;
}
.mydp .inlinedp {
position: relative;
margin-top: -1px;
}
.mydp .prevmonth {
color: #CCC;
}
.mydp .nextmonth {
color: #CCC;
}
.mydp .disabled {
cursor: default !important;
color: #CCC !important;
background: #FBEFEF !important;
}
.mydp .sunday {
color: #C30000;
}
.mydp .sundayDim {
opacity: 0.5;
}
.mydp .currmonth {
background-color: #F6F6F6;
font-weight: bold;
}
.mydp .currday {
text-decoration: underline;
}
.mydp .selectedday div {
border: 1px solid #004198;
background-color: #8EBFFF !important;
border-radius: 2px;
}
.mydp .headerbtncell {
background-color: #FAFAFA;
display: table-cell;
vertical-align: middle;
}
.mydp .headerbtn,
.mydp .headerlabelbtn {
background: #FAFAFA;
border: none;
height: 22px;
}
.mydp .headerbtn {
width: 16px;
}
.mydp .headerlabelbtn {
font-size: 14px;
}
.mydp,
.mydp .headertodaybtn,
.mydp .monthinput,
.mydp .yearinput {
border: 1px solid #CCC;
}
.mydp .btnpicker,
.mydp .btnclear,
.mydp .headerbtn,
.mydp .headermonthtxt,
.mydp .headeryeartxt,
.mydp .headertodaybtn,
.mydp .selection {
color: #000;
}
.mydp .headertodaybtn {
padding: 0 4px;
border-radius: 2px;
font-size: 11px;
height: 22px;
min-width: 60px;
max-width: 70px;
overflow: hidden;
white-space: nowrap;
}
.mydp button::-moz-focus-inner {
border: 0;
}
.mydp .headermonthtxt,
.mydp .headeryeartxt {
text-align: center;
display: table-cell;
vertical-align: middle;
font-size: 14px;
height: 26px;
width: 40px;
max-width: 40px;
overflow: hidden;
white-space: nowrap;
}
.mydp .btnclear:focus,
.mydp .btnpicker:focus,
.mydp .headertodaybtn:focus {
background: #ADD8E6;
}
.mydp .headerbtn:focus,
.mydp .monthlabel:focus,
.mydp .yearlabel:focus {
color: #ADD8E6;
outline: none;
}
.mydp .daycell:focus {
outline: 1px solid #CCC;
}
.mydp .icon-mydpcalendar,
.mydp .icon-mydpremove {
font-size: 16px;
}
.mydp .icon-mydpleft,
.mydp .icon-mydpright {
color: #222;
font-size: 20px;
}
.mydp table {
display: table;
border-spacing: 0;
}
.mydp table td {
padding: 0;
}
.mydp table,
.mydp th,
.mydp td {
border: none;
}
.mydp .btnpickerenabled:hover,
.mydp .btnclearenabled:hover,
.mydp .headertodaybtnenabled:hover,
.mydp .tablesingleday:hover {
background-color: #8BDAF4;
}
.mydp .monthlabel,
.mydp .yearlabel {
cursor: pointer;
}
.mydp .yearinput,
.mydp .monthinput {
width: 40px;
height: 22px;
text-align: center;
font-weight: bold;
outline: none;
border-radius: 2px;
}
.mydp .headerbtnenabled:hover,
.mydp .monthlabel:hover,
.mydp .yearlabel:hover {
color: #8BDAF4;
}
@font-face {
font-family: 'mydatepicker';
src: url('data:application/octet-stream;base64,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
font-weight: normal;
font-style: normal;
}
.mydp .mydpicon {
font-family: 'mydatepicker';
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.mydp .icon-mydpright:before {
content: "\e800";
}
.mydp .icon-mydpleft:before {
content: "\e801";
}
.mydp .icon-mydpcalendar:before {
content: "\e802";
}
.mydp .icon-mydpremove:before {
content: "\e805";
}