[player] Refactor styles of layout component and marking bar

projects/common/element-components/text.component.ts

@@ -41,7 +41,7 @@ import { TextElement } from '../models/text-element';
     </div>
   `,
   styles: [
-    '.marking-bar{position: sticky; top: 0}',
+    '.marking-bar{position: sticky; top: 0; margin-bottom: 15px}',
     '.marking-button{color: #333}'
   ]
 })

projects/player/src/app/components/layout/layout.component.css

@@ -21,9 +21,11 @@
 
 .layout-container{
   margin: auto;
+  display: flex;
 }
 
 .layout-flex-container{
+  width: 100%;
   height: 100vh;
   display: flex;
   flex-direction: column;
@@ -36,6 +38,5 @@
 }
 
 .keyboard {
-
   width: 100%;
 }