X-Git-Url: https://git.plutz.net/?p=confetti;a=blobdiff_plain;f=templates%2Ftherapy.css.sh;h=57f35fefa224af7e5f924956a7a8d34b6a258e11;hp=4b87bcc4ec5f50c0c8a0ad62b91b3be82cfd9514;hb=f2d532b63f28b8ade51b900e0db23889a957af51;hpb=50d25cddfd2f0314556b4344290b47655a929c5f diff --git a/templates/therapy.css.sh b/templates/therapy.css.sh index 4b87bcc..57f35fe 100755 --- a/templates/therapy.css.sh +++ b/templates/therapy.css.sh @@ -92,6 +92,64 @@ div.prescription label[for=prescreviewed].checked { background-color: transparent; } +input.stickynote { display:none; } +input.stickynote + .stickynote { + position: fixed; + background-color: #FF8; + top: 4em; bottom: 4em; + left: -4.5em; width: 5em; + padding: 1ex; + max-height: 90%; + z-index: 2; +} +input.stickynote + .stickynote > * { display: none; } +input.stickynote + .stickynote > label { + position: absolute; + top: 0; bottom: 0; + display: block; + text-align: right; + font-weight: bold; +} +input.stickynote + .stickynote:hover { + left: -1ex; +} +input.stickynote:checked + .stickynote { + width: auto; + left: 1em; + right: 1em; +} +input.stickynote:checked + .stickynote > textarea { + display: block; + position: absolute; + left; 0; right: 0; bottom: 0; top: 0; + width: 100%; height: 100%; + background-color: #FF8; + padding: 2em 1em; +} +input.stickynote:checked + .stickynote > button { + display: block; + position: absolute; + right: .5ex; bottom: .5ex; + z-index: 2; +} +input.stickynote:checked + .stickynote > label { + display: block; + position: static; + font-size: 0; +} +input.stickynote:checked + .stickynote > label:before { + position: absolute; + font-size: initial; + content: "x"; + top: .5ex; right: .5ex; + padding: .125ex .75ex; + background-color: #000; + color: #FFF; + border-radius: 1ex; + z-index: 2; +} + + fieldset.color { position: absolute; bottom: 0; right: 0; width: 2em; @@ -120,6 +178,7 @@ fieldset.color > input.color + label { width: 38%; margin-right: 0; } + input.stickynote:checked + .stickynote { right: 50%; } fieldset.color { position: fixed; } .dotmark { position: fixed;