From 8a3a6e3f94d425c4d11536b00e3b017ff09c3a86 Mon Sep 17 00:00:00 2001
From: Hadi Nategh <hn@stylite.de>
Date: Wed, 28 Oct 2015 11:54:08 +0000
Subject: [PATCH] Fix tutorials popup styling

---
 etemplate/templates/default/egw_tutorial.xet |  2 +-
 home/templates/default/tutorial.xet          | 88 +++++++++++++-------
 2 files changed, 57 insertions(+), 33 deletions(-)

diff --git a/etemplate/templates/default/egw_tutorial.xet b/etemplate/templates/default/egw_tutorial.xet
index c7d79c0349..5f905b63f1 100644
--- a/etemplate/templates/default/egw_tutorial.xet
+++ b/etemplate/templates/default/egw_tutorial.xet
@@ -3,7 +3,7 @@
 <!-- $Id$ -->
 <overlay>
 	<template id="etemplate.egw_tutorial" template="" lang="" group="0" version="15.1">
-		<grid id="list" width="99%" height="200" overflow="auto">
+		<grid id="list" width="99%" overflow="auto">
 			<columns>
 				<column/>
 			</columns>
diff --git a/home/templates/default/tutorial.xet b/home/templates/default/tutorial.xet
index 1f6689d4e3..5edf9aa27a 100644
--- a/home/templates/default/tutorial.xet
+++ b/home/templates/default/tutorial.xet
@@ -3,37 +3,61 @@
 <!-- $Id$ -->
 <overlay>
 	<template id="home.tutorial" template="" lang="" group="0" version="15.1">
-		<hbox height="90%"  class="tutorial_popup">
-			<hbox class="tutorial_videoList" width="220px">
-				<grid id="list" classs="egwGridView_grid" resize_ratio="0" width="220px">
-					<columns>
-						<column/>
-					</columns>
-					<rows>
-						<row class="th" part="header">
-							<menulist>
-								<menupopup id="apps" label="Applications" statustext="Please select application name" onchange="1"/>
-							</menulist>
-						</row>
-						<row>
-							<vbox onclick="$row_cont[onclick]" align="center" statustext="$row_cont[desc]">
-								<hbox background="$row_cont[thumbnail]" height="130px" width="210px" class="egw_tutorial_thumb">
-									<description value = "$row_cont[title]" class="egw_tutorial_title"/>
-									<hbox id="play" class="egw_tutorial_playBtn">
-										<hbox></hbox>
-									</hbox>
-								</hbox>
-							</vbox>
-						</row>
-					</rows>
-				</grid>
-			</hbox>
-			<hbox class="tutorial_iframe_wrapper">
-				<iframe id="src" height="100%" seamless="true" width="100%" fullscreen="true"/>
-			</hbox>
-		</hbox>
-		<hbox class="dialogFooterToolbar">
-			<button  align="left" statustext="Close this window" label="Close" id="button[close]" onclick="window.close()" image="close" background_image="1"/>
-		</hbox>
+		<grid height="100%" width="100%">
+			<columns>
+				<column width="100%"/>
+			</columns>
+			<rows>
+				<row>
+					<hbox height="100%"  class="tutorial_popup">
+						<hbox class="tutorial_videoList" width="220px" height="580">
+							<grid id="list" classs="egwGridView_grid" resize_ratio="0"  width="220px">
+								<columns>
+									<column/>
+								</columns>
+								<rows>
+									<row class="th" part="header">
+										<menulist>
+											<menupopup id="apps" label="Applications" statustext="Please select application name" onchange="1"/>
+										</menulist>
+									</row>
+									<row>
+										<vbox onclick="$row_cont[onclick]" align="center" statustext="$row_cont[desc]">
+											<hbox background="$row_cont[thumbnail]" height="130px" width="210px" class="egw_tutorial_thumb">
+												<description value = "$row_cont[title]" class="egw_tutorial_title"/>
+												<hbox id="play" class="egw_tutorial_playBtn">
+													<hbox></hbox>
+												</hbox>
+											</hbox>
+										</vbox>
+									</row>
+								</rows>
+							</grid>
+						</hbox>
+						<hbox class="tutorial_iframe_wrapper">
+							<iframe id="src" height="100%" seamless="true" width="100%" fullscreen="true"/>
+						</hbox>
+					</hbox>	
+				</row>
+				<!-- This row needs to be here in order to keep footer always at bottom when we resize the window -->
+				<row> 
+					<grid resize_ratio="1">
+						<columns>
+							<column/>
+						</columns>
+						<rows>
+							<row>
+								<description/>
+							</row>
+						</rows>
+					</grid>
+				</row>
+				<row class="dialogFooterToolbar">
+					<hbox span="all">
+						<button  align="left" statustext="Close this window" label="Close" id="button[close]" onclick="window.close()" image="close" background_image="1"/>
+					</hbox>
+				</row>	
+			</rows>
+		</grid>
 	</template>
 </overlay>