datepicker-default-theme.css 1.54 KB
Newer Older
Thitichaipun Wutthisak committed
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38
/*!
 * Angular Material Design
 * https://github.com/angular/material
 * @license MIT
 * v1.0.6
 */
/** Theme styles for mdDatepicker. */
md-datepicker.md-THEME_NAME-theme {
  background: '{{background-color}}'; }

.md-THEME_NAME-theme .md-datepicker-input {
  color: '{{background-contrast}}';
  background: '{{background-color}}'; }
  .md-THEME_NAME-theme .md-datepicker-input::-webkit-input-placeholder, .md-THEME_NAME-theme .md-datepicker-input::-moz-placeholder, .md-THEME_NAME-theme .md-datepicker-input:-moz-placeholder, .md-THEME_NAME-theme .md-datepicker-input:-ms-input-placeholder {
    color: "{{foreground-3}}"; }

.md-THEME_NAME-theme .md-datepicker-input-container {
  border-bottom-color: '{{background-300}}'; }
  .md-THEME_NAME-theme .md-datepicker-input-container.md-datepicker-focused {
    border-bottom-color: '{{primary-500}}'; }
  .md-THEME_NAME-theme .md-datepicker-input-container.md-datepicker-invalid {
    border-bottom-color: '{{warn-A700}}'; }

.md-THEME_NAME-theme .md-datepicker-calendar-pane {
  border-color: '{{background-300}}'; }

.md-THEME_NAME-theme .md-datepicker-triangle-button .md-datepicker-expand-triangle {
  border-top-color: '{{foreground-3}}'; }

.md-THEME_NAME-theme .md-datepicker-triangle-button:hover .md-datepicker-expand-triangle {
  border-top-color: '{{foreground-2}}'; }

.md-THEME_NAME-theme .md-datepicker-open .md-datepicker-calendar-icon {
  fill: '{{primary-500}}'; }

.md-THEME_NAME-theme .md-datepicker-calendar,
.md-THEME_NAME-theme .md-datepicker-input-mask-opaque {
  background: '{{background-color}}'; }