@mixin runo-datefield { .v-datefield input.v-textfield, .v-datefield input.v-textfield[type=text] { height: 18px; } .v-datefield-button { font-size:13px; width: 22px; height: 24px; padding: 0; overflow: hidden; border: none; background: transparent url(img/open-button.png) no-repeat right 0; vertical-align: top; } .v-datefield-popup { font-family: "Trebuchet MS", geneva, helvetica, arial, tahoma, verdana, sans-serif; color: #464f52; font-size: 12px; background: #f6f7f7; border: 1px solid #b6bbbc; padding: 2px 6px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .v-datefield-calendarpanel { width: 230px; } .v-datefield-popup .v-datefield-calendarpanel { width: 200px; } .v-datefield-year .v-datefield-calendarpanel { width: 100px; } .v-datefield-calendarpanel td { text-align: right; } .v-datefield-calendarpanel td span { display: block; } .v-datefield-calendarpanel-header { height: 30px; font-size: 13px; } td.v-datefield-calendarpanel-month { font-weight: bold; text-shadow: 0 1px 0 #fff; width: 150px; } .v-datefield-calendarpanel-prevyear, .v-datefield-calendarpanel-nextyear, .v-datefield-calendarpanel-prevmonth, .v-datefield-calendarpanel-nextmonth { width: 16px; } /* Year buttons */ .v-datefield-calendarpanel .v-button-prevyear, .v-datefield-calendarpanel .v-button-nextyear { display: block; width: 16px; height: 16px; border: none; padding: 0; background: transparent url(img/prevyear.png) no-repeat; text-indent: -90000px; margin: 0 auto; } .v-datefield-calendarpanel .v-button-nextyear { background: transparent url(img/nextyear.png) no-repeat; } .v-datefield-calendarpanel .v-button-prevyear:hover, .v-datefield-calendarpanel .v-button-nextyear:hover { background-position: left bottom; } /* Month buttons */ .v-datefield-calendarpanel .v-button-prevmonth, .v-datefield-calendarpanel .v-button-nextmonth { display: block; width: 11px; height: 16px; border: none; padding: 0; background: transparent url(img/prevmonth.png) no-repeat; text-indent: -90000px; margin: 0 auto; } .v-datefield-calendarpanel .v-button-nextmonth { background: transparent url(img/nextmonth.png) no-repeat; } .v-datefield-calendarpanel .v-button-prevmonth:hover, .v-datefield-calendarpanel .v-button-nextmonth:hover { background-position: left bottom; } .v-datefield-calendarpanel strong { color: #ee5311; display: block; width: 20px; font-size: 12px; } .v-datefield-calendarpanel-day, .v-datefield-calendarpanel-weeknumber, .v-datefield-calendarpanel-day-today { padding: 1px 3px; width: 14px; height: 16px; } .v-datefield-calendarpanel-day-today { border: 1px solid #429ce9; width: 12px; height: 14px; } .v-datefield-calendarpanel-day-entry { color: #6a98b5; } .v-datefield-calendarpanel-day-disabled { font-weight: normal; color: #dddddd; } .v-datefield-calendarpanel-day-entry.v-datefield-calendarpanel-day-disabled { color: #afd6f8; } .v-datefield-calendarpanel-day-selected { font-weight: bold; width: 14px; height: 16px; color: #fff; padding: 1px 3px; background: transparent url(img/selected-bg.png) no-repeat 50% 50%; border: none; } .v-datefield-time { font-size: 11px; } .v-datefield-time .v-select { font-size: 10px; padding: 0; margin: 0; } .v-datefield-rendererror .v-textfield { background: #ff9999; } .v-datefield-prompt .v-datefield-textfield { color: #999; font-style: normal; } }