diff --git a/index.html b/index.html index 580f5c6..e7e08ee 100644 --- a/index.html +++ b/index.html @@ -115,7 +115,8 @@ section#textStuff { min-width: 30em; - flex: 0 1 0; +/* flex: 0 1 0; */ + flex: 0 0 auto; } section#textStuff ul { @@ -128,6 +129,62 @@ margin: 1em 0; } + #query { + font-size: 1em; + padding: 6px 8px; + margin-right: 1em; + } + + #submitButton { + appearance: none; + background-color: #2ea44f; + border: 1px solid rgba(27, 31, 35, .15); + border-radius: 6px; + box-shadow: rgba(27, 31, 35, .1) 0 1px 0; + box-sizing: border-box; + color: #fff; + cursor: pointer; + display: inline-block; + font-size: 1em; + font-weight: 600; + line-height: 1.2em; + padding: 6px 16px; + position: relative; + text-align: center; + text-decoration: none; + user-select: none; + -webkit-user-select: none; + touch-action: manipulation; + vertical-align: middle; + white-space: nowrap; + } + +#submitButton:focus:not(:focus-visible):not(.focus-visible) { + box-shadow: none; + outline: none; +} + +#submitButton:hover { + background-color: #2c974b; +} + +#submitButton:focus { + box-shadow: rgba(46, 164, 79, .4) 0 0 0 3px; + outline: none; +} + +#submitButton:disabled { + background-color: #94d3a2; + border-color: rgba(27, 31, 35, .1); + color: rgba(255, 255, 255, .8); + cursor: default; +} + +#submitButton:active { + background-color: #298e46; + box-shadow: rgba(20, 70, 32, .2) 0 1px 0 inset; +} + /* Position map load spinner in the middle of the SVG */ #svgContainer { position: relative; @@ -228,7 +285,7 @@
- +

Fetching translations...