Merge branch 'master' into csstheming

# Conflicts:
#	src/elements/PageTitle/PageTitle.module.css
#	src/elements/Preview/Preview.module.css
#	src/elements/SideBar/SideBar.module.css
#	src/index.css
#	src/pages/Player/Player.js
#	src/pages/Player/Player.module.css
#	src/pages/SettingsPage/SettingsPage.module.css

src/pages/Player/Player.js

@@ -2,28 +2,13 @@ import React from "react";
 import style from "./Player.module.css"
 
 import {PlyrComponent} from 'plyr-react';
-import SideBar, {SideBarTitle, SideBarItem} from "../../elements/SideBar/SideBar";
+import SideBar, {SideBarItem, SideBarTitle} from "../../elements/SideBar/SideBar";
 import Tag from "../../elements/Tag/Tag";
 import AddTagPopup from "../../elements/AddTagPopup/AddTagPopup";
 import PageTitle, {Line} from "../../elements/PageTitle/PageTitle";
 
 
 class Player extends React.Component {
-    constructor(props, context) {
-        super(props, context);
-
-        this.state = {
-            sources: null,
-            movie_id: null,
-            movie_name: null,
-            likes: null,
-            quality: null,
-            length: null,
-            tags: [],
-            popupvisible: false
-        };
-    }
-
     options = {
         controls: [
             'play-large', // The large play button in the center
@@ -41,6 +26,21 @@ class Player extends React.Component {
         ]
     };
 
+    constructor(props, context) {
+        super(props, context);
+
+        this.state = {
+            sources: null,
+            movie_id: null,
+            movie_name: null,
+            likes: null,
+            quality: null,
+            length: null,
+            tags: [],
+            popupvisible: false
+        };
+    }
+
     componentDidMount() {
         this.fetchMovieData();
     }

src/pages/Player/Player.module.css

@@ -1,17 +1,18 @@
 .closebutton {
-    color: white;
+    background-color: #FF0000;
     border: none;
     border-radius: 10px;
-    padding: 5px 15px 5px 15px;
-    background-color: #FF0000;
-    margin-top: 25px;
+    color: white;
     margin-left: 25px;
+    margin-top: 25px;
+    padding: 5px 15px 5px 15px;
 }
 
 .videowrapper {
-    margin-left: 20px;
     display: block;
     float: left;
+    margin-left: 20px;
+    margin-top: 25px;
     width: 60%;
     margin-top: 20px;
 }

src/pages/Player/Player.test.js

@@ -2,14 +2,6 @@ import {shallow} from "enzyme";
 import React from "react";
 import Player from "./Player";
 
-function prepareFetchApi(response) {
-    const mockJsonPromise = Promise.resolve(response);
-    const mockFetchPromise = Promise.resolve({
-        json: () => mockJsonPromise,
-    });
-    return (jest.fn().mockImplementation(() => mockFetchPromise));
-}
-
 describe('<Player/>', function () {
     it('renders without crashing ', function () {
         const wrapper = shallow(<Player/>);
@@ -32,7 +24,7 @@ describe('<Player/>', function () {
     });
 
     it('likebtn click', done => {
-        global.fetch = prepareFetchApi({result: 'success'});
+        global.fetch = global.prepareFetchApi({result: 'success'});
 
         const func = jest.fn();
 
@@ -59,7 +51,7 @@ describe('<Player/>', function () {
     });
 
     it('errored likebtn click', done => {
-        global.fetch = prepareFetchApi({result: 'nosuccess'});
+        global.fetch = global.prepareFetchApi({result: 'nosuccess'});
         const func = jest.fn();
 
         const wrapper = shallow(<Player/>);