use flexbox to wrap settings tiles correctly

new icon for different tags
ignore test files in codeclimate test

src/pages/Player/Player.js

@@ -126,7 +126,7 @@ class Player extends React.Component {
                     <SideBarItem><b>{this.state.quality}p</b> Quality!</SideBarItem> : null}
                 {this.state.length !== 0 ?
                     <SideBarItem><b>{Math.round(this.state.length / 60)}</b> Minutes of
-                        length!</SideBarItem> : null}
+                                                                             length!</SideBarItem> : null}
                 <Line/>
                 <SideBarTitle>Tags:</SideBarTitle>
                 {this.state.tags.map((m) => (
@@ -167,8 +167,10 @@ class Player extends React.Component {
                         <div>not loaded yet</div>}
                     <div className={style.videoactions}>
                         <button className='btn btn-primary' onClick={() => this.likebtn()}>Like this Video!</button>
-                        <button className='btn btn-info' onClick={() => this.setState({popupvisible: true})}>Give this Video a Tag</button>
-                        <button className='btn btn-danger' onClick={() =>{this.deleteVideo()}}>Delete Video</button>
+                        <button className='btn btn-info' onClick={() => this.setState({popupvisible: true})}>Give this
+                                                                                                             Video a Tag
+                        </button>
+                        <button className='btn btn-danger' onClick={() => {this.deleteVideo()}}>Delete Video</button>
                     </div>
                 </div>
                 <button className={style.closebutton} onClick={() => this.closebtn()}>Close</button>

src/pages/Player/Player.module.css

@@ -12,7 +12,6 @@
     display: block;
     float: left;
     margin-left: 20px;
-    margin-top: 25px;
     margin-top: 20px;
     width: 60%;
 }