From 42661ac03f4bae15c9eeb2bfc772336771a6bf43 Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Wed, 8 Dec 2021 10:17:58 +0100
Subject: [PATCH 01/18] use flexbox to align items vertically in widget
 container

---
 las2peer-frontend-statusbar.js | 17 ++++++++---------
 1 file changed, 8 insertions(+), 9 deletions(-)

diff --git a/las2peer-frontend-statusbar.js b/las2peer-frontend-statusbar.js
index a416451..7e6c3ef 100644
--- a/las2peer-frontend-statusbar.js
+++ b/las2peer-frontend-statusbar.js
@@ -24,10 +24,6 @@ render() {
                 width:${this.displayWidth};
             }
             #widget-container {
-                margin-left: auto;
-                margin-top: 0;
-                margin-bottom: 0;
-                padding: 25px 25px 10px 10px;
                 cursor: pointer;
             }
             #widget-container:hover {
@@ -36,6 +32,12 @@ render() {
             .inline{
                 display:inline-block;
             }
+            .flex{
+                display:flex;
+            }
+            .align-vertical{ 
+                align-items:center;
+            }
             .center-vertical {
                 margin-top: auto;
                 margin-bottom: auto;
@@ -43,10 +45,7 @@ render() {
             h1{
                 margin-left: 25px;
             }
-            h3 {
-                margin-left: 60px;
-                margin-top: -30px;
-            }
+            
         </style>
         <paper-card id="statusbar-container">
             <div style="display: flex">
@@ -58,7 +57,7 @@ render() {
                     </div>
                 </slot>
                 <slot class="inline center-vertical" name="middle"></slot>
-                <div class="inline center-vertical" id="widget-container" @click=${this.handleClick} @signed-in="${this.handleLogin}" @signed-out="${this.handleLogout}">
+                <div class="flex align-vertical" id="widget-container" @click=${this.handleClick} @signed-in="${this.handleLogin}" @signed-out="${this.handleLogout}">
                     <las2peer-user-widget id="widget" base-url=${this.baseUrl} login-name=${this.loginName} login-password=${this.loginPassword}
                         login-oidc-token=${this.loginOidcToken}
                         login-oidc-provider=${this.loginOidcProvider}

From 395b28f1621f23ffbb1e36b800bfe0453cbfec62 Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Wed, 8 Dec 2021 10:50:42 +0100
Subject: [PATCH 02/18] align to end

---
 las2peer-frontend-statusbar.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/las2peer-frontend-statusbar.js b/las2peer-frontend-statusbar.js
index 7e6c3ef..487469d 100644
--- a/las2peer-frontend-statusbar.js
+++ b/las2peer-frontend-statusbar.js
@@ -25,6 +25,7 @@ render() {
             }
             #widget-container {
                 cursor: pointer;
+                align-self:end;
             }
             #widget-container:hover {
                 background: #5691f5;

From eebb8545f13da97d15e09df4afb67e8e6385ce5a Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Wed, 8 Dec 2021 11:02:12 +0100
Subject: [PATCH 03/18] remove slot #8

---
 las2peer-frontend-statusbar.js | 127 +++++++++++++++++++--------------
 1 file changed, 72 insertions(+), 55 deletions(-)

diff --git a/las2peer-frontend-statusbar.js b/las2peer-frontend-statusbar.js
index 487469d..baa8a3b 100644
--- a/las2peer-frontend-statusbar.js
+++ b/las2peer-frontend-statusbar.js
@@ -11,65 +11,82 @@ class Las2peerFrontendStatusbar extends LitElement {
 render() {
       return html`
         <style>
-            :host([background]) {
-                background: var(--statusbar-background, #fff);
-                display: block;
-            }
-            paper-card {
-              --paper-card-background-color: var(--statusbar-background, #fff);
-            }
+          :host([background]) {
+            background: var(--statusbar-background, #fff);
+            display: block;
+          }
+          paper-card {
+            --paper-card-background-color: var(--statusbar-background, #fff);
+          }
 
-            #statusbar-container{
-                display:inline-block;
-                width:${this.displayWidth};
-            }
-            #widget-container {
-                cursor: pointer;
-                align-self:end;
-            }
-            #widget-container:hover {
-                background: #5691f5;
-            }
-            .inline{
-                display:inline-block;
-            }
-            .flex{
-                display:flex;
-            }
-            .align-vertical{ 
-                align-items:center;
-            }
-            .center-vertical {
-                margin-top: auto;
-                margin-bottom: auto;
-            }
-            h1{
-                margin-left: 25px;
-            }
-            
+          #statusbar-container {
+            display: inline-block;
+            width: ${this.displayWidth};
+          }
+          #widget-container {
+            cursor: pointer;
+            align-self: end;
+            margin-left: 5px;
+            margin-right: 5px;
+          }
+          #widget-container:hover {
+            background: #5691f5;
+          }
+          .inline {
+            display: inline-block;
+          }
+          .flex {
+            display: flex;
+          }
+          .align-vertical {
+            align-items: center;
+          }
+          .center-vertical {
+            margin-top: auto;
+            margin-bottom: auto;
+          }
+          h1 {
+            margin-left: 25px;
+          }
         </style>
         <paper-card id="statusbar-container">
-            <div style="display: flex">
-                <slot class="inline center-vertical" name="left"></slot>
-                <slot class="inline" name="title">
-                    <div style="display: flex; flex-flow: column">
-                        <h1 id="service-title">${this.service}</h1>
-                        <h5 style="margin-left: 25px; margin-top: -30px;" id="subtitle">${this.subtitle}</h5>
-                    </div>
-                </slot>
-                <slot class="inline center-vertical" name="middle"></slot>
-                <div class="flex align-vertical" id="widget-container" @click=${this.handleClick} @signed-in="${this.handleLogin}" @signed-out="${this.handleLogout}">
-                    <las2peer-user-widget id="widget" base-url=${this.baseUrl} login-name=${this.loginName} login-password=${this.loginPassword}
-                        login-oidc-token=${this.loginOidcToken}
-                        login-oidc-provider=${this.loginOidcProvider}
-                        login-oidc-sub=${this.loginOidcSub}
-                        suppress-error-toast=${this.suppressWidgetError}
-                    ></las2peer-user-widget>
-                    <h3 id="username">${this._getUsername()}</h3>
-                </div>
+          <div style="display: flex">
+            <!-- <slot class="inline center-vertical" name="left"></slot> -->
+            <slot class="inline" name="title">
+              <div style="display: flex; flex-flow: column">
+                <h1 id="service-title">${this.service}</h1>
+                <h5 style="margin-left: 25px; margin-top: -30px;" id="subtitle">
+                  ${this.subtitle}
+                </h5>
+              </div>
+            </slot>
+            <slot class="inline center-vertical" name="middle"></slot>
+            <div
+              class="flex align-vertical"
+              id="widget-container"
+              @click=${this.handleClick}
+              @signed-in="${this.handleLogin}"
+              @signed-out="${this.handleLogout}"
+            >
+              <las2peer-user-widget
+                id="widget"
+                base-url=${this.baseUrl}
+                login-name=${this.loginName}
+                login-password=${this.loginPassword}
+                login-oidc-token=${this.loginOidcToken}
+                login-oidc-provider=${this.loginOidcProvider}
+                login-oidc-sub=${this.loginOidcSub}
+                suppress-error-toast=${this.suppressWidgetError}
+              ></las2peer-user-widget>
+              <h3 id="username">${this._getUsername()}</h3>
             </div>
+          </div>
         </paper-card>
-        <openidconnect-signin id="oidcButton" style="display:none" @signed-in="${this.handleLogin}" @signed-out="${this.handleLogout}"
+        <openidconnect-signin
+          id="oidcButton"
+          style="display:none"
+          @signed-in="${this.handleLogin}"
+          @signed-out="${this.handleLogout}"
           scope="openid profile email"
           clientid="${this.oidcClientId}"
           authority="${this.oidcAuthority}"
@@ -79,7 +96,7 @@ render() {
           silentredirecturi="${this.oidcSilentSigninUrl}"
           ?useRedirect="${this.useRedirect}"
         ></openidconnect-signin>
-        `;
+      `;
     }
 
     static get properties() {

From 99d97f8424dd475cd8bfea18295ff7c90a3618aa Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Wed, 8 Dec 2021 11:11:28 +0100
Subject: [PATCH 04/18] align widget, move styles to style

---
 las2peer-frontend-statusbar.js | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/las2peer-frontend-statusbar.js b/las2peer-frontend-statusbar.js
index baa8a3b..2b56e30 100644
--- a/las2peer-frontend-statusbar.js
+++ b/las2peer-frontend-statusbar.js
@@ -25,9 +25,8 @@ render() {
           }
           #widget-container {
             cursor: pointer;
-            align-self: end;
-            margin-left: 5px;
-            margin-right: 5px;
+            margin-left: 10px;
+            margin-right: 10px;
           }
           #widget-container:hover {
             background: #5691f5;
@@ -48,9 +47,13 @@ render() {
           h1 {
             margin-left: 25px;
           }
+          #innercontainer {
+            display: flex;
+            justify-content: space-between;
+          }
         </style>
         <paper-card id="statusbar-container">
-          <div style="display: flex">
+          <div id="innercontainer">
             <!-- <slot class="inline center-vertical" name="left"></slot> -->
             <slot class="inline" name="title">
               <div style="display: flex; flex-flow: column">

From 8c11785394a83373960403abbad0c4ae789426fd Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Wed, 8 Dec 2021 11:13:45 +0100
Subject: [PATCH 05/18] use equil margin on first and last child of statusbar

---
 las2peer-frontend-statusbar.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/las2peer-frontend-statusbar.js b/las2peer-frontend-statusbar.js
index 2b56e30..febb464 100644
--- a/las2peer-frontend-statusbar.js
+++ b/las2peer-frontend-statusbar.js
@@ -44,13 +44,14 @@ render() {
             margin-top: auto;
             margin-bottom: auto;
           }
-          h1 {
-            margin-left: 25px;
-          }
           #innercontainer {
             display: flex;
             justify-content: space-between;
           }
+          #innercontainer:first-child,
+          #innercontainer:last-child {
+            margin-left: 25px;
+          }
         </style>
         <paper-card id="statusbar-container">
           <div id="innercontainer">

From c6e803498da302e00474ecf7e7a77da7c22c5614 Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Wed, 8 Dec 2021 11:21:34 +0100
Subject: [PATCH 06/18] m

---
 las2peer-frontend-statusbar.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/las2peer-frontend-statusbar.js b/las2peer-frontend-statusbar.js
index febb464..123bb5a 100644
--- a/las2peer-frontend-statusbar.js
+++ b/las2peer-frontend-statusbar.js
@@ -48,7 +48,9 @@ render() {
             display: flex;
             justify-content: space-between;
           }
-          #innercontainer:first-child,
+          #innercontainer:first-child {
+            margin-left: 25px;
+          }
           #innercontainer:last-child {
             margin-left: 25px;
           }

From 75093b2ef7c340084da5fff9df2f5f236a55c7f2 Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Wed, 8 Dec 2021 11:26:56 +0100
Subject: [PATCH 07/18] fix margin on last element

---
 las2peer-frontend-statusbar.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/las2peer-frontend-statusbar.js b/las2peer-frontend-statusbar.js
index 123bb5a..a35ff1b 100644
--- a/las2peer-frontend-statusbar.js
+++ b/las2peer-frontend-statusbar.js
@@ -52,7 +52,7 @@ render() {
             margin-left: 25px;
           }
           #innercontainer:last-child {
-            margin-left: 25px;
+            margin-right: 25px;
           }
         </style>
         <paper-card id="statusbar-container">

From 4aebd3a73f3bca78e4113dcf0f96c0f236972369 Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Wed, 8 Dec 2021 11:43:53 +0100
Subject: [PATCH 08/18] use widget fix branch for widgt component

---
 package-lock.json | 16 ++++++++--------
 package.json      |  2 +-
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 4ec433b..c3a8796 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -431,14 +431,14 @@
             }
         },
         "@webcomponents/shadycss": {
-            "version": "1.10.2",
-            "resolved": "https://registry.npmjs.org/@webcomponents/shadycss/-/shadycss-1.10.2.tgz",
-            "integrity": "sha512-9Iseu8bRtecb0klvv+WXZOVZatsRkbaH7M97Z+f+Pt909R4lDfgUODAnra23DOZTpeMTAkVpf4m/FZztN7Ox1A=="
+            "version": "1.11.0",
+            "resolved": "https://registry.npmjs.org/@webcomponents/shadycss/-/shadycss-1.11.0.tgz",
+            "integrity": "sha512-L5O/+UPum8erOleNjKq6k58GVl3fNsEQdSOyh0EUhNmi7tHUyRuCJy1uqJiWydWcLARE5IPsMoPYMZmUGrz1JA=="
         },
         "@webcomponents/webcomponentsjs": {
-            "version": "2.5.0",
-            "resolved": "https://registry.npmjs.org/@webcomponents/webcomponentsjs/-/webcomponentsjs-2.5.0.tgz",
-            "integrity": "sha512-C0l51MWQZ9kLzcxOZtniOMohpIFdCLZum7/TEHv3XWFc1Fvt5HCpbSX84x8ltka/JuNKcuiDnxXFkiB2gaePcg=="
+            "version": "2.6.0",
+            "resolved": "https://registry.npmjs.org/@webcomponents/webcomponentsjs/-/webcomponentsjs-2.6.0.tgz",
+            "integrity": "sha512-Moog+Smx3ORTbWwuPqoclr+uvfLnciVd6wdCaVscHPrxbmQ/IJKm3wbB7hpzJtXWjAq2l/6QMlO85aZiOdtv5Q=="
         },
         "acorn": {
             "version": "7.4.1",
@@ -461,8 +461,8 @@
             "integrity": "sha512-bzHZN8Pn+gS7DQA6n+iUmBfl0hO5DJq++QP3U6uTucDtk/0iGpXd/Gg7CGR0p8tJhofJyaKoWBuJI4eAO00BBg=="
         },
         "las2peer-frontend-user-widget": {
-            "version": "github:rwth-acis/las2peer-frontend-user-widget#63ad251f95b323938b78e0d68b14ec67a1a05511",
-            "from": "github:rwth-acis/las2peer-frontend-user-widget#0.3.0",
+            "version": "github:rwth-acis/las2peer-frontend-user-widget#8d98f79917eac4ba6c5ded0ec810308041ed8cd2",
+            "from": "github:rwth-acis/las2peer-frontend-user-widget#widget-position-fix",
             "requires": {
                 "@polymer/iron-ajax": "^3.0.1",
                 "@polymer/iron-dropdown": "^3.0.1",
diff --git a/package.json b/package.json
index a982a3f..2c85637 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
     "description": "A polymer widget which uses the las2peer Contact and UserInformation Service as well as the openId connect service",
     "main": "las2peer-frontend-statusbar.js",
     "dependencies": {
-        "las2peer-frontend-user-widget": "github:rwth-acis/las2peer-frontend-user-widget#0.3.0",
+        "las2peer-frontend-user-widget": "github:rwth-acis/las2peer-frontend-user-widget#widget-position-fix",
         "lit-element": "^2.5.1",
         "openidconnect-signin": "github:rwth-acis/openidconnect-signin"
     }

From bee36aab92dd8c3a26a04aba1ea58ab896663def Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Wed, 8 Dec 2021 11:53:00 +0100
Subject: [PATCH 09/18] use padding instead of margin

---
 las2peer-frontend-statusbar.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/las2peer-frontend-statusbar.js b/las2peer-frontend-statusbar.js
index a35ff1b..ebce12c 100644
--- a/las2peer-frontend-statusbar.js
+++ b/las2peer-frontend-statusbar.js
@@ -25,8 +25,8 @@ render() {
           }
           #widget-container {
             cursor: pointer;
-            margin-left: 10px;
-            margin-right: 10px;
+            padding-left: 10px;
+            padding-right: 10px;
           }
           #widget-container:hover {
             background: #5691f5;

From 7feca19e3c2f74749e45c1b01810eb5e23c8c318 Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Thu, 9 Dec 2021 14:21:52 +0100
Subject: [PATCH 10/18] Revert "remove slot #8"

This reverts commit eebb8545f13da97d15e09df4afb67e8e6385ce5a.
---
 las2peer-frontend-statusbar.js | 25 ++++++++++---------------
 1 file changed, 10 insertions(+), 15 deletions(-)

diff --git a/las2peer-frontend-statusbar.js b/las2peer-frontend-statusbar.js
index ebce12c..d6776ee 100644
--- a/las2peer-frontend-statusbar.js
+++ b/las2peer-frontend-statusbar.js
@@ -11,13 +11,13 @@ class Las2peerFrontendStatusbar extends LitElement {
 render() {
       return html`
         <style>
-          :host([background]) {
-            background: var(--statusbar-background, #fff);
-            display: block;
-          }
-          paper-card {
-            --paper-card-background-color: var(--statusbar-background, #fff);
-          }
+            :host([background]) {
+                background: var(--statusbar-background, #fff);
+                display: block;
+            }
+            paper-card {
+              --paper-card-background-color: var(--statusbar-background, #fff);
+            }
 
           #statusbar-container {
             display: inline-block;
@@ -57,7 +57,7 @@ render() {
         </style>
         <paper-card id="statusbar-container">
           <div id="innercontainer">
-            <!-- <slot class="inline center-vertical" name="left"></slot> -->
+            <slot class="inline center-vertical" name="left"></slot>
             <slot class="inline" name="title">
               <div style="display: flex; flex-flow: column">
                 <h1 id="service-title">${this.service}</h1>
@@ -86,13 +86,8 @@ render() {
               ></las2peer-user-widget>
               <h3 id="username">${this._getUsername()}</h3>
             </div>
-          </div>
         </paper-card>
-        <openidconnect-signin
-          id="oidcButton"
-          style="display:none"
-          @signed-in="${this.handleLogin}"
-          @signed-out="${this.handleLogout}"
+        <openidconnect-signin id="oidcButton" style="display:none" @signed-in="${this.handleLogin}" @signed-out="${this.handleLogout}"
           scope="openid profile email"
           clientid="${this.oidcClientId}"
           authority="${this.oidcAuthority}"
@@ -102,7 +97,7 @@ render() {
           silentredirecturi="${this.oidcSilentSigninUrl}"
           ?useRedirect="${this.useRedirect}"
         ></openidconnect-signin>
-      `;
+        `;
     }
 
     static get properties() {

From 9294cbf4da4543da409e99b8950e43773758b34c Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Thu, 9 Dec 2021 20:53:54 +0100
Subject: [PATCH 11/18] Only last item right aligned, spacing between inline
 items

---
 las2peer-frontend-statusbar.js | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/las2peer-frontend-statusbar.js b/las2peer-frontend-statusbar.js
index d6776ee..1073f66 100644
--- a/las2peer-frontend-statusbar.js
+++ b/las2peer-frontend-statusbar.js
@@ -34,6 +34,9 @@ render() {
           .inline {
             display: inline-block;
           }
+          .inline + .inline {
+              margin-left: 5px;
+          }
           .flex {
             display: flex;
           }
@@ -46,13 +49,13 @@ render() {
           }
           #innercontainer {
             display: flex;
-            justify-content: space-between;
           }
           #innercontainer:first-child {
             margin-left: 25px;
           }
           #innercontainer:last-child {
             margin-right: 25px;
+            margin-left: auto;
           }
         </style>
         <paper-card id="statusbar-container">
@@ -87,7 +90,9 @@ render() {
               <h3 id="username">${this._getUsername()}</h3>
             </div>
         </paper-card>
-        <openidconnect-signin id="oidcButton" style="display:none" @signed-in="${this.handleLogin}" @signed-out="${this.handleLogout}"
+        <openidconnect-signin id="oidcButton" style="display:none" @signed-in="${
+          this.handleLogin
+        }" @signed-out="${this.handleLogout}"
           scope="openid profile email"
           clientid="${this.oidcClientId}"
           authority="${this.oidcAuthority}"

From e114ec232426f1c5bcadea6ec307a6cf237d954b Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Thu, 9 Dec 2021 21:02:53 +0100
Subject: [PATCH 12/18] mark css rule as important

---
 las2peer-frontend-statusbar.js | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/las2peer-frontend-statusbar.js b/las2peer-frontend-statusbar.js
index 1073f66..2918034 100644
--- a/las2peer-frontend-statusbar.js
+++ b/las2peer-frontend-statusbar.js
@@ -19,10 +19,7 @@ render() {
               --paper-card-background-color: var(--statusbar-background, #fff);
             }
 
-          #statusbar-container {
-            display: inline-block;
-            width: ${this.displayWidth};
-          }
+          
           #widget-container {
             cursor: pointer;
             padding-left: 10px;
@@ -55,7 +52,11 @@ render() {
           }
           #innercontainer:last-child {
             margin-right: 25px;
-            margin-left: auto;
+            margin-left: auto!important;
+          }
+          #statusbar-container {
+            display: inline-block;
+            width: ${this.displayWidth};
           }
         </style>
         <paper-card id="statusbar-container">

From 77eac2f19291c7ba6aa4bf430721c538d72f5f49 Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Thu, 9 Dec 2021 21:10:45 +0100
Subject: [PATCH 13/18] fix missing div

---
 las2peer-frontend-statusbar.js | 540 +++++++++++++++++----------------
 1 file changed, 271 insertions(+), 269 deletions(-)

diff --git a/las2peer-frontend-statusbar.js b/las2peer-frontend-statusbar.js
index 2918034..63af21c 100644
--- a/las2peer-frontend-statusbar.js
+++ b/las2peer-frontend-statusbar.js
@@ -1,286 +1,288 @@
-import {html, LitElement} from 'lit-element';
-import 'openidconnect-signin/openidconnect-signin.js';
-import 'openidconnect-signin/openidconnect-popup-signin-callback.js';
-import 'openidconnect-signin/openidconnect-popup-signout-callback.js';
-import 'openidconnect-signin/openidconnect-signin-silent-callback.js';
-import 'las2peer-frontend-user-widget/las2peer-user-widget.js';
-import '@polymer/paper-card/paper-card.js';
+import { html, LitElement } from "lit-element";
+import "openidconnect-signin/openidconnect-signin.js";
+import "openidconnect-signin/openidconnect-popup-signin-callback.js";
+import "openidconnect-signin/openidconnect-popup-signout-callback.js";
+import "openidconnect-signin/openidconnect-signin-silent-callback.js";
+import "las2peer-frontend-user-widget/las2peer-user-widget.js";
+import "@polymer/paper-card/paper-card.js";
 
 class Las2peerFrontendStatusbar extends LitElement {
+  render() {
+    return html`
+      <style>
+        :host([background]) {
+          background: var(--statusbar-background, #fff);
+          display: block;
+        }
+        paper-card {
+          --paper-card-background-color: var(--statusbar-background, #fff);
+        }
 
-render() {
-      return html`
-        <style>
-            :host([background]) {
-                background: var(--statusbar-background, #fff);
-                display: block;
-            }
-            paper-card {
-              --paper-card-background-color: var(--statusbar-background, #fff);
-            }
-
-          
-          #widget-container {
-            cursor: pointer;
-            padding-left: 10px;
-            padding-right: 10px;
-          }
-          #widget-container:hover {
-            background: #5691f5;
-          }
-          .inline {
-            display: inline-block;
-          }
-          .inline + .inline {
-              margin-left: 5px;
-          }
-          .flex {
-            display: flex;
-          }
-          .align-vertical {
-            align-items: center;
-          }
-          .center-vertical {
-            margin-top: auto;
-            margin-bottom: auto;
-          }
-          #innercontainer {
-            display: flex;
-          }
-          #innercontainer:first-child {
-            margin-left: 25px;
-          }
-          #innercontainer:last-child {
-            margin-right: 25px;
-            margin-left: auto!important;
-          }
-          #statusbar-container {
-            display: inline-block;
-            width: ${this.displayWidth};
-          }
-        </style>
-        <paper-card id="statusbar-container">
-          <div id="innercontainer">
-            <slot class="inline center-vertical" name="left"></slot>
-            <slot class="inline" name="title">
-              <div style="display: flex; flex-flow: column">
-                <h1 id="service-title">${this.service}</h1>
-                <h5 style="margin-left: 25px; margin-top: -30px;" id="subtitle">
-                  ${this.subtitle}
-                </h5>
-              </div>
-            </slot>
-            <slot class="inline center-vertical" name="middle"></slot>
-            <div
-              class="flex align-vertical"
-              id="widget-container"
-              @click=${this.handleClick}
-              @signed-in="${this.handleLogin}"
-              @signed-out="${this.handleLogout}"
-            >
-              <las2peer-user-widget
-                id="widget"
-                base-url=${this.baseUrl}
-                login-name=${this.loginName}
-                login-password=${this.loginPassword}
-                login-oidc-token=${this.loginOidcToken}
-                login-oidc-provider=${this.loginOidcProvider}
-                login-oidc-sub=${this.loginOidcSub}
-                suppress-error-toast=${this.suppressWidgetError}
-              ></las2peer-user-widget>
-              <h3 id="username">${this._getUsername()}</h3>
+        #widget-container {
+          cursor: pointer;
+          padding-left: 10px;
+          padding-right: 10px;
+        }
+        #widget-container:hover {
+          background: #5691f5;
+        }
+        .inline {
+          display: inline-block;
+        }
+        .inline + .inline {
+          margin-left: 5px;
+        }
+        .flex {
+          display: flex;
+        }
+        .align-vertical {
+          align-items: center;
+        }
+        .center-vertical {
+          margin-top: auto;
+          margin-bottom: auto;
+        }
+        #innercontainer {
+          display: flex;
+        }
+        #innercontainer:first-child {
+          margin-left: 25px;
+        }
+        #innercontainer:last-child {
+          margin-right: 25px;
+          margin-left: auto !important;
+        }
+        #statusbar-container {
+          display: inline-block;
+          width: ${this.displayWidth};
+        }
+      </style>
+      <paper-card id="statusbar-container">
+        <div id="innercontainer">
+          <slot class="inline center-vertical" name="left"></slot>
+          <slot class="inline" name="title">
+            <div style="display: flex; flex-flow: column">
+              <h1 id="service-title">${this.service}</h1>
+              <h5 style="margin-left: 25px; margin-top: -30px;" id="subtitle">
+                ${this.subtitle}
+              </h5>
             </div>
