annotate css/core.css @ 2971:d962cce75063

#262 SessionKey refactoring typo
author Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk>
date Fri, 12 Jan 2018 13:20:06 +0000
parents b2dcdd55721d
children 2020be3c592c
rev   line source
nicholas@2224 1 /* structure.css
nicholas@2224 2 * Define the structure for classes and objects in HTML
nicholas@2224 3 */
nicholas@2224 4
nicholas@2224 5 div.title {
nicholas@2538 6 width: 100%;
nicholas@2538 7 height: 50px;
nicholas@2538 8 margin-bottom: 10px;
nicholas@2538 9 font-size: 2em;
nicholas@2224 10 }
nicholas@2842 11 div#footer {
nicholas@2842 12 position: fixed;
nicholas@2842 13 bottom: 0px;
nicholas@2842 14 width: 100%;
nicholas@2842 15 text-align: center;
nicholas@2842 16 }
nicholas@2224 17 div.indicator-box {
nicholas@2538 18 position: absolute;
nicholas@2538 19 left: 150px;
nicholas@2538 20 top: 10px;
nicholas@2538 21 width: 300px;
nicholas@2538 22 height: 60px;
nicholas@2538 23 padding: 20px;
nicholas@2538 24 border-radius: 10px;
nicholas@2538 25 background-color: rgb(100, 200, 200);
nicholas@2224 26 }
nicholas@2224 27 div.comment-div {
nicholas@2538 28 border: 1px solid #444444;
nicholas@2538 29 max-width: 600px;
nicholas@2538 30 min-width: 400px;
nicholas@2538 31 float: left;
nicholas@2538 32 margin: 5px 10px 5px 5px;
nicholas@2538 33 height: 90px;
nicholas@2224 34 border-radius: 10px;
nicholas@2224 35 }
nicholas@2224 36 div.comment-div span {
nicholas@2538 37 margin-left: 15px;
nicholas@2224 38 }
nicholas@2224 39 div.popupHolder {
nicholas@2538 40 width: 500px;
nicholas@2538 41 min-height: 250px;
nicholas@2538 42 max-height: 400px;
nicholas@2538 43 background-color: #fff;
nicholas@2538 44 border-radius: 10px;
nicholas@2538 45 box-shadow: 0px 0px 50px #000;
nicholas@2538 46 z-index: 10;
nicholas@2538 47 position: fixed;
nicholas@2224 48 }
nicholas@2224 49 div#popupContent {
nicholas@2224 50 margin-top: 20px;
nicholas@2224 51 margin-bottom: 35px;
giuliomoro@2339 52 overflow: auto;
nicholas@2224 53 }
nicholas@2491 54 div#popupContent iframe {
nicholas@2491 55 width: 100%;
nicholas@2491 56 border: 0px none;
nicholas@2491 57 height: 290px;
nicholas@2491 58 }
nicholas@2285 59 div#popupTitleHolder {
nicholas@2224 60 width: inherit;
nicholas@2224 61 min-height: 25px;
nicholas@2224 62 max-height: 250px;
nicholas@2224 63 overflow: auto;
nicholas@2224 64 margin-bottom: 5px;
giuliomoro@2339 65 padding: 8px;
nicholas@2344 66 text-align: center;
giuliomoro@2339 67 }
nicholas@2224 68 div#popupResponse {
nicholas@2224 69 width: inherit;
nicholas@2224 70 min-height: 50px;
nicholas@2738 71 max-height: 270px;
nicholas@2224 72 overflow: auto;
nicholas@2224 73 position: relative;
nicholas@2738 74 margin-bottom: 10px;
nicholas@2224 75 }
nicholas@2224 76 button.popupButton {
nicholas@2538 77 /* Button for popup window
nicholas@2224 78 */
nicholas@2538 79 width: 50px;
nicholas@2538 80 height: 25px;
nicholas@2538 81 position: absolute;
nicholas@2538 82 border-radius: 5px;
nicholas@2538 83 border: #444;
nicholas@2538 84 border-width: 1px;
nicholas@2538 85 border-style: solid;
nicholas@2538 86 background-color: #fff;
nicholas@2224 87 }
n@2926 88 div.popup-option-checkbox {
nicholas@2224 89 /* Popup window checkbox */
nicholas@2224 90 padding: 5px;
nicholas@2224 91 width: fit-content;
nicholas@2224 92 width: -moz-fit-content;
nicholas@2224 93 width: -webkit-fit-content;
nicholas@2224 94 }
n@2926 95 div.popup-option-checkbox input {
nicholas@2224 96 /* Popup window checkbox */
nicholas@2224 97 margin-right: 15px;
nicholas@2224 98 }
nicholas@2346 99 table.popup-option-list {
nicholas@2346 100 margin: auto;
nicholas@2346 101 }
nicholas@2346 102 table.popup-option-list tr {
nicholas@2346 103 padding: 5px;
nicholas@2346 104 }
nicholas@2346 105 table.popup-option-list tr td {
nicholas@2346 106 padding: 5px;
nicholas@2346 107 }
n@2583 108 div.survey-slider-text-holder {
n@2583 109 display: flex;
n@2583 110 flex-direction: row;
n@2583 111 justify-content: space-between;
n@2583 112 padding: 0px 15px;
n@2583 113 }
nicholas@2224 114 button#popup-proceed {
nicholas@2224 115 bottom: 10px;
nicholas@2224 116 right: 10px;
nicholas@2224 117 }
nicholas@2224 118 button#popup-previous {
nicholas@2224 119 bottom: 10px;
nicholas@2224 120 left: 10px;
nicholas@2224 121 }
nicholas@2224 122 div.testHalt {
nicholas@2538 123 /* Specify any colouring during the test halt for pre/post questions */
nicholas@2538 124 background-color: rgba(0, 0, 0, 0.5);
nicholas@2538 125 /* Don't mess with this bit */
nicholas@2538 126 z-index: 9;
nicholas@2538 127 width: 100%;
nicholas@2538 128 height: 100%;
nicholas@2538 129 position: fixed;
nicholas@2538 130 left: 0px;
nicholas@2538 131 top: 0px;
nicholas@2224 132 }
nicholas@2360 133 div#lightbox-root {
nicholas@2360 134 visibility: hidden;
nicholas@2360 135 z-index: 20;
nicholas@2360 136 top: 25px;
nicholas@2360 137 min-height: 50px;
nicholas@2360 138 max-height: 250px;
nicholas@2360 139 }
nicholas@2360 140 div.lightbox-error {
nicholas@2360 141 margin: 25px;
nicholas@2360 142 margin-bottom: 50px;
nicholas@2360 143 padding: 5px;
nicholas@2360 144 border-radius: 5px;
nicholas@2538 145 background-color: rgb(255, 220, 220);
nicholas@2538 146 border: 2px rgb(200, 0, 0) solid;
nicholas@2360 147 }
nicholas@2360 148 div.lightbox-warning {
nicholas@2360 149 margin: 25px;
nicholas@2360 150 margin-bottom: 50px;
nicholas@2360 151 padding: 5px;
nicholas@2360 152 border-radius: 5px;
nicholas@2538 153 background-color: rgb(255, 255, 220);
nicholas@2538 154 border: 2px rgb(255, 250, 0) solid;
nicholas@2360 155 }
nicholas@2360 156 div.lightbox-message {
nicholas@2360 157 margin: 25px;
nicholas@2360 158 margin-bottom: 50px;
nicholas@2360 159 padding: 5px;
nicholas@2360 160 border-radius: 5px;
nicholas@2538 161 background-color: rgb(200, 220, 255);
nicholas@2538 162 border: 2px rgb(50, 100, 250) solid;
nicholas@2360 163 }
nicholas@2360 164 div#lightbox-blanker {
nicholas@2360 165 visibility: hidden;
nicholas@2360 166 z-index: 19;
nicholas@2360 167 }
nicholas@2224 168 button.outside-reference {
nicholas@2538 169 width: 120px;
nicholas@2538 170 height: 20px;
nicholas@2538 171 margin-bottom: 5px;
nicholas@2538 172 position: absolute;
nicholas@2224 173 }
nicholas@2224 174 textarea.trackComment {
nicholas@2538 175 max-width: 594px;
nicholas@2538 176 min-width: 350px;
nicholas@2538 177 max-height: 60px;
nicholas@2224 178 resize: none;
nicholas@2224 179 }
nicholas@2224 180 div.playhead {
nicholas@2538 181 width: 500px;
nicholas@2538 182 height: 50px;
nicholas@2538 183 background-color: #eee;
nicholas@2538 184 border-radius: 10px;
nicholas@2538 185 padding: 10px;
nicholas@2224 186 }
nicholas@2224 187 div.playhead-scrub-track {
nicholas@2538 188 width: 100%;
nicholas@2538 189 height: 10px;
nicholas@2538 190 border-style: solid;
nicholas@2538 191 border-width: 1px;
nicholas@2224 192 }
nicholas@2224 193 div#playhead-scrubber {
nicholas@2538 194 width: 10px;
nicholas@2538 195 height: 10px;
nicholas@2538 196 position: relative;
nicholas@2538 197 background-color: #000;
nicholas@2224 198 }
nicholas@2352 199 div.master-volume-holder-inline {
nicholas@2352 200 width: 100%;
nicholas@2352 201 padding: 5px;
nicholas@2352 202 }
nicholas@2352 203 div.master-volume-holder-float {
nicholas@2352 204 position: absolute;
nicholas@2352 205 top: 20px;
nicholas@2352 206 left: 50px;
nicholas@2773 207 width: 250px;
nicholas@2352 208 padding: 5px;
nicholas@2352 209 }
nicholas@2352 210 div#master-volume-root {
nicholas@2538 211 margin: auto;
nicholas@2224 212 border: black 1px solid;
nicholas@2224 213 border-radius: 5px;
nicholas@2352 214 width: 250px;
nicholas@2352 215 height: 40px;
nicholas@2224 216 }
nicholas@2224 217 input#master-volume-control {
nicholas@2669 218 width: 190px;
nicholas@2224 219 height: 25px;
nicholas@2224 220 float: left;
nicholas@2224 221 margin: 0px;
nicholas@2224 222 padding: 0px;
nicholas@2224 223 }
nicholas@2224 224 span#master-volume-feedback {
nicholas@2224 225 height: 25px;
nicholas@2669 226 margin: 0px 5px;
nicholas@2669 227 float: right;
nicholas@2224 228 }
nicholas@2224 229 div.error-colour {
nicholas@2224 230 background-color: #FF8F8F;
nicholas@2224 231 }
nicholas@2224 232 button.error-colour {
nicholas@2224 233 background-color: #FF8F8F;
nicholas@2224 234 color: black;
nicholas@2224 235 }
nicholas@2224 236 div.calibration-holder {
nicholas@2224 237 text-align: center;
nicholas@2224 238 align-content: center;
nicholas@2224 239 height: auto;
nicholas@2224 240 }
nicholas@2224 241 div.calibration-slider {
nicholas@2224 242 width: 50px;
nicholas@2224 243 margin: 2px;
nicholas@2224 244 text-align: center;
nicholas@2224 245 align-content: center;
nicholas@2224 246 float: left;
nicholas@2224 247 }
nicholas@2538 248 div.calibration-slider input[type=range][orient=vertical] {
nicholas@2538 249 writing-mode: bt-lr;
nicholas@2538 250 /* IE */
nicholas@2538 251 -webkit-appearance: slider-vertical;
nicholas@2538 252 /* WebKit */
nicholas@2224 253 width: 8px;
nicholas@2224 254 padding: 0 5px;
nicholas@2224 255 height: 290px;
giuliomoro@2339 256 }
n@2580 257
n@2580 258 /* Comment Boxes */
n@2580 259
n@2580 260 div.comment-slider-text-holder {
n@2580 261 display: flex;
n@2580 262 flex-direction: row;
n@2580 263 justify-content: space-between;
n@2580 264 }
n@2580 265 div.comment-slider-text-holder span {
n@2580 266 margin: 0px 5px;
n@2580 267 }
nicholas@2711 268 div.comment-checkbox-inputs-holder {
nicholas@2711 269 display: flex;
nicholas@2711 270 flex-direction: row;
nicholas@2711 271 justify-content: space-around;
nicholas@2711 272 margin: 10px 5px;
nicholas@2711 273 }
nicholas@2711 274 div.comment-checkbox-inputs-flex {
nicholas@2711 275 display: flex;
nicholas@2711 276 flex-direction: column;
nicholas@2711 277 justify-content: space-between;
nicholas@2711 278 align-items: center;
nicholas@2726 279 }
nicholas@2726 280 div.comment-box-playing {
nicholas@2726 281 background-color: #FFDDDD;
nicholas@2726 282 }
nicholas@2779 283 div#imageController {
nicholas@2779 284 align-content: center;
nicholas@2779 285 text-align: center;
nicholas@2779 286 height: 250px;
nicholas@2779 287 }
nicholas@2779 288 div#imageController img {
nicholas@2779 289 max-height: 250px;
nicholas@2779 290 }