diff options
| -rw-r--r-- | web/static/style.css | 30 |
1 files changed, 29 insertions, 1 deletions
diff --git a/web/static/style.css b/web/static/style.css index 0ebec5c..da03f7d 100644 --- a/web/static/style.css +++ b/web/static/style.css @@ -194,14 +194,42 @@ body { display: contents; } -#controls #keypad-list .key { +#controls #keypad-list.visible { grid-column: 1 / -1; + overflow: scroll; + + display: flex; + flex-direction: column; +} + +#controls #keypad-list .key { + height: 4em; + min-height: 2em; + margin-top: 2px; padding-left: 0.4rem; justify-content: left; } +#controls #keypad-list .key:first-child { + margin-top: 0; +} + +#controls #keypad-list:after { + flex-grow: 1; + + content: ''; + background-color: #1a1a1a; + + /* + * inner 2px top border. gives us a gap that disappears when the last + * key reaches the bottom of the container and this section is not + * displayed. + */ + box-shadow: inset 0 4px 0 -2px #111; +} + #controls #keypad-dartboard #dartboard-container { grid-column: 1 / -1; |