diff --git a/htdocs/index.wrx b/htdocs/index.wrx
index f091933..edf6356 100644
--- a/htdocs/index.wrx
+++ b/htdocs/index.wrx
@@ -44,29 +44,31 @@
diff --git a/htdocs/openwebrx.css b/htdocs/openwebrx.css
index 9e75d84..e2c1c44 100644
--- a/htdocs/openwebrx.css
+++ b/htdocs/openwebrx.css
@@ -155,22 +155,12 @@ input[type=range]:focus::-ms-fill-upper
.webrx-top-bar-parts
{
- position: absolute;
- top: 0px;
- left: 0px;
- width:100%;
height:67px;
}
-#webrx-top-bar-background
-{
- background-color: #808080;
- opacity: 0.15;
- filter:alpha(opacity=15);
-}
-
#webrx-top-bar
{
+ background: rgba(128, 128, 128, 0.15);
margin:0;
padding:0;
user-select: none;
@@ -179,20 +169,23 @@ input[type=range]:focus::-ms-fill-upper
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
+ overflow: hidden;
+ position: absolute;
+ left: 0;
+ top: 0;
+ right: 0;
}
#webrx-top-logo
{
- position: absolute;
- top: 12px;
- left: 15px;
+ padding: 12px;
+ float: left;
}
#webrx-ha5kfu-top-logo
{
- position: absolute;
- top: 15px;
- right: 15px;
+ float: right;
+ padding: 15px;
}
#webrx-top-photo
@@ -204,79 +197,37 @@ input[type=range]:focus::-ms-fill-upper
#webrx-rx-avatar-background
{
cursor:pointer;
- position: absolute;
- left: 285px;
- top: 6px;
+ background-image: url(gfx/openwebrx-avatar-background.png);
+ background-origin: content-box;
+ background-repeat: no-repeat;
+ float: left;
+ width: 54px;
+ height: 54px;
+ padding: 7px;
}
#webrx-rx-avatar
{
cursor:pointer;
- position: absolute;
- left: 289px;
- top: 10px;
width: 46px;
height: 46px;
+ padding: 4px;
}
#webrx-top-photo-clip
{
+ min-height: 67px;
max-height: 350px;
overflow: hidden;
position: relative;
}
-/*#webrx-bottom-bar
-{
- position: absolute;
- bottom: 0px;
- width: 100%;
- height: 117px;
- background-image:url(gfx/webrx-bottom-bar.png);
-}*/
-
#webrx-page-container
{
min-height:100%;
position:relative;
}
-/*#webrx-photo-gradient-left
-{
- position: absolute;
- bottom: 0px;
- left: 0px;
- background-image:url(gfx/webrx-photo-gradient-corner.png);
- width: 59px;
- height: 92px;
-
-}
-
-#webrx-photo-gradient-middle
-{
- position: absolute;
- bottom: 0px;
- left: 59px;
- right: 59px;
- height: 92px;
- background-image:url(gfx/webrx-photo-gradient-middle.png);
-}
-
-#webrx-photo-gradient-right
-{
- position: absolute;
- bottom: 0px;
- right: 0px;
- background-image:url(gfx/webrx-photo-gradient-corner.png);
- width: 59px;
- height: 92px;
- -webkit-transform:scaleX(-1);
- -moz-transform:scaleX(-1);
- -ms-transform:scaleX(-1);
- -o-transform:scaleX(-1);
- transform:scaleX(-1);
-}*/
-
#webrx-rx-photo-title
{
position: absolute;
@@ -303,10 +254,17 @@ input[type=range]:focus::-ms-fill-upper
#webrx-rx-photo-desc a
{
- /*color: #007df1;*/
color: #5ca8ff;
text-shadow: none;
- /*text-shadow: 0px 0px 7px #fff;*/
+}
+
+#webrx-rx-texts {
+ float: left;
+ padding: 10px;
+}
+
+#webrx-rx-texts div {
+ padding: 3px;
}
#webrx-rx-title
@@ -314,9 +272,6 @@ input[type=range]:focus::-ms-fill-upper
white-space:nowrap;
overflow: hidden;
cursor:pointer;
- position: absolute;
- left: 350px;
- top: 13px;
font-family: "DejaVu Sans", Verdana, Geneva, sans-serif;
color: #909090;
font-size: 11pt;
@@ -330,15 +285,11 @@ input[type=range]:focus::-ms-fill-upper
cursor:pointer;
font-size: 10pt;
color: #909090;
- position: absolute;
- left: 350px;
- top: 34px;
}
#webrx-rx-desc a
{
color: #909090;
- /*text-decoration: none;*/
}
#openwebrx-rx-details-arrow
@@ -718,9 +669,7 @@ img.openwebrx-mirror-img
#openwebrx-main-buttons
{
- position: absolute;
- right: 133px;
- top: 3px;
+ float: right;
margin:0;
color: white;
text-shadow: 0px 0px 4px #000000;
diff --git a/htdocs/openwebrx.js b/htdocs/openwebrx.js
index f5a17b4..efd7ddb 100644
--- a/htdocs/openwebrx.js
+++ b/htdocs/openwebrx.js
@@ -80,7 +80,8 @@ is_chrome = /Chrome/.test(navigator.userAgent);
function init_rx_photo()
{
var clip = e("webrx-top-photo-clip");
- clip.style.maxHeight=clip.clientHeight+"px";
+ rx_photo_height = clip.clientHeight
+ clip.style.maxHeight=rx_photo_height+"px";
window.setTimeout(function() { animate(e("webrx-rx-photo-title"),"opacity","",1,0,1,500,30); },1000);
window.setTimeout(function() { animate(e("webrx-rx-photo-desc"),"opacity","",1,0,1,500,30); },1500);
window.setTimeout(function() { close_rx_photo() },2500);