Mercurial > hg > webaudioevaluationtool
annotate interfaces/timeline.css @ 2808:d5d374b399cb
Some restructuring of the timeline CSS/JS
author | Nicholas Jillings <nicholas.jillings@mail.bcu.ac.uk> |
---|---|
date | Tue, 25 Apr 2017 10:55:39 +0100 |
parents | 464c6c6692d6 |
children | 3a2dbff86da9 |
rev | line source |
---|---|
nicholas@2479 | 1 div.timeline-element { |
nicholas@2479 | 2 display: flex; |
nicholas@2479 | 3 justify-content: center; |
nicholas@2479 | 4 } |
nicholas@2479 | 5 div.timeline-element-content { |
nicholas@2808 | 6 width: 90%; |
nicholas@2479 | 7 min-width: 200px; |
nicholas@2479 | 8 border: 1px solid black; |
nicholas@2479 | 9 margin: 10px 0px; |
nicholas@2479 | 10 padding: 20px; |
nicholas@2479 | 11 } |
nicholas@2479 | 12 div.timeline-element-canvas-holder { |
nicholas@2479 | 13 display: flex; |
nicholas@2479 | 14 width: inherit; |
nicholas@2480 | 15 height: 160px; |
nicholas@2808 | 16 margin: auto; |
nicholas@2479 | 17 } |
nicholas@2538 | 18 canvas.canvas-layer1 { |
nicholas@2479 | 19 position: absolute; |
nicholas@2479 | 20 } |
nicholas@2479 | 21 canvas.canvas-layer2 { |
nicholas@2479 | 22 position: absolute; |
nicholas@2479 | 23 z-index: -1; |
nicholas@2479 | 24 } |
nicholas@2479 | 25 canvas.canvas-layer3 { |
nicholas@2479 | 26 position: absolute; |
nicholas@2479 | 27 z-index: -2; |
nicholas@2479 | 28 } |
nicholas@2479 | 29 canvas.canvas-layer4 { |
nicholas@2479 | 30 position: absolute; |
nicholas@2479 | 31 z-index: -3; |
nicholas@2479 | 32 } |
nicholas@2479 | 33 canvas.timeline-element-canvas { |
nicholas@2479 | 34 border: 1px solid black; |
nicholas@2479 | 35 } |
nicholas@2479 | 36 canvas.canvas-disabled { |
nicholas@2479 | 37 background-color: gray; |
nicholas@2480 | 38 } |
nicholas@2808 | 39 div.timeline-element-comment-holder {} |
nicholas@2480 | 40 div.comment-entry { |
nicholas@2480 | 41 border: 1px solid #444444; |
nicholas@2480 | 42 max-width: 600px; |
nicholas@2480 | 43 min-width: 400px; |
nicholas@2480 | 44 margin: 0px 0px 5px 5px; |
nicholas@2480 | 45 padding: 5px; |
nicholas@2480 | 46 height: 80px; |
nicholas@2480 | 47 border-radius: 10px; |
nicholas@2808 | 48 display: inline-block; |
nicholas@2808 | 49 text-align: center; |
nicholas@2480 | 50 } |
nicholas@2480 | 51 div.comment-entry-header { |
nicholas@2808 | 52 display: table; |
nicholas@2808 | 53 text-align: unset; |
nicholas@2808 | 54 width: 100%; |
nicholas@2808 | 55 } |
nicholas@2808 | 56 div.comment-entry-header span { |
nicholas@2808 | 57 float: left; |
nicholas@2808 | 58 } |
nicholas@2808 | 59 div.comment-entry-header button { |
nicholas@2808 | 60 float: right; |
nicholas@2480 | 61 } |
nicholas@2480 | 62 textarea.comment-entry-text { |
nicholas@2480 | 63 resize: none; |
nicholas@2480 | 64 margin: auto; |
nicholas@2808 | 65 width: 90%; |
nicholas@2538 | 66 } |