Add small "close/hide" buttons on some of the dialogs

diff --git a/share/http/dialogs/browse b/share/http/dialogs/browse
index f41829fd38a7265e8978a3d22fcaabaaddf6ba31..70c1a8df719df7b710d8401ea9b9e5f3a4076ce6 100644 (file)
--- a/share/http/dialogs/browse
+++ b/share/http/dialogs/browse
@@ -29,6 +29,7 @@ This dialog needs the following dialogs to be fully functional: <none>
 <div id="browse" class="popup" style="display: none;">
   <div class="title">
     Browse
+    <img class="close" src="images/white_cross_small.png" alt="Close" onclick="hide('browse');"/>
   </div>
   <div id="browser">
     <a href="javascript:browse_dir(document.getElementById( 'browse_lastdir' ).value);">Click here to browse</a>

diff --git a/share/http/dialogs/input b/share/http/dialogs/input
index 51e28daf6bdb2066de79fd737666a7f99e483a17..9975633462857b9351e4d560ff142a99fbd8b581 100644 (file)
--- a/share/http/dialogs/input
+++ b/share/http/dialogs/input
@@ -29,6 +29,7 @@ This dialog needs the following dialogs to be fully functional: browse
 <div id="input" class="dialog" style="display: none">
   <div class="title">
     Input
+    <img class="close" src="images/white_cross_small.png" alt="Close" onclick="hide('input');"/>
   </div>
   <div class="controls">
     <label for="input_mrl">Input (MRL)</label>

diff --git a/share/http/dialogs/main b/share/http/dialogs/main
index c27a16c1eabc1dc720c09a8b76a98d33dcbdc7fb..3cac7c04ba9b45856f7a90db7399edfb4e5f0b20 100644 (file)
--- a/share/http/dialogs/main
+++ b/share/http/dialogs/main
@@ -107,9 +107,7 @@ sout and playlist .
 <div id="info" class="dialog" style="display: none;" >
   <div class="title">
     Stream and media info
-    <button id="btn_info_hide" onclick="hide( 'info' );">
-      Hide
-    </button>
+    <img class="close" src="images/white_cross_small.png" alt="Close" onclick="hide('info');"/>
   </div>
   <div id="infotree">
   </div>

diff --git a/share/http/dialogs/playlist b/share/http/dialogs/playlist
index 1113e2b5bbc869f571603dbf87f7e1e361d8cc61..40ba0a0caa499225c7f52d14fe18e5c8ce297430 100644 (file)
--- a/share/http/dialogs/playlist
+++ b/share/http/dialogs/playlist
@@ -28,6 +28,7 @@ This dialog needs the following dialogs to be fully functional: <none>
 <div id="playlist" class="dialog" >
   <div class="title">
     Playlist
+    <img class="close" src="images/white_cross_small.png" alt="Close" onclick="hide('playlist');"/>
   </div>
   <div class="controls">
     <!--<button id="btn_delete" onmouseover="button_over(this);" onmouseout="button_out(this);">

diff --git a/share/http/dialogs/sout b/share/http/dialogs/sout
index 9722b2a715feda4e2da3969a6e2b4da8d3dfe48c..61ed37a6d4198b60f3e008805f36c9158a4199b4 100644 (file)
--- a/share/http/dialogs/sout
+++ b/share/http/dialogs/sout
@@ -30,6 +30,7 @@ Note that the sout chain is used and sent to VLC by the input dialog
 <div id="sout" class="dialog" style="display: none">
   <div class="title">
     Stream Output
+    <img class="close" src="images/white_cross_small.png" alt="Close" onclick="hide('sout');"/>
   </div>
   <div class="controls">
     <label for="sout_mrl">Destination (MRL)</label>

diff --git a/share/http/style.css b/share/http/style.css
index c080c30ab31d51a598588415a643de6b595ca8fb..0b3534611c8f7e5a6b02f001bdce0748afd06d67 100644 (file)
--- a/share/http/style.css
+++ b/share/http/style.css
@@ -26,6 +26,8 @@ body {
        font-family: Arial, sans-serif;
        font-size: 12pt;
        text-align: center; /* Center on page - IE */
+       padding: 0px;
+       margin: 0px;
 }
 
 div {
@@ -142,7 +144,7 @@ div.popup {
        border: solid #888 1px;
        margin: 10px auto; /* Center on page - Firefox */
        position: absolute;
-       z-index: 1;
+       z-index: 2;
        font-size: 0.8em;
 }
 div#browse {
@@ -152,6 +154,7 @@ div#browse {
 div#browse div.title {
        background-color: #008;
 }
+
 div#browser {
        padding: 20px;
 }
@@ -199,3 +202,9 @@ div.menu button {
        background: transparent;
        border: 1px solid transparent;
 }
+
+div.popup img.close {
+       position: absolute;
+       right: 2px;
+       top: 2px;
+}