header -> top

This commit is contained in:
ntr 2019-05-15 14:00:21 +10:00
parent c331c92711
commit 5e48a58c02
4 changed files with 10 additions and 14 deletions

View File

@ -6,12 +6,6 @@
height: 100%; height: 100%;
} }
.instance-hdr {
display: flex;
flex-flow: column;
flex: 1;
}
.instance-info { .instance-info {
flex: 0 1 50%; flex: 0 1 50%;
padding-left: 1em; padding-left: 1em;
@ -46,11 +40,7 @@
flex-flow: row wrap; flex-flow: row wrap;
} }
.ready-btn { .ready:hover {
flex: 1 0 50%;
}
.ready-btn:hover {
transition-property: all; transition-property: all;
transition-duration: 0.5s; transition-duration: 0.5s;
transition-timing-function: ease; transition-timing-function: ease;

View File

@ -52,7 +52,7 @@ function GamePanel(props) {
} }
const header = ( const header = (
<div className="ready"> <div className="top">
<button <button
className="game-btn instance-btn instance-ui-btn right" className="game-btn instance-btn instance-ui-btn right"
onClick={() => sendGameReady()}> onClick={() => sendGameReady()}>

View File

@ -18,7 +18,7 @@ function InstanceComponent(args) {
if (!instance) return false; if (!instance) return false;
const rdyClasses = `instance-btn instance-ui-btn ready-btn ${player.ready ? 'ready' : ''}`; const rdyClasses = `instance-btn instance-ui-btn ${player.ready ? 'ready' : ''}`;
const readyBtn = ( const readyBtn = (
<button <button
className={rdyClasses} className={rdyClasses}
@ -49,7 +49,7 @@ function InstanceComponent(args) {
return ( return (
<section className="instance" > <section className="instance" >
<div className="instance-hdr"> <div className="top">
{actionBtn} {actionBtn}
{timer} {timer}
</div> </div>

View File

@ -549,3 +549,9 @@ figure.gray {
} }
section .top {
display: flex;
flex-flow: column;
flex: 1;
}