Move fullscreen button to the top-right corner.

Signed-off-by: Ivan Sein <ivan@nextcloud.com>

css/style.css

@@ -323,6 +323,17 @@ video {
 	padding: 12px 35%;
 }
 
+#video-fullscreen {
+	position: absolute;
+	right: 0px;
+	z-index: 90;
+}
+
+#video-fullscreen.public {
+	top: 45px;
+}
+
+#video-fullscreen,
 .nameIndicator button {
 	background-color: transparent;
 	border: none;

templates/index-public.php

@@ -49,6 +49,8 @@ script(
 			</div>
 		</header>
 
+		<button id="video-fullscreen" class="icon-fullscreen-white public" data-title="<?php p($l->t('Fullscreen')) ?>"></button>
+
 		<div id="video-speaking">
 
 		</div>
@@ -61,7 +63,6 @@ script(
 				<div class="nameIndicator">
 					<button id="mute" class="icon-audio-white" data-title="<?php p($l->t('Mute audio')) ?>"></button>
 					<button id="hideVideo" class="icon-video-white" data-title="<?php p($l->t('Pause video')) ?>"></button>
-					<button id="video-fullscreen" class="icon-fullscreen-white" data-title="<?php p($l->t('Fullscreen')) ?>"></button>
 					<button id="toogleScreensharing" class="icon-view-play" data-title="<?php p($l->t('Toggle screensharing')) ?>"></button>
 				</div>
 			</div>

templates/index.php

@@ -35,6 +35,8 @@ script(
 
 	<div id="app-content" class="participants-1">
 
+		<button id="video-fullscreen" class="icon-fullscreen-white" data-title="<?php p($l->t('Fullscreen')) ?>"></button>
+
 		<div id="video-speaking">
 
 		</div>
@@ -47,7 +49,6 @@ script(
 				<div class="nameIndicator">
 					<button id="mute" class="icon-audio-white" data-title="<?php p($l->t('Mute audio')) ?>"></button>
 					<button id="hideVideo" class="icon-video-white" data-title="<?php p($l->t('Pause video')) ?>"></button>
-					<button id="video-fullscreen" class="icon-fullscreen-white" data-title="<?php p($l->t('Fullscreen')) ?>"></button>
 					<button id="toogleScreensharing" class="icon-view-play" data-title="<?php p($l->t('Toggle screensharing')) ?>"></button>
 				</div>
 			</div>