From 0bbaaa4d3bf08170927d870e7967b8934391adee Mon Sep 17 00:00:00 2001
From: Felix Hamme <git@fj.hamme.net>
Date: Sat, 8 Dec 2018 00:44:49 +0100
Subject: [PATCH] Change match hover design

---
 pages/tournament.js       | 9 +--------
 static/css/tournament.css | 9 +++++++++
 2 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/pages/tournament.js b/pages/tournament.js
index 610ccd6..d8a0181 100644
--- a/pages/tournament.js
+++ b/pages/tournament.js
@@ -75,17 +75,11 @@ class Match extends React.Component {
     constructor(props) {
         super(props);
         this.state = {
-            isHovered: false,
             modal: false
         };
-        this.handleHover = this.handleHover.bind(this);
         this.toggleModal = this.toggleModal.bind(this);
     }
 
-    handleHover() {
-        this.setState({isHovered: !this.state.isHovered});
-    }
-
     toggleModal() {
         this.setState({modal: !this.state.modal})
     }
@@ -128,8 +122,7 @@ class Match extends React.Component {
         }
         return (
             <div className='mb-3'>
-                <Card className={(this.state.isHovered ? 'shadow' : 'shadow-sm')} onMouseEnter={this.handleHover}
-                      onMouseLeave={this.handleHover} onClick={this.toggleModal}>
+                <Card className='shadow-sm match' onClick={this.toggleModal}>
                     <CardBody className={'border py-2 ' + cardClass}>
                         <MatchTable match={this.props.match}/>
                     </CardBody>
diff --git a/static/css/tournament.css b/static/css/tournament.css
index 91d8965..47a987e 100644
--- a/static/css/tournament.css
+++ b/static/css/tournament.css
@@ -12,4 +12,13 @@
 
 .minw-25 {
     min-width: 25%;
+}
+
+.match:hover {
+    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
+}
+
+.match:hover > div {
+    border-width: 3px !important;
+    margin: -2px;
 }
\ No newline at end of file