X-Git-Url: https://git.plutz.net/?p=confetti;a=blobdiff_plain;f=static%2Fcards.css;h=039bd995ab52c7de51a007f56adf5f5b9d2c6030;hp=d85123f44fef0e35d4340ece16f3ae1f5f4edd96;hb=90288ab07bb1ec83a91581fadc674a87a250a853;hpb=bea66ef5029455845cd3fc66252b8b0aad4cd053 diff --git a/static/cards.css b/static/cards.css index d85123f..039bd99 100644 --- a/static/cards.css +++ b/static/cards.css @@ -1,5 +1,5 @@ /* -# Copyright 2014, 2015 Paul Hänsch +# Copyright 2014 - 2017 Paul Hänsch # # This file is part of Confetti. # @@ -64,6 +64,39 @@ margin-top: .5em; } +.filter fieldset.item { padding-left: 0; } +.filter fieldset.item legend { display: none; } +.filter fieldset.item input[type=text], +.filter fieldset.item fieldset.categories { + background-color: #FFF; + border: 1px solid #000; + margin-top: -1px; + padding: .25em .5em; +} +.filter fieldset.item input[type=radio] { display: none; } +.filter fieldset.item input[type=radio] + label { + position: relative; z-index: 1; + margin: 0; padding: .25em 1em; + +} +.filter fieldset.item input[type=radio]:checked + label { + background-color: #FFF; + border: 1px solid #000; + border-bottom-color: #FFF; +} +.filter fieldset.item input[type=radio][value="CATEGORIES:"]:checked + label + input[type=text], +.filter fieldset.item input[type=radio][value="CATEGORIES:"] + label + input[type=text] + fieldset.categories { + display: none; +} +.filter fieldset.item input[type=radio][value="CATEGORIES:"]:checked + label + input[type=text] + fieldset.categories { + display: block; +} +.filter fieldset.item fieldset.categories a { + font-size: .875em; + line-height: 1.625em; + color: #44C; +} + .newcard { display: block; border: solid 1px; @@ -73,6 +106,16 @@ background: #EFF; } +.dash { + display: block; + border: solid 1px; + border-radius: 4px 4px 0 0; + margin: .25em 2em .25em 2em; + padding: .25em 2ex .25em 2ex; + background: #EFF; + text-align: right; +} + .card { display: block; position: relative; @@ -81,6 +124,7 @@ padding: 0 20ex 0 0; overflow: auto; background: #FFF; + min-height: 8em; } .card .control { display: inline-block; @@ -97,18 +141,46 @@ .card .control .item { display: inline-block; width: 100%; + min-height: 2.5em; color: #008; - margin: .25em 0 0 0; + margin: .25em 0 .5em 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; @@ -138,6 +210,7 @@ display: block; max-width: 100%; word-wrap: break-word; + white-space: pre-line; } .card .section .item label { font-weight: bold;