@mormat/jscheduler_ui/dist/jscheduler_ui.css

A javascript scheduler ui component

/**
 * @mormat/jscheduler_ui v0.9.7
 */

.jscheduler_ui {
    font: caption;
}

.jscheduler_ui-daysview {
    
}

.jscheduler_ui-daysview thead th {
    text-align: center;
    height: 20px;
}

.jscheduler_ui-daysview thead td {
    height: 10px;
}

.jscheduler_ui-daysview-columns tr:first-child {
    border-top: 1px solid #d3d3d3;
}

.jscheduler_ui-daysview-columns tr:last-child {
    border-bottom: 1px solid #d3d3d3;
}

.jscheduler_ui-daysview-columns th {
    color: rgba(0,0,0,.54);
    text-align: center;
    font-size: .9em;
    border-left: 1px solid #d3d3d3;
}

.jscheduler_ui-daysview-columns td {
    border-left: 1px solid #d3d3d3;
}

.jscheduler_ui-daysview-columns td:last-child {
    border-right: 1px solid #d3d3d3;
}

.jscheduler_ui-event {
    font-size: small;
}

.jscheduler_ui-event-day {
    padding: 3px;
}

.jscheduler_ui-event-timeline {
    padding-left: 3px;
}

/**
 * @todo the classname ends with 'vsep'
 * but it is actually a horizontal separator
 * same issue with classname ending with 'hsep'
 */
.jscheduler_ui-vsep {
    border-top: 1px dashed #d3d3d3;
}

.jscheduler_ui-month_view {
    border-collapse: collapse;
}

.jscheduler_ui-month_view th {
    text-align: center;
    padding-bottom: 5px;
}

.jscheduler_ui-month_view td {
    border: 1px solid #d3d3d3;
}

.jscheduler_ui-month_view-numday-inactive {
    opacity: 0.5;
}

.jscheduler_ui-year_view thead th {
    font-size: small;
    border-bottom: 1px solid #F5F5F5;
}

.jscheduler_ui-year_view tbody th {
    font-size: small;
}

.jscheduler_ui-year_view tbody td {
    background-color: #F5F5F5;
    border-bottom: 1px solid #F5F5F5;
}

.jscheduler_ui-year_view .jscheduler_ui-hsep {
    border-left: 1px dashed #d3d3d3;
}

.jscheduler_ui-year_view-monthday {
    font-size: x-small;
    text-align: right;
    padding: 0 3px 0 0;
}

.jscheduler_ui-dayoff {
    background-color: #eff9fa;
    opacity: 0.5;
}

.jscheduler_ui-hsep {
    border-left: 1px dashed #d3d3d3;
}

.jscheduler_ui-draggable {
    cursor: move;
}

.jscheduler_ui-resize-handler {
    cursor: ns-resize;
}

.jscheduler_ui-event a {
    text-decoration: none;
    color: inherit;
}

.jscheduler_ui-event:hover a {
    text-decoration: underline;
}

.jscheduler_ui-event-edit {
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
    z-index: 10;
}

.jscheduler_ui-event-edit svg {
    color: white;
    display: none;
}

.jscheduler_ui-event:hover .jscheduler_ui-event-edit svg { 
    display: inline;
}

.jscheduler_ui th[data-hour]{
    font-size: 0.9em;
}

.jscheduler_ui[data-breakpoint="small"] th[data-hour]{
    font-size: xx-small;
}

.jscheduler_ui[data-breakpoint="small"] .jscheduler_ui-daysview thead {
    font-size: x-small;
}

.jscheduler_ui[data-breakpoint="medium"] th[data-hour]{
    font-size: x-small;
}

.jscheduler_ui[data-breakpoint="medium"] .jscheduler_ui-daysview thead {
    font-size: small;
}

.jscheduler_ui-timeline thead {
    height: 5%;
}

.jscheduler_ui-timeline thead th {
    text-align: center;
}

.jscheduler_ui-timeline[data-type-view="day"] thead th {
    font-size: small;
}

.jscheduler_ui-timeline[data-type-view="month"] thead th {
    font-size: x-small;
}

.jscheduler_ui-timeline tbody td {
    border-bottom: 1px dotted gray;
    border-right: 1px dotted gray;
}

.jscheduler_ui-timeline tbody tr:first-child  td {
    border-top: 1px dotted gray;
}

.jscheduler_ui-timeline tbody th {
    border-bottom: 1px dotted gray;
    border-right: 1px dotted gray;
    border-left: 1px dotted gray;
    padding-left: 5px;
}

.jscheduler_ui-timeline tbody tr:first-child th {
    border-top: 1px dotted gray;
}

.jscheduler_ui-timeline .jscheduler_ui-disabled {
    color: gray;
}