infobox shadow

diff --git a/backend.php b/backend.php
index 9f328bf435ba0303a285743b9a0362cf08778f37..cd05898f3c95adc66c1664fe4047600d5003ae5b 100644 (file)
--- a/backend.php
+++ b/backend.php
@@ -1011,7 +1011,7 @@
                        FROM 
                                ttrss_feeds WHERE owner_uid = '".$_SESSION["uid"]."' ORDER by title");
 
-               print "<div id=\"infoBox\">PLACEHOLDER</div>";
+               print "<div id=\"infoBoxShadow\"><div id=\"infoBox\">PLACEHOLDER</div></div>";
 
                print "<p><table width=\"100%\" class=\"prefFeedList\" id=\"prefFeedList\">";
                print "<tr class=\"title\">
@@ -1978,7 +1978,7 @@
                                ttrss_users
                        ORDER by login");
 
-               print "<div id=\"infoBox\">PLACEHOLDER</div>";
+               print "<div id=\"infoBoxShadow\"><div id=\"infoBox\">PLACEHOLDER</div></div>";
 
                print "<p><table width=\"100%\" class=\"prefUserList\" id=\"prefUserList\">";
 

diff --git a/images/shadow.png b/images/shadow.png
new file mode 100644 (file)
index 0000000..e4ce11d
Binary files /dev/null and b/images/shadow.png differ

diff --git a/prefs.js b/prefs.js
index 0207fcea145fd8d51139a3c376176130e46b05e1..4f3786fcb418371237bded9cb59ca9b11a881cc5 100644 (file)
--- a/prefs.js
+++ b/prefs.js
@@ -120,11 +120,17 @@ function userlist_callback() {
 }
 
 function infobox_callback() {
-       var container = document.getElementById('infoBox');
        if (xmlhttp.readyState == 4) {
-               if (container) {
-                       container.innerHTML=xmlhttp.responseText;
-                       container.style.display = "block";
+               var box = document.getElementById('infoBox');
+               var shadow = document.getElementById('infoBoxShadow');
+
+               if (box) {
+                       box.innerHTML=xmlhttp.responseText;
+                       if (shadow) {
+                               shadow.style.display = "block";
+                       } else {
+                               box.style.display = "block";
+                       }
                }
        }
 }
@@ -1121,6 +1127,12 @@ function dispOptionHelp(event, sender) {
 } */
 
 function closeInfoBox() {
-       var d = document.getElementById('infoBox');
-       d.style.display = "none";
+       var box = document.getElementById('infoBox');
+       var shadow = document.getElementById('infoBoxShadow');
+
+       if (shadow) {
+               shadow.style.display = "none";
+       } else if (box) {
+               box.style.display = "none";
+       }
 }

diff --git a/tt-rss.css b/tt-rss.css
index 5b50b6f78986966392f24d37396dd9cea1574a64..0e919c10bf16f15f18f345a698386584224befdf 100644 (file)
--- a/tt-rss.css
+++ b/tt-rss.css
@@ -425,15 +425,38 @@ div.helpResponse {
        border : 1px solid #f0f0f0;
 }
 
+#infoBox {
+       border : 1px solid #c0c0c0;
+       padding-bottom : 10px;
+       font-size : small;
+       position : relative;
+       bottom : 2px;
+       right : 2px;
+       background-color : white;
+}
+
+#infoBoxShadow {
+       background-image : url("images/shadow.png");
+       position : absolute;
+       margin-left : 30%;
+       width : 30%;
+       z-index : 3;
+       display : none;
+}
+
 div.infoBoxContents {
        background-image : url("images/vgrad_light_rev2.png");
        background-position : top left;
        background-repeat : repeat-x;
        padding : 5px;
-       margin-bottom : 10px;
-       border : 1px solid #f0f0f0;
+       margin-bottom : 5px;
+}
+
+div.infoBoxContents td {
+       font-size : small;
 }
 
+
 div.helpResponse h1, div.infoBoxContents h1 {
        border-width : 0px 0px 1px 0px;
        border-style : solid;
@@ -581,22 +604,6 @@ table.innerLoginForm td {
        padding : 3px 3px 5px 3px;
 }
 
-#infoBox {
-       position : absolute;
-       margin-left : 30%;
-       background-color : white;
-       width : 30%;
-       z-index : 3;
-       border : 1px solid #c0c0c0;
-       padding-bottom : 10px;
-       display : none;
-       font-size : small;
-}
-
-div.infoBoxContents td {
-       font-size : small;
-}
-
 div.small, p.small {
        font-size : x-small;
 }