diff options
| author | Přemysl Eric Janouch <p@janouch.name> | 2022-09-07 17:25:31 +0200 |
|---|---|---|
| committer | Přemysl Eric Janouch <p@janouch.name> | 2022-09-07 17:26:43 +0200 |
| commit | 88a7b1a2d98d318d32f74d0dc5ef53b95ee5bde0 (patch) | |
| tree | 72f3b62328f8d3f20ee8db371a85f1fa2532075f /xP | |
| parent | 2341228efd02bcd4c99214885a5214826bfffa5c (diff) | |
| download | xK-88a7b1a2d98d318d32f74d0dc5ef53b95ee5bde0.tar.gz xK-88a7b1a2d98d318d32f74d0dc5ef53b95ee5bde0.tar.xz xK-88a7b1a2d98d318d32f74d0dc5ef53b95ee5bde0.zip | |
xP: resolve various issues, mostly in styling
Diffstat (limited to 'xP')
| -rw-r--r-- | xP/public/xP.css | 47 | ||||
| -rw-r--r-- | xP/public/xP.js | 6 |
2 files changed, 42 insertions, 11 deletions
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) |