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 }