From 485b1db09019612e6da34804d1c76fd91f048287 Mon Sep 17 00:00:00 2001 From: pliablepixels Date: Mon, 29 Feb 2016 11:38:20 -0500 Subject: initial code #179 Former-commit-id: 2b35afdc0c733beb2ea05cd6972f58228c8f272b --- www/css/style.css | 84 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 84 insertions(+) (limited to 'www/css') diff --git a/www/css/style.css b/www/css/style.css index 589bf7e6..d93a3352 100644 --- a/www/css/style.css +++ b/www/css/style.css @@ -194,6 +194,43 @@ Credit: https://css-tricks.com/snippets/css/a-guide-to-flexbox/ } +figure { + position: relative; +} + +figure img { + display: block; + width: 100%; + height: auto; +} +figcaption { + +} + +.normal-figcaption { + background: #575656; + color: #FFF; + position: absolute; + bottom: 0; + left: 0; + right: 0; + opacity:0.7; +} + +.alarmed-figcaption { + + background: #ba3e3e; + color:#ffffff; + position:absolute; + bottom: 0; + left: 0; + right: 0; + opacity:0.7; + + +} + + /* modified from: @@ -738,3 +775,50 @@ input[type=range]::-webkit-slider-thumb { -webkit-animation-delay: 1s; } +/* packery stuff */ + + + +* { box-sizing: border-box; } + +body { font-family: sans-serif; } + +/* ---- grid ---- */ + + +.grid-sizer, +.grid-item { width: 20%; } + +. +/* clear fix */ +.grid:after { + content: ''; + display: block; + clear: both; +} + + +.grid-item img { + display: block; + max-width: 100%; +} +/* ---- .grid-item ---- */ + + +.grid-item:hover { + border-color: hsla(0, 0%, 100%, 0.5); + cursor: move; +} + +.grid-item.is-dragging, +.grid-item.is-positioning-post-drag { + background: #C90; + z-index: 2; +} + +.packery-drop-placeholder { + outline: 3px dashed hsla(0, 0%, 0%, 0.5); + outline-offset: -6px; + -webkit-transition: -webkit-transform 0.2s; + transition: transform 0.2s; +} \ No newline at end of file -- cgit v1.2.3