From 88a7b1a2d98d318d32f74d0dc5ef53b95ee5bde0 Mon Sep 17 00:00:00 2001 From: Přemysl Eric Janouch
Date: Wed, 7 Sep 2022 17:25:31 +0200 Subject: xP: resolve various issues, mostly in styling --- xP/public/xP.css | 47 ++++++++++++++++++++++++++++++++++++++--------- xP/public/xP.js | 6 ++++-- 2 files changed, 42 insertions(+), 11 deletions(-) (limited to 'xP/public') diff --git a/xP/public/xP.css b/xP/public/xP.css index 05badb0..a13afc6 100644 --- a/xP/public/xP.css +++ b/xP/public/xP.css @@ -3,7 +3,6 @@ body { padding: 0; font-family: sans-serif; } - .xP { height: 100vh; display: flex; @@ -12,13 +11,35 @@ body { } .title, .status { - background: #f8f8f8; - border-bottom: 1px solid #ccc; padding: .05rem .3rem; + background: #eee; + + position: relative; + border-top: 3px solid #ccc; + border-bottom: 2px solid #888; +} +.title:before, .status:before { + content: " "; + position: absolute; + left: 0; + right: 0; + height: 2px; + top: -2px; + background: #fff; +} +.title:after, .status:after { + content: " "; + position: absolute; + left: 0; + right: 0; + height: 1px; + bottom: -1px; + background: #ccc; } .title { display: flex; justify-content: space-between; + align-items: baseline; } .middle { @@ -38,7 +59,12 @@ body { cursor: default; } .item.active { - font-weight: bold; + font-style: italic; + background: #f8f8f8; + border-top: 1px solid #eee; + border-bottom: 1px solid #eee; + margin-top: -1px; + margin-bottom: -1px; } /* Only Firefox currently supports align-content: safe end, thus this. */ @@ -115,11 +141,14 @@ body { font-family: monospace; } -.status { - border-top: 2px solid #fff; -} - textarea { + font: inherit; padding: .05rem .3rem; - font-family: inherit; + margin: 0; + border: 2px inset #eee; + flex-shrink: 0; +} +textarea:focus { + outline: none; + border-color: #ff5f00; } diff --git a/xP/public/xP.js b/xP/public/xP.js index 1322a9b..2147cd3 100644 --- a/xP/public/xP.js +++ b/xP/public/xP.js @@ -478,10 +478,12 @@ let Input = { let handled = false switch (event.keyCode) { case 9: - handled = Input.complete(textarea) + if (!event.shiftKey) + handled = Input.complete(textarea) break case 13: - handled = Input.submit(textarea) + if (!event.shiftKey) + handled = Input.submit(textarea) break } if (handled) -- cgit v1.2.3-70-g09d2