From cbe595e7b61cb3799baa64b4c3a20f8358ade9f1 Mon Sep 17 00:00:00 2001
From: Hanusiak Piotr <piotr@ltmp.co>
Date: Tue, 7 Dec 2021 15:21:54 +0100
Subject: [PATCH] simples woka icon styling

---
 front/src/Components/Video/VideoMediaBox.svelte | 16 ++++++++++++++--
 front/src/Components/Woka/Woka.svelte           |  5 +++++
 front/style/style.scss                          |  1 -
 3 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/front/src/Components/Video/VideoMediaBox.svelte b/front/src/Components/Video/VideoMediaBox.svelte
index 1387e655..4498d047 100644
--- a/front/src/Components/Video/VideoMediaBox.svelte
+++ b/front/src/Components/Video/VideoMediaBox.svelte
@@ -29,8 +29,8 @@
         <div class="rtc-error" />
     {/if}
     {#if !$constraintStore || $constraintStore.video === false}
-        <i style="background-color: {getColorByString(name)};">
-            <Woka userId={peer.userId} placeholderSrc={""} />
+        <i class="container" style="background-color: {getColorByString(name)};">
+            <div class="woka-icon"><Woka userId={peer.userId} placeholderSrc={""} /></div>
         </i>
     {/if}
     {#if $constraintStore && $constraintStore.audio === false}
@@ -47,3 +47,15 @@
         <SoundMeterWidget stream={$streamStore} />
     {/if}
 </div>
+
+<style>
+    .container {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+    }
+
+    .woka-icon {
+        margin-right: 3px;
+    }
+</style>
diff --git a/front/src/Components/Woka/Woka.svelte b/front/src/Components/Woka/Woka.svelte
index b1cc02ba..1311973b 100644
--- a/front/src/Components/Woka/Woka.svelte
+++ b/front/src/Components/Woka/Woka.svelte
@@ -29,6 +29,11 @@
         height: var(--theme-height);
         margin: 0;
         padding: 0;
+        position: static;
+        left: 0;
+        bottom: 0;
+        right: 0;
+        top: 0;
         image-rendering: pixelated;
     }
 </style>
diff --git a/front/style/style.scss b/front/style/style.scss
index 1654156d..254d0513 100644
--- a/front/style/style.scss
+++ b/front/style/style.scss
@@ -62,7 +62,6 @@ body .message-info.warning{
         background-color: black;
         border-radius: 50%;
         text-align: center;
-        padding-top: 32px;
         font-size: 28px;
         color: white;
         overflow: hidden;