angular-material-event-calendar/dist/angular-material-event-calendar.css

Angular material event calander component

md-event-calendar:not(._md) md-event-calendar-header {
  color: #666;
  background: #FFF;
  border-color: #DDD; }
  md-event-calendar:not(._md) md-event-calendar-header md-event-calendar-next .md-arrow svg, md-event-calendar:not(._md) md-event-calendar-header md-event-calendar-prev .md-arrow svg {
    fill: #666; }

md-event-calendar:not(._md) .md-button:not([disabled]) {
  color: #333; }
  md-event-calendar:not(._md) .md-button:not([disabled]):hover {
    background: rgba(158, 158, 158, 0.2); }

md-event-calendar:not(._md) .md-button[disabled] {
  color: #CCC; }

md-event-calendar:not(._md) md-event-calendar-month .md-event-calendar-month-row-header {
  color: #999;
  background: #FFF;
  border-color: #DDD; }

md-event-calendar:not(._md) md-event-calendar-month .md-event-calendar-month-row {
  background: #FFF;
  border-color: #DDD; }
  md-event-calendar:not(._md) md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell-divider {
    border-color: #DDD; }
  md-event-calendar:not(._md) md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell {
    border-color: #DDD; }
    md-event-calendar:not(._md) md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell .md-event-calendar-month-cell-content .md-event-calendar-create-link {
      color: #4189b8; }
    md-event-calendar:not(._md) md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell .md-event-calendar-month-cell-content .md-event-calendar-cell-data-label {
      color: #999; }
    md-event-calendar:not(._md) md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell .md-event-calendar-month-cell-content .md-event-calendar-cell-event-show-more-link {
      color: #4189b8; }
    md-event-calendar:not(._md) md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell.different-month {
      background: #F5F5F5; }
    md-event-calendar:not(._md) md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell.today {
      box-shadow: inset 0px 0px 0px 1px #AAA; }
      md-event-calendar:not(._md) md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell.today .md-event-calendar-month-cell-content .md-event-calendar-cell-data-label {
        color: #666; }
      md-event-calendar:not(._md) md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell.today .md-event-calendar-month-cell-divider {
        border-color: #AAA; }
    md-event-calendar:not(._md) md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell:last-child {
      border-color: #DDD; }

md-event-calendar:not(._md) .md-event-calendar-cell-event {
  background: #DDD;
  color: #666; }
  md-event-calendar:not(._md) .md-event-calendar-cell-event.md-selected {
    color: #EEE;
    background: #888; }
  md-event-calendar:not(._md) .md-event-calendar-cell-event.md-continue-left:after, md-event-calendar:not(._md) .md-event-calendar-cell-event.md-end-left:after {
    border-right-color: #DDD; }
  md-event-calendar:not(._md) .md-event-calendar-cell-event.md-continue-right:after, md-event-calendar:not(._md) .md-event-calendar-cell-event.md-start-right:after {
    border-left-color: #DDD; }
  md-event-calendar:not(._md) .md-event-calendar-cell-event.md-selected.md-continue-left:after, md-event-calendar:not(._md) .md-event-calendar-cell-event.md-selected.md-end-left:after {
    border-right-color: #888; }
  md-event-calendar:not(._md) .md-event-calendar-cell-event.md-selected.md-continue-right:after, md-event-calendar:not(._md) .md-event-calendar-cell-event.md-selected.md-start-right:after {
    border-left-color: #888; }

md-event-calendar:not(._md) .md-event-calendar-show-more-container .md-event-calendar-show-more-date-label {
  color: #999; }

md-event-calendar:not(._md) .md-event-calendar-show-more-container .md-event-calendar-show-more-close svg {
  fill: #999; }

md-event-calendar {
  display: block; }
  md-event-calendar md-event-calendar-header {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    line-height: 64px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    border-style: solid;
    border-width: 1px 1px 0 1px; }
    md-event-calendar md-event-calendar-header.md-center {
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center; }
    md-event-calendar md-event-calendar-header md-event-calendar-title {
      display: block;
      min-width: 170px;
      text-align: center;
      font-size: 20px; }
    md-event-calendar md-event-calendar-header md-event-calendar-next, md-event-calendar md-event-calendar-header md-event-calendar-prev {
      display: block; }
      md-event-calendar md-event-calendar-header md-event-calendar-next .md-arrow, md-event-calendar md-event-calendar-header md-event-calendar-prev .md-arrow {
        cursor: pointer;
        height: 24px;
        width: 24px; }
        md-event-calendar md-event-calendar-header md-event-calendar-next .md-arrow.md-left-arrow, md-event-calendar md-event-calendar-header md-event-calendar-prev .md-arrow.md-left-arrow {
          -webkit-transform: rotate(180deg);
                  transform: rotate(180deg); }

md-event-calendar .md-event-calendar-month-cell-content .md-event-calendar-create-link {
  opacity: 0; }

md-event-calendar .md-event-calendar-month-cell-content:hover .md-event-calendar-create-link {
  opacity: 1; }

md-event-calendar md-event-calendar-month.md-event-hover .md-event-calendar-month-cell-content .md-event-calendar-create-link {
  opacity: 0; }

md-event-calendar md-event-calendar-month.fitted {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column; }

md-event-calendar md-event-calendar-month .md-event-calendar-month-row-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  min-height: 36px;
  height: 36px;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  font-size: 12px;
  font-weight: 500;
  padding-bottom: 12px;
  border-style: solid;
  border-width: 0 1px 1px 1px; }
  md-event-calendar md-event-calendar-month .md-event-calendar-month-row-header .md-event-calendar-month-cell-header {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    padding-left: 6px; }

md-event-calendar md-event-calendar-month .md-event-calendar-month-row {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  border-style: solid;
  border-width: 0 0 1px 0; }
  md-event-calendar md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell {
    position: relative;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1; }
    md-event-calendar md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell .md-event-calendar-month-cell-spacer {
      margin-top: 100%; }
    md-event-calendar md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell .md-event-calendar-month-cell-divider {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      border-style: solid;
      border-width: 0 1px 0 0; }
    md-event-calendar md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell .md-event-calendar-month-cell-content {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0; }
      md-event-calendar md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell .md-event-calendar-month-cell-content .md-event-calendar-create-link {
        -ms-flex-item-align: center;
            align-self: center;
        text-transform: uppercase;
        font-size: 14px;
        font-weight: 500;
        padding-right: 12px;
        cursor: pointer;
        -webkit-transition: opacity 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
        transition: opacity 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); }
      md-event-calendar md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell .md-event-calendar-month-cell-content .md-event-calendar-cell-data-label {
        font-size: 13px;
        padding: 8px;
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1; }
      md-event-calendar md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell .md-event-calendar-month-cell-content .md-event-calendar-cell-event-spacer {
        margin: 4px 0 4px 0;
        height: 23px; }
      md-event-calendar md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell .md-event-calendar-month-cell-content .md-event-calendar-cell-event-show-more-link {
        font-size: 13px;
        padding: 4px;
        padding-left: 8px;
        cursor: pointer; }
    md-event-calendar md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell:last-child {
      border-style: solid;
      border-width: 0 1px 0 0; }

md-event-calendar .md-event-calendar-cell-event {
  font-size: 12px;
  min-height: 15px;
  padding: 4px;
  cursor: pointer; }
  md-event-calendar .md-event-calendar-cell-event.md-single {
    margin: 4px;
    border-radius: 2px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden; }
  md-event-calendar .md-event-calendar-cell-event.md-start {
    margin: 4px 0 4px 4px;
    border-radius: 2px 0 0 2px;
    white-space: nowrap;
    z-index: 1;
    position: relative; }
  md-event-calendar .md-event-calendar-cell-event.md-start-right {
    margin: 4px 13px 4px 4px;
    border-radius: 2px 0 0 2px; }
  md-event-calendar .md-event-calendar-cell-event.md-end {
    margin: 4px 4px 4px 0;
    border-radius: 0 2px 2px 0; }
  md-event-calendar .md-event-calendar-cell-event.md-end-left {
    margin: 4px 4px 4px 13px;
    border-radius: 0 2px 2px 0; }
  md-event-calendar .md-event-calendar-cell-event.md-continue, md-event-calendar .md-event-calendar-cell-event.md-continue-both {
    margin: 4px 0 4px 0;
    border-radius: 0; }
  md-event-calendar .md-event-calendar-cell-event.md-continue-right {
    margin: 4px 13px 4px 0;
    border-radius: 0;
    white-space: nowrap; }
  md-event-calendar .md-event-calendar-cell-event.md-continue-left {
    margin: 4px 0 4px 13px;
    border-radius: 0;
    white-space: nowrap; }
  md-event-calendar .md-event-calendar-cell-event.md-continue-right:after, md-event-calendar .md-event-calendar-cell-event.md-start-right:after {
    content: '';
    position: absolute;
    height: 0;
    width: 0;
    right: 0;
    margin-top: -4px;
    border-top: 12px solid transparent;
    border-bottom: 11.5px solid transparent;
    border-left: 13px solid #EEE; }
  md-event-calendar .md-event-calendar-cell-event.md-continue-left:after, md-event-calendar .md-event-calendar-cell-event.md-end-left:after {
    content: '';
    position: absolute;
    height: 0;
    width: 0;
    left: 0;
    margin-top: -4px;
    border-top: 12px solid transparent;
    border-bottom: 11.5px solid transparent;
    border-right: 13px solid #EEE; }
  md-event-calendar .md-event-calendar-cell-event .md-event-calendar-cell-event-time {
    font-weight: 500;
    padding-right: 6px;
    pointer-events: none; }
  md-event-calendar .md-event-calendar-cell-event span {
    pointer-events: none; }

md-event-calendar .md-event-calendar-show-more-content .md-event-calendar-cell-event.md-single, md-event-calendar .md-event-calendar-show-more-content .md-event-calendar-cell-event.md-end, md-event-calendar .md-event-calendar-show-more-content .md-event-calendar-cell-event.md-start-right {
  padding-left: 16px; }

md-event-calendar .md-event-calendar-show-more-content .md-event-calendar-cell-event.md-single, md-event-calendar .md-event-calendar-show-more-content .md-event-calendar-cell-event.md-end, md-event-calendar .md-event-calendar-show-more-content .md-event-calendar-cell-event.md-start-right {
  margin-left: 0; }

md-event-calendar .md-event-calendar-show-more-content .md-event-calendar-cell-event.md-single, md-event-calendar .md-event-calendar-show-more-content .md-event-calendar-cell-event.md-end, md-event-calendar .md-event-calendar-show-more-content .md-event-calendar-cell-event.md-end-left {
  margin-right: 0; }

md-event-calendar .md-event-calendar-show-more-container {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 1px;
  width: 180px;
  background: #FFF;
  padding: 12px;
  padding-top: 7px;
  border-radius: 2px;
  z-index: 9;
  box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14), 0 5px 24px 4px rgba(0, 0, 0, 0.12); }
  md-event-calendar .md-event-calendar-show-more-container .md-event-calendar-show-more-content {
    position: relative; }
  md-event-calendar .md-event-calendar-show-more-container.show {
    opacity: 1; }
    md-event-calendar .md-event-calendar-show-more-container.show:not(.no-transition) {
      -webkit-transition: opacity 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
      transition: opacity 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); }
  md-event-calendar .md-event-calendar-show-more-container .md-event-calendar-show-more-close {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    top: 6px;
    right: 7px;
    width: 16px;
    height: 16px;
    cursor: pointer; }
    md-event-calendar .md-event-calendar-show-more-container .md-event-calendar-show-more-close svg {
      pointer-events: none; }
  md-event-calendar .md-event-calendar-show-more-container .md-event-calendar-show-more-date-label {
    font-size: 13px;
    padding: 6px;
    margin-left: -11px;
    margin-top: -5px; }

md-event-calendar.md-create-disabled md-event-calendar-month .md-event-calendar-month-row .md-event-calendar-month-cell .md-event-calendar-month-cell-content .md-event-calendar-create-link {
  display: none; }