From 60ba1c91724a7a502b87fc585283bdb27220dea0 Mon Sep 17 00:00:00 2001
From: NikolaBorislavovHristov <hristovnikola@protonmail.com>
Date: Wed, 20 Jun 2018 17:31:14 +0300
Subject: [PATCH] user menu rendered as a popup

---
 src/common/NavBar/UserMenu/UserMenu.js | 22 +++++++++++++---------
 src/common/NavBar/UserMenu/styles.less |  5 ++++-
 2 files changed, 17 insertions(+), 10 deletions(-)

diff --git a/src/common/NavBar/UserMenu/UserMenu.js b/src/common/NavBar/UserMenu/UserMenu.js
index 17ad64012..cb32bf1e6 100644
--- a/src/common/NavBar/UserMenu/UserMenu.js
+++ b/src/common/NavBar/UserMenu/UserMenu.js
@@ -1,17 +1,21 @@
-import React, { Component } from 'react';
+import React, { PureComponent } from 'react';
 import Icon from 'stremio-icons/dom';
+import { Popup } from 'stremio-common';
 import styles from './styles';
 
-class UserMenu extends Component {
-    open = () => {
-
-    }
-
+class UserMenu extends PureComponent {
     render() {
         return (
-            <button className={styles['menu-button']} onClick={this.open}>
-                <Icon className={styles['user-icon']} icon={'ic_user'} />
-            </button>
+            <Popup>
+                <Popup.Label>
+                    <button className={styles['popup-label-container']}>
+                        <Icon className={styles['user-icon']} icon={'ic_user'} />
+                    </button>
+                </Popup.Label>
+                <Popup.Menu width={300}>
+                    <div style={{ background: 'red', width: '100%', height: 300 }}>kopele</div>
+                </Popup.Menu>
+            </Popup>
         );
     }
 }
diff --git a/src/common/NavBar/UserMenu/styles.less b/src/common/NavBar/UserMenu/styles.less
index 9df8322b5..729ab26ae 100644
--- a/src/common/NavBar/UserMenu/styles.less
+++ b/src/common/NavBar/UserMenu/styles.less
@@ -1,6 +1,9 @@
-.menu-button {
+.popup-label-container {
     height: 44px;
     width: 44px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
     background-color: transparent;
     .user-icon {
         width: 40%;