X-Git-Url: https://git.plutz.net/?p=confetti;a=blobdiff_plain;f=cards%2Fcards.css;h=9adbeca72013b952c48c381c96ed26bfe8c381f1;hp=9515e835233f20cb988d081e38de8148759cc0d9;hb=56ff6e8a97ae261fca8e293a6c82fad7a69c89b6;hpb=516b1d6b0427b42924a60bd63ed48d8087a9e4e8 diff --git a/cards/cards.css b/cards/cards.css index 9515e83..9adbeca 100644 --- a/cards/cards.css +++ b/cards/cards.css @@ -17,6 +17,8 @@ # along with Confetti. If not, see . */ +.filter, .newcard, .card { box-shadow: 0 0 1ex; } + .filter { display: block; border: solid 1px; @@ -132,21 +134,28 @@ .card .control .item { display: inline-block; width: 100%; - min-height: 2.5em; + height: 2.5em; + line-height: 2.5em; + margin: .25em 0; + padding: 0 .5em; + font-size: .75em; color: #008; - margin: .25em 0 .5em 0; - border: 1px solid black; background: #FFF; - padding: .25em .75ex 0 .75ex; text-decoration: none; - font-size: .75em; + border: 1px solid #888; + box-shadow: 0 0 .5ex #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 .item:hover{ border-color: #008; box-shadow: 0 0 .5ex #008; } + +.card .control .item[name=newfield] { + width: calc(100% - 2.5em); +} +.card .control .item[value=addfield] { + width: 2.5em; + border-style: solid solid solid none; + text-align: center; +} .card .control #delete + label + button, .card .control #delete { display: none; } @@ -218,8 +227,9 @@ width: 100%; max-height: 10em; } -.card .section .GENDER { display: inline-block; padding-right: .5ex;} +.card .section .GENDER { display: inline-block; padding-right: .5ex; } .card .section .BDAY { display: inline-block;} +.card .section .TEL .type { color: #444; } .card .section select { display: block; @@ -242,10 +252,58 @@ .card .section.prescriptions { width: 40ex;} +form.card input.delete { display: none; } +form.card input.delete + label { + display: inline-block; + position: relative; + font-size: .875em; + left: calc(100% - 1.5em); + width: 1.5em; + margin-bottom: -1.5em; + overflow: hidden; + white-space: nowrap; + vertical-align: bottom; +} +form.card input.delete + label:before { + display: inline-block; + content: 'x'; + width: calc(1.5em - 2px); height: calc(1.5em - 2px); + vertical-align: bottom; + text-align: center; + color: #444; + background-color: #FBB; + border: 1px solid #BBB; +} +form.card input.delete + label + input[type=text], +form.card input.delete + label + input:not([type]), +form.card input.delete + label + select + input.TEL { + width: calc(100% - 1.5em); +} +form.card input.delete[name^=TEL_] + label { top: 1.5em; } +form.card input.delete[name^=TEL_] + label:before { border-top: none; } +form.card input.delete[name^=NOTE_] + label, +form.card input.delete[name^=ADR_] + label { margin-bottom: 0; } +form.card input.delete[name^=NOTE_] + label:before, +form.card input.delete[name^=ADR_] + label:before { border-bottom: none; } + +form.card input.delete:checked + label, +form.card input.delete:checked + label + input, +form.card input.delete:checked + label + select, +form.card input.delete:checked + label + select + input, +form.card input.delete:checked + label + textarea { + display: none +} + form.card .section input[type=text], form.card .section input:not([type]), form.card .section textarea, -form.card .section select {width: 100%;} +form.card .section select { + width: 100%; + margin-bottom: .25em; +} + +form.card .section select.teltype { margin-bottom: 0; } +form.card .section input.TEL { margin-bottom: .5em; } form.card .attendance { min-width: 66%;