com.phloxui/styles/component/editor/DefaultCalendarEntryListPopover.less

PhloxUI Ng2+ Framework

.phx-default-calendar-entry-list-popover{
  width: 100%;
  height: 100%;

  >.header{
    background-color: @CLR_BRAND;
    height: 30%;
    padding: @DEFAULT_CALENDAR_ENTRY_LIST_POPOVER_PADDING;
    position: relative;

    >.left{
      display: none;
      width: 20%;
      height: 100%;
      float: left;

      &.show{
        display: inline-block;
      }

      .left-angle{
        color: extract(@CLR_1, 9);
      }
    }

    >.right{
      width: 80%;
      height: 100%;
      float: right;

      &.expand{
        width: 100%;

        .info{
          width: 100%;
          text-align: left;
        }

        .more{
          display: none;
        }
      }

      .info{
        color: extract(@CLR_1, 9);
        float: left;
        width: 90%;
        height: 100%;
        text-align: right;
        padding-right: 5pt;

        >div:first-child{
          .FH1();
          height: 70%;

          &.expand{
            height: 100%;
          }
        }

        >div:last-child{
          .FC1L();
          height: 30%;
        }
      }

      .more{
        float: left;
        display: block;
        width: 10%;
        height: 100%;

        .vertical-ellipsis{
          color: extract(@CLR_1, 9);
          text-align: right;
        }
      }
    }
  }

  >.body{
    height: 70%;
    overflow-y: auto;
    position: relative;

    >div{
      display: none;

      &.show{
        display: block;
      }
    }

    >.list{
      >.row{
        width: 100%;
        height: 30pt;
        border-bottom: @PHLOX_TABLE_THEAD_BORDER_THICKNESS solid @CLR_BORDER_COLOR;
        padding-left: @DEFAULT_CALENDAR_ENTRY_LIST_POPOVER_PADDING;
        padding-right: @DEFAULT_CALENDAR_ENTRY_LIST_POPOVER_PADDING;
        position: relative;
        overflow: hidden;

        .left{
          .FC0L();
          float: left;
          width: 50%;
        }

        .right{
          color: extract(@CLR_S, 6);
          float: right;
          width: 50%;
          text-align: right;
        }
      }
    }

    >.form{
      .phx-default-entry-editor-popover {
        padding-left: 15pt;
        padding-top: 10pt;
      }
    }
  }
}