-        </paper-card>
-        <openidconnect-signin id="oidcButton" style="display:none" @signed-in="${
-          this.handleLogin
-        }" @signed-out="${this.handleLogout}"
-          scope="openid profile email"
-          clientid="${this.oidcClientId}"
-          authority="${this.oidcAuthority}"
-          providername="Layers"
-          popupredirecturi="${this.oidcPopupSigninUrl}"
-          popuppostlogoutredirecturi="${this.oidcPopupSignoutUrl}"
-          silentredirecturi="${this.oidcSilentSigninUrl}"
-          ?useRedirect="${this.useRedirect}"
-        ></openidconnect-signin>
-        `;
-    }
+          </slot>
+          <slot class="inline center-vertical" name="middle"></slot>
+          <div
+            class="flex align-vertical"
+            id="widget-container"
+            @click=${this.handleClick}
+            @signed-in="${this.handleLogin}"
+            @signed-out="${this.handleLogout}"
+          >
+            <las2peer-user-widget
+              id="widget"
+              base-url=${this.baseUrl}
+              login-name=${this.loginName}
+              login-password=${this.loginPassword}
+              login-oidc-token=${this.loginOidcToken}
+              login-oidc-provider=${this.loginOidcProvider}
+              login-oidc-sub=${this.loginOidcSub}
+              suppress-error-toast=${this.suppressWidgetError}
+            ></las2peer-user-widget>
+            <h3 id="username">${this._getUsername()}</h3>
+          </div>
+        </div>
+      </paper-card>
+      <openidconnect-signin
+        id="oidcButton"
+        style="display:none"
+        @signed-in="${this.handleLogin}"
+        @signed-out="${this.handleLogout}"
+        scope="openid profile email"
+        clientid="${this.oidcClientId}"
+        authority="${this.oidcAuthority}"
+        providername="Layers"
+        popupredirecturi="${this.oidcPopupSigninUrl}"
+        popuppostlogoutredirecturi="${this.oidcPopupSignoutUrl}"
+        silentredirecturi="${this.oidcSilentSigninUrl}"
+        ?useRedirect="${this.useRedirect}"
+      ></openidconnect-signin>
+    `;
+  }
 
