/*! * Angular Material Design * https://github.com/angular/material * @license MIT * v1.1.3 */ /** Styles for mdCalendar. */ md-calendar { font-size: 13px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .md-calendar-scroll-mask { display: inline-block; overflow: hidden; height: 308px; } .md-calendar-scroll-mask .md-virtual-repeat-scroller { overflow-y: scroll; -webkit-overflow-scrolling: touch; } .md-calendar-scroll-mask .md-virtual-repeat-scroller::-webkit-scrollbar { display: none; } .md-calendar-scroll-mask .md-virtual-repeat-offsetter { width: 100%; } .md-calendar-scroll-container { box-shadow: inset -3px 3px 6px rgba(0, 0, 0, 0.2); display: inline-block; height: 308px; width: 346px; } .md-calendar-date { height: 44px; width: 44px; text-align: center; padding: 0; border: none; box-sizing: content-box; } .md-calendar-date:first-child { padding-left: 16px; } [dir=rtl] .md-calendar-date:first-child { padding-left: 0; padding-right: 16px; } .md-calendar-date:last-child { padding-right: 16px; } [dir=rtl] .md-calendar-date:last-child { padding-right: 0; padding-left: 16px; } .md-calendar-date.md-calendar-date-disabled { cursor: default; } .md-calendar-date-selection-indicator { -webkit-transition: background-color, color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); transition: background-color, color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); border-radius: 50%; display: inline-block; width: 40px; height: 40px; line-height: 40px; } .md-calendar-date:not(.md-disabled) .md-calendar-date-selection-indicator { cursor: pointer; } .md-calendar-month-label { height: 44px; font-size: 14px; font-weight: 500; padding: 0 0 0 24px; } [dir=rtl] .md-calendar-month-label { padding: 0 24px 0 0; } md-calendar-month .md-calendar-month-label:not(.md-calendar-month-label-disabled) { cursor: pointer; } .md-calendar-month-label md-icon { -webkit-transform: rotate(180deg); transform: rotate(180deg); } [dir=rtl] .md-calendar-month-label md-icon { -webkit-transform: none; transform: none; } .md-calendar-month-label span { vertical-align: middle; } .md-calendar-day-header { table-layout: fixed; border-spacing: 0; border-collapse: collapse; } .md-calendar-day-header th { height: 40px; width: 44px; text-align: center; padding: 0; border: none; box-sizing: content-box; font-weight: normal; } .md-calendar-day-header th:first-child { padding-left: 16px; } [dir=rtl] .md-calendar-day-header th:first-child { padding-left: 0; padding-right: 16px; } .md-calendar-day-header th:last-child { padding-right: 16px; } [dir=rtl] .md-calendar-day-header th:last-child { padding-right: 0; padding-left: 16px; } .md-calendar { table-layout: fixed; border-spacing: 0; border-collapse: collapse; } .md-calendar tr:last-child td { border-bottom-width: 1px; border-bottom-style: solid; } .md-calendar:first-child { border-top: 1px solid transparent; } .md-calendar tbody, .md-calendar td, .md-calendar tr { vertical-align: middle; box-sizing: content-box; } /** Styles for mdDatepicker. */ md-datepicker { white-space: nowrap; overflow: hidden; vertical-align: middle; } .md-inline-form md-datepicker { margin-top: 12px; } .md-datepicker-button { display: inline-block; box-sizing: border-box; background: none; vertical-align: middle; position: relative; } .md-datepicker-button:before { top: 0; left: 0; bottom: 0; right: 0; position: absolute; content: ''; speak: none; } .md-datepicker-input { font-size: 14px; box-sizing: border-box; border: none; box-shadow: none; outline: none; background: transparent; min-width: 120px; max-width: 328px; padding: 0 0 5px; } .md-datepicker-input::-ms-clear { display: none; } ._md-datepicker-floating-label > md-datepicker { overflow: visible; } ._md-datepicker-floating-label > md-datepicker .md-datepicker-input-container { border: none; } ._md-datepicker-floating-label > md-datepicker .md-datepicker-button { float: left; margin-top: -12px; top: 9.5px; } [dir=rtl] ._md-datepicker-floating-label > md-datepicker .md-datepicker-button { float: right; } ._md-datepicker-floating-label .md-input { float: none; } ._md-datepicker-floating-label._md-datepicker-has-calendar-icon > label:not(.md-no-float):not(.md-container-ignore) { right: 18px; left: auto; width: calc(100% - 84px); } [dir=rtl] ._md-datepicker-floating-label._md-datepicker-has-calendar-icon > label:not(.md-no-float):not(.md-container-ignore) { right: auto; } [dir=rtl] ._md-datepicker-floating-label._md-datepicker-has-calendar-icon > label:not(.md-no-float):not(.md-container-ignore) { left: 18px; } ._md-datepicker-floating-label._md-datepicker-has-calendar-icon .md-input-message-animation { margin-left: 64px; } [dir=rtl] ._md-datepicker-floating-label._md-datepicker-has-calendar-icon .md-input-message-animation { margin-left: auto; margin-right: 64px; } ._md-datepicker-has-triangle-icon { padding-right: 18px; margin-right: -18px; } [dir=rtl] ._md-datepicker-has-triangle-icon { padding-right: 0; padding-left: 18px; } [dir=rtl] ._md-datepicker-has-triangle-icon { margin-right: auto; margin-left: -18px; } .md-datepicker-input-container { position: relative; border-bottom-width: 1px; border-bottom-style: solid; display: inline-block; width: auto; } .md-icon-button + .md-datepicker-input-container { margin-left: 12px; } [dir=rtl] .md-icon-button + .md-datepicker-input-container { margin-left: auto; margin-right: 12px; } .md-datepicker-input-container.md-datepicker-focused { border-bottom-width: 2px; } .md-datepicker-is-showing .md-scroll-mask { z-index: 99; } .md-datepicker-calendar-pane { position: absolute; top: 0; left: -100%; z-index: 100; border-width: 1px; border-style: solid; background: transparent; -webkit-transform: scale(0); transform: scale(0); -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.25, 0.8, 0.25, 1); transition: -webkit-transform 0.2s cubic-bezier(0.25, 0.8, 0.25, 1); transition: transform 0.2s cubic-bezier(0.25, 0.8, 0.25, 1); transition: transform 0.2s cubic-bezier(0.25, 0.8, 0.25, 1), -webkit-transform 0.2s cubic-bezier(0.25, 0.8, 0.25, 1); } .md-datepicker-calendar-pane.md-pane-open { -webkit-transform: scale(1); transform: scale(1); } .md-datepicker-input-mask { height: 40px; width: 340px; position: relative; overflow: hidden; background: transparent; pointer-events: none; cursor: text; } .md-datepicker-calendar { opacity: 0; -webkit-transition: opacity 0.2s cubic-bezier(0.5, 0, 0.25, 1); transition: opacity 0.2s cubic-bezier(0.5, 0, 0.25, 1); } .md-pane-open .md-datepicker-calendar { opacity: 1; } .md-datepicker-calendar md-calendar:focus { outline: none; } .md-datepicker-expand-triangle { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid; } .md-datepicker-triangle-button { position: absolute; right: 0; bottom: -2.5px; -webkit-transform: translateX(45%); transform: translateX(45%); } [dir=rtl] .md-datepicker-triangle-button { right: auto; left: 0; } [dir=rtl] .md-datepicker-triangle-button { -webkit-transform: translateX(-45%); transform: translateX(-45%); } .md-datepicker-triangle-button.md-button.md-icon-button { height: 36px; width: 36px; position: absolute; padding: 8px; } md-datepicker[disabled] .md-datepicker-input-container { border-bottom-color: transparent; } md-datepicker[disabled] .md-datepicker-triangle-button { display: none; } .md-datepicker-open { overflow: hidden; } .md-datepicker-open .md-datepicker-input-container, .md-datepicker-open input.md-input { border-bottom-color: transparent; } .md-datepicker-open .md-datepicker-triangle-button, .md-datepicker-open.md-input-has-value > label, .md-datepicker-open.md-input-has-placeholder > label { display: none; } .md-datepicker-pos-adjusted .md-datepicker-input-mask { display: none; } .md-datepicker-calendar-pane .md-calendar { -webkit-transform: translateY(-85px); transform: translateY(-85px); -webkit-transition: -webkit-transform 0.65s cubic-bezier(0.25, 0.8, 0.25, 1); transition: -webkit-transform 0.65s cubic-bezier(0.25, 0.8, 0.25, 1); transition: transform 0.65s cubic-bezier(0.25, 0.8, 0.25, 1); transition: transform 0.65s cubic-bezier(0.25, 0.8, 0.25, 1), -webkit-transform 0.65s cubic-bezier(0.25, 0.8, 0.25, 1); -webkit-transition-delay: 0.125s; transition-delay: 0.125s; } .md-datepicker-calendar-pane.md-pane-open .md-calendar { -webkit-transform: translateY(0); transform: translateY(0); }