src/widgets/EnrichedPlan.module.css
author ymh <ymh.work@gmail.com>
Tue, 22 Oct 2024 09:54:34 +0200
changeset 1080 2b513bcb710a
parent 1072 ac1eacb3aa33
permissions -rw-r--r--
increment version

.Ldt-EnrichedPlan-Slide {
    border-bottom: 2px dotted #ccc;
    padding-top: 4px;
    cursor: pointer;
}

.Ldt-EnrichedPlan-SlideItem {
    max-height: 3000px;
    transition: max-height .6s;
}

.Ldt-EnrichedPlan-SlideItem.filtered_out {
    max-height: 0px;
    overflow: hidden;
}

.Ldt-EnrichedPlan-SlideTimecode {
    display: inline-block;
    width: 24px;
    color: #999 !important;
    font-size: 9px !important;
    width: 24px;
    vertical-align: top;
}

.Ldt-EnrichedPlan-SlideThumbnail {
    display: inline-block;
    width: 180px;
    height: 100px;
    padding-left: 10px;
    margin: 0;
    vertical-align: top;
}

.Ldt-EnrichedPlan-SlideThumbnail img {
    max-width: 180px;
    max-height: 100px;
    margin: auto;
    border: 1px solid #ccc;
}

.Ldt-EnrichedPlan-SlideContent {
    display: inline-block;
    width: calc(100% - 220px);
    transition: width .4s;
}

.Ldt-EnrichedPlan-SlideThumbnail.filtered_out + .Ldt-EnrichedPlan-SlideContent {
    width: calc(100% - 40px);
}

.Ldt-EnrichedPlan-SlideTitle {
    display: inline-block;
    font-size: 14px;
    width: 100%;
    height: 1em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.Ldt-EnrichedPlan-SlideTitle1 {
    text-transform: uppercase;
    font-size: 13px;
    font-weight: 600;
}

.Ldt-EnrichedPlan-Note {
    font-weight: normal;
    font-size: 14px;
    font-family: Roboto-italic;
}
.Ldt-EnrichedPlan-Note:hover {
    background-color: #eee;
}

.Ldt-EnrichedPlan-Note-Teacher {
    color: #e5007e;
    font-style: italic;
}
.Ldt-EnrichedPlan-Note-Own {
    color: #66ccff;
}
.Ldt-EnrichedPlan-Note-Other {
    color: #996633;
}

.Ldt-EnrichedPlan-Note-Text {
    line-height: 22px;
    word-wrap: break-word;
}

.Ldt-EnrichedPlan-Note-Author {
    text-transform: uppercase;
    font-size: 10px;
}

.Ldt-EnrichedPlan-Content {
    margin-top: 37px;
}

.Ldt-EnrichedPlan-Controls {
    height: 36px;
    padding: 9px 0px 6px 0px;
    border-bottom: 1px solid #000;
    overflow-y: hidden;
    overflow-x: hidden;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 1;
    background-color: #fff;
}

.Ldt-EnrichedPlan-Control-Label {
    display: inline-block;
    text-transform: uppercase;
    line-height: 10px;
    font-family: Roboto;
    font-size: 10px;
    font-weight: 100;
    width: 80px;
    position: relative;
}
.Ldt-EnrichedPlan-Controls .Ldt-EnrichedPlan-Search-Input {
    float: right;
    font-family: Roboto;
    font-size: 16px;
    width: calc(100% - 340px);
}

.Ldt-EnrichedPlan-Note.non_matching {
    display: none;
}

.Ldt-EnrichedPlan-Control- {
    font-style: normal;
}
    /**********************************************************/
/* Base for label styling */
.Ldt-EnrichedPlan-Control-Checkbox:not(:checked),
.Ldt-EnrichedPlan-Control-Checkbox:checked {
  position: absolute;
  left: -9999px;
}
.Ldt-EnrichedPlan-Control-Checkbox:not(:checked) + label,
.Ldt-EnrichedPlan-Control-Checkbox:checked + label {
  position: relative;
  padding-left: 20px;
  cursor: pointer;
}

/* checkbox aspect */
.Ldt-EnrichedPlan-Control-Checkbox:not(:checked) + label:before,
.Ldt-EnrichedPlan-Control-Checkbox:checked + label:before {
  content: '';
  position: absolute;
  left:0; top: 2px;
  width: 13px; height: 13px;
  border: 1px solid #aaa;
}
/* checked mark aspect */
.Ldt-EnrichedPlan-Control-Checkbox:not(:checked) + label:after,
.Ldt-EnrichedPlan-Control-Checkbox:checked + label:after {
    content: '\2a2f';
    font-style: normal;
    position: absolute;
    top: 3px; left: -1px;
    font-size: 20px;
    transition: all .2s;
}
/* checked mark aspect changes */
.Ldt-EnrichedPlan-Control-Checkbox:not(:checked) + label:after {
  opacity: 0;
}
.Ldt-EnrichedPlan-Control-Checkbox:checked + label:after {
  opacity: 1;
}
/* disabled checkbox */
.Ldt-EnrichedPlan-Control-Checkbox:disabled:not(:checked) + label:before,
.Ldt-EnrichedPlan-Control-Checkbox:disabled:checked + label:before {
  box-shadow: none;
  border-color: #bbb;
  background-color: #ddd;
}
.Ldt-EnrichedPlan-Control-Checkbox:disabled:checked + label:after {
  color: #999;
}
.Ldt-EnrichedPlan-Control-Checkbox:disabled + label {
  color: #aaa;
}
/* accessibility */
.Ldt-EnrichedPlan-Control-Checkbox:checked:focus + label:before,
.Ldt-EnrichedPlan-Control-Checkbox:not(:checked):focus + label:before {
  border: 1px dotted blue;
}

/* hover style just for information */
label:hover:before {
  border: 1px solid #4778d9!important;
}

/* hover style just for information */
label:hover:before {
    background-color: #ededed;
}