-    static get properties() {
-        return {
-            service: {
-                type: String
-            },
-            subtitle: {
-                type: String
-            },
-            baseUrl: {
-                type: String
-            },
-            oidcPopupSigninUrl: {
-                type: String
-            },
-            oidcPopupSignoutUrl: {
-                type: String
-            },
-            oidcSilentSigninUrl: {
-                type: String
-            },
-            loggedIn: {
-                type: Boolean
-            },
-            loginName: {
-                type: String
-            },
-            loginPassword: {
-                type: String
-            },
-            loginOidcToken: {
-                type: String
-            },
-            loginOidcProvider: {
-                type: String
-            },
-            loginOidcSub: {
-                type: String
-            },
-            sendCookie: {
-                type: Boolean
-            },
-            autoAppendWidget: {
-                type: Boolean
-            },
-            _oidcUser: {
-                type: Object
-            },
-            oidcClientId: {
-                type: String
-            },
-            oidcAuthority: {
-                type: String
-            },
-            useRedirect: {
-                type: Boolean
-            },
-            displayWidth: {
-                type: String
-            },
-            suppressWidgetError: {
-                type: Boolean
-            }
-        }
-    }
+  static get properties() {
+    return {
+      service: {
+        type: String,
+      },
+      subtitle: {
+        type: String,
+      },
+      baseUrl: {
+        type: String,
+      },
+      oidcPopupSigninUrl: {
+        type: String,
+      },
+      oidcPopupSignoutUrl: {
+        type: String,
+      },
+      oidcSilentSigninUrl: {
+        type: String,
+      },
+      loggedIn: {
+        type: Boolean,
+      },
+      loginName: {
+        type: String,
+      },
+      loginPassword: {
+        type: String,
+      },
+      loginOidcToken: {
+        type: String,
+      },
+      loginOidcProvider: {
+        type: String,
+      },
+      loginOidcSub: {
+        type: String,
+      },
+      sendCookie: {
+        type: Boolean,
+      },
+      autoAppendWidget: {
+        type: Boolean,
+      },
+      _oidcUser: {
+        type: Object,
+      },
+      oidcClientId: {
+        type: String,
+      },
+      oidcAuthority: {
+        type: String,
+      },
+      useRedirect: {
+        type: Boolean,
+      },
+      displayWidth: {
+        type: String,
+      },
+      suppressWidgetError: {
+        type: Boolean,
+      },
+    };
+  }
 
