src/widgets/EnrichedPlan.module.css
changeset 1072 ac1eacb3aa33
parent 1068 7623f9af9272
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/widgets/EnrichedPlan.module.css	Wed Sep 04 17:32:50 2024 +0200
@@ -0,0 +1,207 @@
+.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;
+}