Mercurial > hg > webaudioevaluationtool
annotate core.css @ 1179:c2e19bc54c3c
Bug #1564: index.html is blank, the links are included in demo.html. Popup now created in index.html rather than generated.
author | Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk> |
---|---|
date | Thu, 11 Feb 2016 16:54:33 +0000 |
parents | 9131490d80a3 |
children | b7bf91ac6d01 |
rev | line source |
---|---|
n@1118 | 1 /* structure.css |
n@1118 | 2 * Define the structure for classes and objects in HTML |
n@1118 | 3 */ |
n@1118 | 4 |
n@1118 | 5 div.title { |
n@1118 | 6 width: 100%; |
n@1118 | 7 height: 50px; |
n@1118 | 8 margin-bottom: 10px; |
n@1118 | 9 font-size: 2em; |
n@1118 | 10 } |
n@1118 | 11 |
n@1118 | 12 div.indicator-box { |
n@1118 | 13 position: absolute; |
n@1118 | 14 left: 150px; |
n@1118 | 15 top: 10px; |
n@1118 | 16 width: 300px; |
n@1118 | 17 height: 60px; |
n@1118 | 18 padding: 20px; |
n@1118 | 19 border-radius: 10px; |
n@1118 | 20 background-color: rgb(100,200,200); |
n@1118 | 21 } |
n@1118 | 22 |
n@1118 | 23 div.comment-div { |
n@1178 | 24 border:1px solid #444444; |
n@1118 | 25 max-width: 600px; |
n@1118 | 26 min-width: 400px; |
n@1118 | 27 float: left; |
n@1178 | 28 margin: 5px 10px 5px 5px; |
n@1118 | 29 height: 90px; |
n@1178 | 30 border-radius: 10px; |
n@1118 | 31 } |
n@1118 | 32 |
n@1118 | 33 div.comment-div span { |
n@1118 | 34 margin-left: 15px; |
n@1118 | 35 } |
n@1118 | 36 |
n@1118 | 37 div.popupHolder { |
n@1118 | 38 width: 500px; |
n@1118 | 39 min-height: 250px; |
n@1118 | 40 max-height: 400px; |
n@1118 | 41 background-color: #fff; |
n@1118 | 42 border-radius: 10px; |
n@1118 | 43 box-shadow: 0px 0px 50px #000; |
n@1118 | 44 z-index: 2; |
n@1179 | 45 position: absolute; |
n@1179 | 46 } |
n@1179 | 47 |
n@1179 | 48 div#popupContent { |
n@1179 | 49 margin-top: 20px; |
n@1179 | 50 margin-bottom: 5px; |
n@1179 | 51 } |
n@1179 | 52 |
n@1179 | 53 div#popupTitle { |
n@1179 | 54 width: inherit; |
n@1179 | 55 min-height: 25px; |
n@1179 | 56 max-height: 250px; |
n@1179 | 57 overflow: auto; |
n@1179 | 58 margin-bottom: 5px; |
n@1179 | 59 } |
n@1179 | 60 |
n@1179 | 61 div#popupResponse { |
n@1179 | 62 width: inherit; |
n@1179 | 63 min-height: 50px; |
n@1179 | 64 max-height: 320px; |
n@1179 | 65 overflow: auto; |
n@1118 | 66 } |
n@1118 | 67 |
n@1118 | 68 button.popupButton { |
n@1118 | 69 /* Button for popup window |
n@1118 | 70 */ |
n@1118 | 71 width: 50px; |
n@1118 | 72 height: 25px; |
n@1171 | 73 position: absolute; |
n@1118 | 74 border-radius: 5px; |
n@1118 | 75 border: #444; |
n@1118 | 76 border-width: 1px; |
n@1118 | 77 border-style: solid; |
n@1118 | 78 background-color: #fff; |
n@1118 | 79 } |
n@1118 | 80 |
n@1171 | 81 button#popup-proceed { |
n@1171 | 82 bottom: 10px; |
n@1171 | 83 right: 10px; |
n@1171 | 84 } |
n@1171 | 85 |
n@1171 | 86 button#popup-previous { |
n@1171 | 87 bottom: 10px; |
n@1171 | 88 left: 10px; |
n@1171 | 89 } |
n@1171 | 90 |
n@1118 | 91 div.testHalt { |
n@1118 | 92 /* Specify any colouring during the test halt for pre/post questions */ |
n@1118 | 93 background-color: rgba(0,0,0,0.5); |
n@1118 | 94 /* Don't mess with this bit */ |
n@1118 | 95 z-index: 2; |
n@1118 | 96 width: 100%; |
n@1118 | 97 height: 100%; |
n@1118 | 98 position: absolute; |
n@1118 | 99 left: 0px; |
n@1118 | 100 top: 0px; |
n@1118 | 101 } |
n@1118 | 102 |
n@1118 | 103 textarea.trackComment { |
n@1118 | 104 max-width: 594px; |
n@1118 | 105 min-width: 350px; |
n@1118 | 106 max-height: 60px; |
n@1178 | 107 resize: none; |
n@1118 | 108 } |
n@1118 | 109 |
n@1118 | 110 div.playhead { |
n@1118 | 111 width: 500px; |
n@1118 | 112 height: 50px; |
n@1118 | 113 background-color: #eee; |
n@1118 | 114 border-radius: 10px; |
n@1118 | 115 padding: 10px; |
n@1118 | 116 } |
n@1118 | 117 |
n@1118 | 118 div.playhead-scrub-track { |
n@1118 | 119 width: 100%; |
n@1118 | 120 height: 10px; |
n@1118 | 121 border-style: solid; |
n@1118 | 122 border-width: 1px; |
n@1118 | 123 } |
n@1118 | 124 |
n@1118 | 125 div#playhead-scrubber { |
n@1118 | 126 width: 10px; |
n@1118 | 127 height: 10px; |
n@1118 | 128 position: relative; |
n@1118 | 129 background-color: #000; |
n@1118 | 130 } |
n@1154 | 131 |
n@1154 | 132 div#master-volume-holder { |
n@1154 | 133 width: 250px; |
n@1154 | 134 float: left; |
n@1155 | 135 border: black 1px solid; |
n@1155 | 136 border-radius: 5px; |
n@1155 | 137 padding: 5px; |
n@1154 | 138 } |
n@1154 | 139 |
n@1154 | 140 input#master-volume-control { |
n@1154 | 141 width: 200px; |
n@1154 | 142 height: 25px; |
n@1154 | 143 float: left; |
n@1154 | 144 margin: 0px; |
n@1154 | 145 padding: 0px; |
n@1154 | 146 } |
n@1154 | 147 |
n@1154 | 148 span#master-volume-feedback { |
n@1154 | 149 width: 45px; |
n@1154 | 150 height: 25px; |
n@1154 | 151 margin-left: 5px; |
n@1154 | 152 float: left; |
n@1154 | 153 } |