-    constructor() {
-        super();
-        this._initialize();
-        this.autoAppendWidget = false;
-        this.service = "Unnamed Service";
-        this.subtitle = "";
-        this.baseUrl = "http://127.0.0.1:8080";
-        this.oidcAuthority = "https://api.learning-layers.eu/o/oauth2";
-        this.displayWidth = "100%";
-        this.oidcPopupSigninUrl = "/node_modules/las2peer-frontend-statusbar/callbacks/popup-signin-callback.html";
-        this.oidcPopupSignoutUrl = "/node_modules/las2peer-frontend-statusbar/callbacks/popup-signout-callback.html";
-        this.oidcSilentSigninUrl = "/node_modules/las2peer-frontend-statusbar/callbacks/silent-callback.html";
-        this.useRedirect = false;
-        this.suppressWidgetError = false;
-    }
+  constructor() {
+    super();
+    this._initialize();
+    this.autoAppendWidget = false;
+    this.service = "Unnamed Service";
+    this.subtitle = "";
+    this.baseUrl = "http://127.0.0.1:8080";
+    this.oidcAuthority = "https://api.learning-layers.eu/o/oauth2";
+    this.displayWidth = "100%";
+    this.oidcPopupSigninUrl =
+      "/node_modules/las2peer-frontend-statusbar/callbacks/popup-signin-callback.html";
+    this.oidcPopupSignoutUrl =
+      "/node_modules/las2peer-frontend-statusbar/callbacks/popup-signout-callback.html";
+    this.oidcSilentSigninUrl =
+      "/node_modules/las2peer-frontend-statusbar/callbacks/silent-callback.html";
+    this.useRedirect = false;
+    this.suppressWidgetError = false;
+  }
 
