publish show

src/app/modules/presentation/monitor/legal/legal.component.less

@@ -1,3 +1,16 @@
+:host {
+  position: fixed;
+  display: block;
+  z-index: 1;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background: #000c;
+  padding: 50px;
+  box-sizing: border-box;
+  box-shadow: 0px 0px 26px 10px #000;
+}
+
 p {
   font-size: 15px;
   margin: 10px 0 0 0;

src/app/modules/presentation/monitor/monitor.component.html

@@ -1,6 +1,4 @@
 <div [style.font-size.px]="zoom" class="fullscreen">
-
   <app-song-text [showSwitch]="false" [text]="song.text" chordMode="hide"></app-song-text>
-
   <app-legal [song]="song"></app-legal>
 </div>

src/app/modules/presentation/monitor/monitor.component.less

@@ -14,4 +14,5 @@
   display: flex;
   flex-direction: column;
   justify-content: space-between;
+  transition: 300ms all ease-in-out;
 }

src/app/modules/presentation/monitor/monitor.component.ts

@@ -13,8 +13,8 @@ import {Song} from '../../songs/services/song';
 })
 export class MonitorComponent implements OnInit {
   public song: Song;
+  public zoom: number;
   private index: number;
-  private zoom: number;
   private sections: Section[];
 
   constructor(