diff --git a/client/css/style.css b/client/css/style.css index 0bffa4dc..9aead5b6 100644 --- a/client/css/style.css +++ b/client/css/style.css @@ -501,10 +501,11 @@ button { border-radius: 2px; bottom: 4px; left: 220px; - overflow: hidden; position: absolute; right: 5px; top: 4px; + display: flex; + flex-direction: column; } .signed-out #main { @@ -520,10 +521,9 @@ button { } #windows { - bottom: 48px; - position: absolute; - top: 0; - width: 100%; + position: relative; + overflow: hidden; + flex: 1; } #windows label { @@ -1172,32 +1172,23 @@ button { #form { background: #eee; border-top: 1px solid #ddd; - bottom: 0; - height: 48px; - left: 0; - position: absolute; - right: 0; -} - -#form .inner { - bottom: 7px; - left: 7px; - position: absolute; - right: 7px; - top: 6px; + min-height: 48px; + flex: 0 0 auto; + padding: 7px; } #form .input { font: 12px Consolas, Menlo, Monaco, "Lucida Console", "DejaVu Sans Mono", "Courier New", monospace; - left: 0; - height: 34px; - position: relative; + border: 1px solid #ddd; + border-radius: 2px; + background: white; + display: flex; + align-items: flex-end; } #form #nick { background: #f6f6f6; color: #666; - position: absolute; font: inherit; font-size: 11px; margin: 5px; @@ -1210,6 +1201,7 @@ button { -moz-user-select: none; -ms-user-select: none; user-select: none; + flex: 0 0 auto; } #form #nick:empty { @@ -1221,24 +1213,27 @@ button { } #form #input { - border: 1px solid #ddd; + background: transparent; + border: none; font: inherit; - border-radius: 2px; - height: 100%; + height: 18px; + max-height: 90px; + line-height: 1.5; outline: none; - padding: 0 34px 0 10px; - -webkit-appearance: none; - width: 100%; + margin: 5px; + padding: 0; + resize: none; + flex: 1 0 auto; + align-self: center; } #form #submit { color: #9ca5b4; height: 34px; line-height: 34px; - position: absolute; - right: 0; transition: opacity .3s; width: 34px; + flex: 0 0 auto; } #form #submit:before { diff --git a/client/index.html b/client/index.html index 6648e9d7..070402b9 100644 --- a/client/index.html +++ b/client/index.html @@ -324,12 +324,10 @@