-    handleClick(e) {
-        if (!this.loggedIn)
-            this.shadowRoot.querySelector("#oidcButton")._handleClick();
-    }
+  handleClick(e) {
+    if (!this.loggedIn)
+      this.shadowRoot.querySelector("#oidcButton")._handleClick();
+  }
 
-    handleLogin(event) {
-        if (this.loggedIn)
-            return;
-        let userObject = event.detail;
-        this.dispatchEvent(new CustomEvent('signed-in', {detail: userObject, bubbles: true}));
-        this.loggedIn = true;
-        this.shadowRoot.querySelector("#widget-container").style = "cursor:auto";
-        if (!userObject) {
-            this.shadowRoot.querySelector("#username").innerHTML = this._getUsername();
-        } else {
-            if (userObject.token_type !== "Bearer") throw "unexpected OIDC token type, fix me";
-            this._oidcUser = userObject;
-            this.loginOidcToken = this._oidcUser.access_token;
-            this.loginOidcProvider = this.oidcAuthority;
-            this.loginOidcSub = this._oidcUser.profile.sub;
-            if (this.autoAppendWidget)
-                this._appendWidget();
-        }
+  handleLogin(event) {
+    if (this.loggedIn) return;
+    let userObject = event.detail;
+    this.dispatchEvent(
+      new CustomEvent("signed-in", { detail: userObject, bubbles: true })
+    );
+    this.loggedIn = true;
+    this.shadowRoot.querySelector("#widget-container").style = "cursor:auto";
+    if (!userObject) {
+      this.shadowRoot.querySelector("#username").innerHTML =
+        this._getUsername();
+    } else {
+      if (userObject.token_type !== "Bearer")
+        throw "unexpected OIDC token type, fix me";
+      this._oidcUser = userObject;
+      this.loginOidcToken = this._oidcUser.access_token;
+      this.loginOidcProvider = this.oidcAuthority;
+      this.loginOidcSub = this._oidcUser.profile.sub;
+      if (this.autoAppendWidget) this._appendWidget();
     }
+  }
 
-    handleLogout() {
-        this.dispatchEvent(new CustomEvent('signed-out'));
-        if (!this.loggedIn)
-            return;
-        console.log("logged out ", this._getUsername());
-        this._initialize();
-        if (this.autoAppendWidget)
-            this._appendWidget();
-        this.shadowRoot.querySelector("#widget-container").style = "cursor:default";
-        let i = document.createElement('iframe');
-        i.style.display = 'none';
-        i.onload = function() { i.parentNode.removeChild(i); };
-        i.src = 'https://api.learning-layers.eu/o/oauth2/logout';
-        document.body.appendChild(i);
-    }
+  handleLogout() {
+    this.dispatchEvent(new CustomEvent("signed-out"));
+    if (!this.loggedIn) return;
+    console.log("logged out ", this._getUsername());
+    this._initialize();
+    if (this.autoAppendWidget) this._appendWidget();
+    this.shadowRoot.querySelector("#widget-container").style = "cursor:default";
+    let i = document.createElement("iframe");
+    i.style.display = "none";
+    i.onload = function () {
+      i.parentNode.removeChild(i);
+    };
+    i.src = "https://api.learning-layers.eu/o/oauth2/logout";
+    document.body.appendChild(i);
+  }
 
-    _appendWidget() {
-        let widgetHTML = "<las2peer-user-widget id='widget' base-url=" + this.baseUrl;
-        if (!!this.loginName)
-            widgetHTML += " login-name=" + this.loginName;
-        if (!!this.loginPassword)
-            widgetHTML += " login-password=" + this.loginPassword;
-        if (!!this.loginOidcToken) {
-            widgetHTML += " login-oidc-token=" + this.loginOidcToken;
-            if (!this.loginName && !!this._oidcUser)
-                widgetHTML += " login-name=" + this._oidcUser.profile.preferred_username;
-        }
-        if (!!this.loginOidcProvider)
-            widgetHTML += " login-oidc-provider=" + this.loginOidcProvider;
-        if (!!this.loginOidcSub)
-            widgetHTML += " login-oidc-sub=" + this.loginOidcSub;
-        if (!!this.sendCookie)
-            widgetHTML += " send-cookie=true";
-        if (!!this.suppressWidgetError)
-            widgetHTML += " suppress-error-toast=true";
-        widgetHTML += "></las2peer-user-widget>";
-        let headerHTML = "<h3>" + this._getUsername() + "</h3>";
-        this.shadowRoot.querySelector("#widget-container").innerHTML = widgetHTML + headerHTML;
+  _appendWidget() {
+    let widgetHTML =
+      "<las2peer-user-widget id='widget' base-url=" + this.baseUrl;
+    if (!!this.loginName) widgetHTML += " login-name=" + this.loginName;
+    if (!!this.loginPassword)
+      widgetHTML += " login-password=" + this.loginPassword;
+    if (!!this.loginOidcToken) {
+      widgetHTML += " login-oidc-token=" + this.loginOidcToken;
+      if (!this.loginName && !!this._oidcUser)
+        widgetHTML +=
+          " login-name=" + this._oidcUser.profile.preferred_username;
     }
+    if (!!this.loginOidcProvider)
+      widgetHTML += " login-oidc-provider=" + this.loginOidcProvider;
+    if (!!this.loginOidcSub)
+      widgetHTML += " login-oidc-sub=" + this.loginOidcSub;
+    if (!!this.sendCookie) widgetHTML += " send-cookie=true";
+    if (!!this.suppressWidgetError) widgetHTML += " suppress-error-toast=true";
+    widgetHTML += "></las2peer-user-widget>";
+    let headerHTML = "<h3>" + this._getUsername() + "</h3>";
+    this.shadowRoot.querySelector("#widget-container").innerHTML =
+      widgetHTML + headerHTML;
+  }
 
-    _initialize() {
-        this.loggedIn = false;
-        this.loginName = "";
-        this.loginPassword = "";
-        this.loginOidcToken = "";
-        this.loginOidcProvider = "";
-        this.loginOidcSub = "";
-        this._oidcUser = null;
-        this.sendCookie = false;
-        this.suppressWidgetError = false;
-    }
+  _initialize() {
+    this.loggedIn = false;
+    this.loginName = "";
+    this.loginPassword = "";
+    this.loginOidcToken = "";
+    this.loginOidcProvider = "";
+    this.loginOidcSub = "";
+    this._oidcUser = null;
+    this.sendCookie = false;
+    this.suppressWidgetError = false;
+  }
 
-    _getUsername() {
-        if (!this.loggedIn)
-            return "Login";
-        if (!!this.loginName)
-            return this.loginName;
-        let widget = this.shadowRoot.querySelector("#widget");
-        let fullName = "";
-        if (!!widget.firstName) {
-            fullName += widget.firstName;
-            if (!!widget.lastName)
-                fullName += " " + widget.lastName;
-            return fullName;
-        }
-        if (!!this._oidcUser)
-            return this._oidcUser.profile.preferred_username;
-        return "Unknown Username";
+  _getUsername() {
+    if (!this.loggedIn) return "Login";
+    if (!!this.loginName) return this.loginName;
+    let widget = this.shadowRoot.querySelector("#widget");
+    let fullName = "";
+    if (!!widget.firstName) {
+      fullName += widget.firstName;
+      if (!!widget.lastName) fullName += " " + widget.lastName;
+      return fullName;
     }
+    if (!!this._oidcUser) return this._oidcUser.profile.preferred_username;
+    return "Unknown Username";
+  }
 }
 
-customElements.define('las2peer-frontend-statusbar', Las2peerFrontendStatusbar);
+customElements.define("las2peer-frontend-statusbar", Las2peerFrontendStatusbar);

From fd17fc3643daf019ad878b2b1decb1dcc0fc74b0 Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Thu, 9 Dec 2021 21:23:15 +0100
Subject: [PATCH 14/18] fix positioning

---
 las2peer-frontend-statusbar.js | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/las2peer-frontend-statusbar.js b/las2peer-frontend-statusbar.js
index 63af21c..022b456 100644
--- a/las2peer-frontend-statusbar.js
+++ b/las2peer-frontend-statusbar.js
@@ -45,13 +45,14 @@ class Las2peerFrontendStatusbar extends LitElement {
         #innercontainer {
           display: flex;
         }
-        #innercontainer:first-child {
+        /* #innercontainer:first-child {
           margin-left: 25px;
         }
         #innercontainer:last-child {
-          margin-right: 25px;
+          margin-right: 25px; 
           margin-left: auto !important;
-        }
+        } */
+        /* rules are not working for some reason so they are set on the respective elements as style attribute  */
         #statusbar-container {
           display: inline-block;
           width: ${this.displayWidth};
@@ -59,7 +60,11 @@ class Las2peerFrontendStatusbar extends LitElement {
       </style>
       <paper-card id="statusbar-container">
         <div id="innercontainer">
-          <slot class="inline center-vertical" name="left"></slot>
+          <slot
+            class="inline center-vertical"
+            name="left"
+            style="margin-left:25px"
+          ></slot>
           <slot class="inline" name="title">
             <div style="display: flex; flex-flow: column">
               <h1 id="service-title">${this.service}</h1>
@@ -70,6 +75,7 @@ class Las2peerFrontendStatusbar extends LitElement {
           </slot>
           <slot class="inline center-vertical" name="middle"></slot>
           <div
+            style="margin-left: auto; margin-right: 25px;"
             class="flex align-vertical"
             id="widget-container"
             @click=${this.handleClick}

From 300f91ee45816188449e1c27b31e01398402110b Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Thu, 23 Dec 2021 16:59:37 +0100
Subject: [PATCH 15/18] set styles in class

---
 las2peer-frontend-statusbar.js | 20 +++++++-------------
 1 file changed, 7 insertions(+), 13 deletions(-)

diff --git a/las2peer-frontend-statusbar.js b/las2peer-frontend-statusbar.js
index 022b456..1758d88 100644
--- a/las2peer-frontend-statusbar.js
+++ b/las2peer-frontend-statusbar.js
@@ -45,14 +45,13 @@ class Las2peerFrontendStatusbar extends LitElement {
         #innercontainer {
           display: flex;
         }
-        /* #innercontainer:first-child {
+        .last {
+          margin-left: auto;
+          margin-right: 25px;
+        }
+        .first {
           margin-left: 25px;
         }
-        #innercontainer:last-child {
-          margin-right: 25px; 
-          margin-left: auto !important;
-        } */
-        /* rules are not working for some reason so they are set on the respective elements as style attribute  */
         #statusbar-container {
           display: inline-block;
           width: ${this.displayWidth};
@@ -60,11 +59,7 @@ class Las2peerFrontendStatusbar extends LitElement {
       </style>
       <paper-card id="statusbar-container">
         <div id="innercontainer">
-          <slot
-            class="inline center-vertical"
-            name="left"
-            style="margin-left:25px"
-          ></slot>
+          <slot class="inline center-vertical first" name="left"></slot>
           <slot class="inline" name="title">
             <div style="display: flex; flex-flow: column">
               <h1 id="service-title">${this.service}</h1>
@@ -75,8 +70,7 @@ class Las2peerFrontendStatusbar extends LitElement {
           </slot>
           <slot class="inline center-vertical" name="middle"></slot>
           <div
-            style="margin-left: auto; margin-right: 25px;"
-            class="flex align-vertical"
+            class="flex align-vertical last"
             id="widget-container"
             @click=${this.handleClick}
             @signed-in="${this.handleLogin}"

From 50a86c5db0c4c6da0bfb784e52248e0562a68487 Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Thu, 23 Dec 2021 17:03:44 +0100
Subject: [PATCH 16/18] bump version

---
 package.json | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/package.json b/package.json
index 2c85637..c83773b 100644
--- a/package.json
+++ b/package.json
@@ -1,11 +1,11 @@
 {
-    "name": "las2peer-frontend-statusbar",
-    "version": "0.3.1",
-    "description": "A polymer widget which uses the las2peer Contact and UserInformation Service as well as the openId connect service",
-    "main": "las2peer-frontend-statusbar.js",
-    "dependencies": {
-        "las2peer-frontend-user-widget": "github:rwth-acis/las2peer-frontend-user-widget#widget-position-fix",
-        "lit-element": "^2.5.1",
-        "openidconnect-signin": "github:rwth-acis/openidconnect-signin"
-    }
+  "name": "las2peer-frontend-statusbar",
+  "version": "0.3.2",
+  "description": "A polymer widget which uses the las2peer Contact and UserInformation Service as well as the openId connect service",
+  "main": "las2peer-frontend-statusbar.js",
+  "dependencies": {
+    "las2peer-frontend-user-widget": "github:rwth-acis/las2peer-frontend-user-widget#widget-position-fix",
+    "lit-element": "^2.5.1",
+    "openidconnect-signin": "github:rwth-acis/openidconnect-signin"
+  }
 }

From a427cfa1ba57d27c404e7fdfc110a990c9d95432 Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Thu, 23 Dec 2021 17:09:14 +0100
Subject: [PATCH 17/18] user new version of user widget

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index c83773b..c886702 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
   "description": "A polymer widget which uses the las2peer Contact and UserInformation Service as well as the openId connect service",
   "main": "las2peer-frontend-statusbar.js",
   "dependencies": {
-    "las2peer-frontend-user-widget": "github:rwth-acis/las2peer-frontend-user-widget#widget-position-fix",
+    "las2peer-frontend-user-widget": "github:rwth-acis/las2peer-frontend-user-widget#0.3.1",
     "lit-element": "^2.5.1",
     "openidconnect-signin": "github:rwth-acis/openidconnect-signin"
   }

From ceec28e911397cbe9d0cb2d9cf326ce9462c4dc4 Mon Sep 17 00:00:00 2001
From: lakhoune <ben.lakhoune@rwth-aachen.de>
Date: Thu, 23 Dec 2021 17:29:22 +0100
Subject: [PATCH 18/18] update package-lock

---
 package-lock.json | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index c3a8796..3496815 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
     "name": "las2peer-frontend-statusbar",
-    "version": "0.3.1",
+    "version": "0.3.2",
     "lockfileVersion": 1,
     "requires": true,
     "dependencies": {
@@ -461,8 +461,8 @@
             "integrity": "sha512-bzHZN8Pn+gS7DQA6n+iUmBfl0hO5DJq++QP3U6uTucDtk/0iGpXd/Gg7CGR0p8tJhofJyaKoWBuJI4eAO00BBg=="
         },
         "las2peer-frontend-user-widget": {
-            "version": "github:rwth-acis/las2peer-frontend-user-widget#8d98f79917eac4ba6c5ded0ec810308041ed8cd2",
-            "from": "github:rwth-acis/las2peer-frontend-user-widget#widget-position-fix",
+            "version": "github:rwth-acis/las2peer-frontend-user-widget#5d958b96cc05d92aaa6ca5676ea6a09ef3c01489",
+            "from": "github:rwth-acis/las2peer-frontend-user-widget#0.3.1",
             "requires": {
                 "@polymer/iron-ajax": "^3.0.1",
                 "@polymer/iron-dropdown": "^3.0.1",