src/widgets/Quiz.css
changeset 1072 ac1eacb3aa33
parent 1071 02c04d2c8fd8
child 1073 687133dc13cf
equal deleted inserted replaced
1071:02c04d2c8fd8 1072:ac1eacb3aa33
     1 /* Nothing */
       
     2 
       
     3 .Ldt-Quiz-Container {
       
     4   	position: absolute;
       
     5   	height: calc(100% - 4px);
       
     6   	top: 0px;
       
     7   	width: calc(100% - 20px);
       
     8 	margin: auto;
       
     9 	border: 1px solid black;
       
    10 	font-size: 18pt;
       
    11 }
       
    12 
       
    13 .Ldt-Quiz-Title {
       
    14     line-height: 1;
       
    15     padding-top: 10px;
       
    16     text-align: center;
       
    17 }
       
    18 
       
    19 .Ldt-Quiz-Header {
       
    20 	font-size: 12px;
       
    21 	color: black;
       
    22 	border-bottom: 1px solid green;
       
    23 	padding: 2px;
       
    24     height: 22px;
       
    25 }
       
    26 
       
    27 .Ldt-Quiz-Content {
       
    28     height: calc(100% - 82px);
       
    29     overflow-y: auto;
       
    30 }
       
    31 
       
    32 .Ldt-Quiz-Footer {
       
    33     height: 60px;
       
    34 	width: 100%;
       
    35 	position: absolute;
       
    36 	bottom: 0px;
       
    37 	border-top: 2px solid black;
       
    38 	background-color: white;
       
    39 }
       
    40 
       
    41 
       
    42 .Ldt-Quiz-Score {
       
    43 	display: inline-block;
       
    44 	position: absolute;
       
    45 	right: 20px;
       
    46 }
       
    47 
       
    48 .Ldt-Quiz-Index {
       
    49 	display: inline-block;
       
    50 }
       
    51 
       
    52 .Ldt-Quiz-Image {
       
    53     max-width: 100%;
       
    54     max-height: 100%;
       
    55 }
       
    56 
       
    57 .Ldt-Quiz-Questions {
       
    58     height: calc(100% - 2.5em);
       
    59     margin: 10px;
       
    60     padding: 10px;
       
    61     border-left: 5px solid gray;
       
    62 }
       
    63 
       
    64 .quiz-question-block {
       
    65     padding-top: 10px;
       
    66 }
       
    67 .quiz-resource-block {
       
    68     padding-top: 10px;
       
    69     float: right;
       
    70     max-height: 100%;
       
    71     height: 100%;
       
    72 }
       
    73 .quiz-resource-block img {
       
    74     max-height: 100%;
       
    75     max-width: 100%;
       
    76 }
       
    77 
       
    78 .quiz-question-feedback {
       
    79 	font-size: 15px;
       
    80 }
       
    81 
       
    82 .quiz-question-feedback div {
       
    83     display: inline-block;
       
    84 	height: 100%;
       
    85 }
       
    86 
       
    87 .quiz-question-correct-feedback:before, .quiz-question-incorrect-feedback:before {
       
    88 		                                    content: '';
       
    89 		                                    vertical-align: middle;
       
    90 		                                    display: inline-block;
       
    91 		                                    width: 48px;
       
    92 		                                    height: 48px;
       
    93                                         }
       
    94 
       
    95 .quiz-question-correct-feedback:before {
       
    96 	background: url(img/valid_sprites.png) left top no-repeat;
       
    97 }
       
    98 
       
    99 .quiz-question-incorrect-feedback:before {
       
   100 	background: url(img/valid_sprites.png) -49px top no-repeat;
       
   101 }
       
   102 
       
   103 .Ldt-Quiz-Correct-Answer:before {
       
   104 	background: url(img/min_valid_sprites.png) left top no-repeat;
       
   105 }
       
   106 
       
   107 .Ldt-Quiz-Incorrect-Answer:before {
       
   108 	background: url(img/min_valid_sprites.png) -13px top no-repeat;
       
   109 }
       
   110 
       
   111 .Ldt-Quiz-Correct-Answer:before, .Ldt-Quiz-Incorrect-Answer:before {
       
   112 		                              content: '';
       
   113 		                              vertical-align: middle;
       
   114 		                              display: inline-block;
       
   115 		                              width: 12px;
       
   116 		                              height: 12px;
       
   117                                   }
       
   118 
       
   119 .Ldt-Quiz-Submit {
       
   120     margin: 10px;
       
   121 }
       
   122 
       
   123 .Ldt-Quiz-Submit .Ldt-Quiz-Submit-Skip-Link {
       
   124     float: left;
       
   125 }
       
   126 
       
   127 .Ldt-Quiz-Submit-Skip-Link a {
       
   128     text-decoration: none;
       
   129     font-size: 16pt;
       
   130 }
       
   131 
       
   132 .Ldt-Quiz-Submit .Ldt-Quiz-Submit-Button {
       
   133     float: right;
       
   134 }
       
   135 
       
   136 .Ldt-Quiz-Votes {
       
   137     display: none;
       
   138     height: 53px;
       
   139     position: relative;
       
   140 }
       
   141 
       
   142 .Ldt-Quiz-Votes-Question {
       
   143     font-size: 16px;
       
   144     position: absolute;
       
   145     top: 2px;
       
   146     left: 0px;
       
   147 }
       
   148 
       
   149 .Ldt-Quiz-Votes-Buttons {
       
   150     position: absolute;
       
   151     bottom: 2px;
       
   152     left: 0px;
       
   153     right: 0px;
       
   154 }
       
   155 
       
   156 .Ldt-Quiz-Votes-Buttons div {
       
   157     display: inline-block;
       
   158     width: 33%;
       
   159     text-align: center;
       
   160 }
       
   161 
       
   162 .Ldt-Quiz-Vote-Skip-Block {
       
   163     width: 30% !important;
       
   164     text-align: right;
       
   165 }
       
   166 
       
   167 .Ldt-Quiz-Vote-Skip-Block a {
       
   168     text-decoration: none;
       
   169 }
       
   170 
       
   171 .Ldt-Quiz-Overlay {
       
   172     position: absolute;
       
   173     top: 0px;
       
   174     background-color: white;
       
   175     z-index: 5;
       
   176     width: 100%;
       
   177     height: 100%;
       
   178 }
       
   179 
       
   180 .Ldt-Pause-Add-Question {
       
   181     background: url(img/quiz_add_question.svg) no-repeat;
       
   182     background-position: center;
       
   183     background-size: contain;
       
   184   	position: absolute;
       
   185     bottom: 40px;
       
   186     right: 0px;
       
   187     height: 15%;
       
   188     width: 15%;
       
   189     max-width: 64px;
       
   190     max-height: 64px;
       
   191     z-index: 10;
       
   192 }
       
   193 
       
   194 .Ldt-Quiz-Result {
       
   195     position: absolute;
       
   196 	height: 0px;
       
   197     bottom: 0;
       
   198     left: 0;
       
   199     right: 0;
       
   200     background: #fde073;
       
   201     text-align: center;
       
   202     line-height: 2.5;
       
   203     overflow: hidden;
       
   204     -webkit-box-shadow: 0 0 5px black;
       
   205     -moz-box-shadow:    0 0 5px black;
       
   206     box-shadow:         0 0 5px black;
       
   207 }
       
   208 
       
   209 input[type="button"] {
       
   210     border: none;
       
   211     font-size: 18pt;
       
   212     text-align: center;
       
   213     background-color: #5BCE5B;
       
   214     color: #fff;
       
   215     cursor: pointer;
       
   216 }
       
   217 
       
   218 input[value="Non"] {
       
   219     background-color: #F86060;
       
   220 }
       
   221 
       
   222 input.quiz-question:checked + .quiz-question-label {
       
   223     text-decoration: underline;
       
   224 }