Mercurial > hg > webaudioevaluationtool
annotate test_create/style.css @ 1089:3de455e48d70
Test Create: Move your custom elements into style.css
author | Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk> |
---|---|
date | Mon, 22 Feb 2016 12:18:55 +0000 |
parents | 3705f68a38b7 |
children | 47bfd9594617 |
rev | line source |
---|---|
giuliomoro@1088 | 1 div#blanket { |
giuliomoro@1088 | 2 z-index: 2; |
giuliomoro@1088 | 3 background-color: rgba(0,0,0,0.5); |
giuliomoro@1088 | 4 width: 100%; |
giuliomoro@1088 | 5 height: 100%; |
giuliomoro@1088 | 6 position: fixed; |
giuliomoro@1088 | 7 left: 0px; |
giuliomoro@1088 | 8 top: 0px; |
giuliomoro@1088 | 9 } |
giuliomoro@1088 | 10 |
giuliomoro@1088 | 11 div#popupHolder { |
giuliomoro@1088 | 12 z-index: 3; |
giuliomoro@1088 | 13 background-color: rgba(255,255,255,1); |
giuliomoro@1088 | 14 width: 730px; |
giuliomoro@1088 | 15 height: 480px; |
giuliomoro@1088 | 16 position: fixed; |
giuliomoro@1088 | 17 border-radius: 10px; |
giuliomoro@1088 | 18 box-shadow: 0px 0px 50px #000; |
giuliomoro@1088 | 19 padding: 10px; |
giuliomoro@1088 | 20 } |
giuliomoro@1088 | 21 |
giuliomoro@1088 | 22 div#popup-title-holder { |
giuliomoro@1088 | 23 width: 100%; |
giuliomoro@1088 | 24 height: 50px; |
giuliomoro@1088 | 25 font-size: 2em; |
giuliomoro@1088 | 26 } |
giuliomoro@1088 | 27 |
giuliomoro@1088 | 28 button#popup-proceed { |
giuliomoro@1088 | 29 width: 60px; |
giuliomoro@1088 | 30 height: 27px; |
giuliomoro@1088 | 31 padding: 5px; |
giuliomoro@1088 | 32 position: absolute; |
giuliomoro@1088 | 33 right: 10px; |
giuliomoro@1088 | 34 bottom: 10px; |
giuliomoro@1088 | 35 } |
giuliomoro@1088 | 36 |
giuliomoro@1088 | 37 div.drag-area { |
giuliomoro@1088 | 38 border: 3px black dashed; |
giuliomoro@1088 | 39 } |
giuliomoro@1088 | 40 div.drag-over { |
giuliomoro@1088 | 41 background-color: aquamarine; |
giuliomoro@1088 | 42 } |
giuliomoro@1088 | 43 div.drag-dropped { |
giuliomoro@1088 | 44 background-color: aqua; |
giuliomoro@1088 | 45 } |
giuliomoro@1088 | 46 div.drag-error { |
giuliomoro@1088 | 47 background-color: coral |
giuliomoro@1088 | 48 } |
giuliomoro@1088 | 49 |
giuliomoro@1088 | 50 div#project-drop { |
giuliomoro@1088 | 51 width: 99%; |
giuliomoro@1088 | 52 height: 50px; |
giuliomoro@1088 | 53 margin: 10px 0px; |
giuliomoro@1088 | 54 } |
giuliomoro@1088 | 55 |
giuliomoro@1088 | 56 div.popup-checkbox { |
giuliomoro@1088 | 57 padding: 5px; |
giuliomoro@1088 | 58 } |
giuliomoro@1088 | 59 |
giuliomoro@1088 | 60 div.popup-checkbox input { |
giuliomoro@1088 | 61 margin: 0px 5px; |
giuliomoro@1088 | 62 } |
giuliomoro@1088 | 63 |
giuliomoro@1088 | 64 div.popup-option-entry { |
giuliomoro@1088 | 65 padding: 5px 0px; |
giuliomoro@1088 | 66 border-bottom: 1px solid; |
giuliomoro@1088 | 67 } |
giuliomoro@1088 | 68 |
giuliomoro@1088 | 69 div.disabled{ |
giuliomoro@1088 | 70 color: rgb(100,100,100); |
giuliomoro@1088 | 71 } |
giuliomoro@1088 | 72 |
n@1089 | 73 |
n@1089 | 74 div#content > div.node{ |
n@1089 | 75 background-color: rgb(200,228,151); |
n@1089 | 76 } |
n@1089 | 77 |
n@1089 | 78 div#content > div#setup{ |
n@1089 | 79 background-color: coral; |
n@1089 | 80 } |
n@1089 | 81 |
n@1089 | 82 |
giuliomoro@1088 | 83 div.node { |
giuliomoro@1088 | 84 float: left; |
giuliomoro@1088 | 85 padding: 10px; |
giuliomoro@1088 | 86 border: black 2px solid; |
giuliomoro@1088 | 87 border-radius: 10px; |
giuliomoro@1088 | 88 margin: 10px; |
giuliomoro@1088 | 89 min-width: 92%; |
giuliomoro@1088 | 90 background-color: rgba(255,255,255,0.5); |
giuliomoro@1088 | 91 } |
giuliomoro@1088 | 92 div.node-title { |
giuliomoro@1088 | 93 float: left; |
giuliomoro@1088 | 94 width: 100%; |
giuliomoro@1088 | 95 font-size: 2em; |
giuliomoro@1088 | 96 margin: 5px 0px; |
giuliomoro@1088 | 97 } |
giuliomoro@1088 | 98 div.node-attributes { |
giuliomoro@1088 | 99 min-width: 92%; |
n@1089 | 100 float: none; |
giuliomoro@1088 | 101 padding: 10px; |
giuliomoro@1088 | 102 } |
giuliomoro@1088 | 103 div.attribute { |
giuliomoro@1088 | 104 float: left; |
giuliomoro@1088 | 105 margin-right: 10px; |
giuliomoro@1088 | 106 } |
giuliomoro@1088 | 107 div.node-children { |
giuliomoro@1088 | 108 float: left; |
giuliomoro@1088 | 109 min-width: 92%; |
giuliomoro@1088 | 110 } |
giuliomoro@1088 | 111 div.node-buttons { |
giuliomoro@1088 | 112 float: left; |
giuliomoro@1088 | 113 min-width: 92%; |
giuliomoro@1088 | 114 } |
giuliomoro@1088 | 115 div.attribute input { |
n@1089 | 116 max-width: 100%; |
n@1089 | 117 width: 300px; |
giuliomoro@1088 | 118 margin-right: 10px; |
giuliomoro@1088 | 119 } |
giuliomoro@1088 | 120 div.attribute input[type=number] { |
giuliomoro@1088 | 121 width: 80px; |
n@1089 | 122 } |
n@1089 | 123 div.attribute input[type=radio], div.attribute input[type=checkbox]{ |
n@1089 | 124 width: 10px; |
n@1089 | 125 } |
n@1089 | 126 input:disabled+span{ |
n@1089 | 127 text-decoration: line-through; |
giuliomoro@1088 | 128 } |