X-Git-Url: https://git.plutz.net/?p=confetti;a=blobdiff_plain;f=static%2Fcards.css;h=0b50b5ec46795559279235c9492f2b811ec6491b;hp=d85123f44fef0e35d4340ece16f3ae1f5f4edd96;hb=da08149f6cdeb8fea9cc89fde75e4aab84cbcfd8;hpb=bea66ef5029455845cd3fc66252b8b0aad4cd053;ds=sidebyside diff --git a/static/cards.css b/static/cards.css index d85123f..0b50b5e 100644 --- a/static/cards.css +++ b/static/cards.css @@ -1,5 +1,5 @@ /* -# Copyright 2014, 2015 Paul Hänsch +# Copyright 2014 - 2016 Paul Hänsch # # This file is part of Confetti. # @@ -81,6 +81,7 @@ padding: 0 20ex 0 0; overflow: auto; background: #FFF; + min-height: 8em; } .card .control { display: inline-block; @@ -97,18 +98,46 @@ .card .control .item { display: inline-block; width: 100%; + min-height: 2em; color: #008; - margin: .25em 0 0 0; + margin: .25em 0; border: 1px solid black; background: #FFF; + padding: .25em .75ex 0 .75ex; + text-decoration: none; + font-size: .75em; } -.card .control a.item { padding: .25em .75ex 0 .75ex;} -.card .control a.item:hover{ border-color: #888;} +.card .control .item:hover{ border-color: #888; } +.card .control input.item { font-size: normal; } .card .control button.item { text-align: right;} .card .control button.item:hover{ border-color: #888;} .card .control .item[name=newfield] { width: 85%;} .card .control .item[value=addfield] { width: 15%;} +.card .control #delete + label + button, +.card .control #delete { display: none; } +.card .control #delete + label { background-color: #FEE; } +.card .control #delete:checked + label + button { + position: fixed; display: block; + left: 40%; top: 30%; width: 20%; + font-size: 1.5em; + text-align: center; + background-color: #FAA; + color: #333; + border-radius: .25em 0 0 .25em; +} +.card .control #delete:checked + label:after { + position: fixed; display: block; + left: 60%; top: 30%; width: 5%; + margin: .25em 0; padding: .5em .75ex 0 .75ex; + height: 1.5em; + font-size: 2em; + content: 'X'; + text-align: center; + color: #AAA; background-color: #000; + border-radius: 0 .25em .25em 0; +} + .card .section { display: inline-block; vertical-align: top;