From 6bd91ddffe86ebeb10420f05a232f8e779eaf86d Mon Sep 17 00:00:00 2001 From: Dieter Hametner Date: Sun, 29 Jul 2007 17:41:38 +0000 Subject: - Made vdr ajax requests work also via a static page. This is for browsers that don't support javascript (e.g. PDA browsers) - Implemented for AJAX request a visual notification how requested action performed. - Adapted styles for this. - Moded images for rounded boxes (formerly tip-hint-??.png) to central image directory and renamed them according to their color. This makes them reusable in different themes. - Adapted themes to this move. --- css/siteprefs.css | 60 +++++++++++++++++++++++++++ css/styles.css | 120 ++++++++++++++++++++++++++++++++++++++++++++++++++---- 2 files changed, 173 insertions(+), 7 deletions(-) (limited to 'css') diff --git a/css/siteprefs.css b/css/siteprefs.css index ed92cb0..61955c3 100644 --- a/css/siteprefs.css +++ b/css/siteprefs.css @@ -15,3 +15,63 @@ table { width: 100%; } */ + +/* comment this out, if you want epg images at their native size + * the popup windows. This here restricts their width to 120 px. + * You might also only change size. + */ +.info-win span.epg_images { + width: 120px; +} + + + + + +.notify-win { + margin: 0px auto; + max-width: 480px; /* depends on the tip backround image width */ + color: #fff; +} + +.notify-win .notify-win-top .notify-win-c, +.notify-win .notify-win-bot .notify-win-c { + font-size: 1px; /* ensure minimum height */ + height: 17px; +} + +.notify-win .notify-win-top { + background: transparent url(/img/rounded-box-green-tl.png) no-repeat 0px 0px; + margin-right: 17px; /* space for right corner */ +} + +.notify-win .notify-win-top .notify-win-c { + background: transparent url(/img/rounded-box-green-tr.png) no-repeat right 0px; + margin-right: -17px; /* pull right corner back over "empty" space (from above margin) */ +} + +.notify-win .notify-win-body { + background: transparent url(/img/rounded-box-green-ml.png) repeat-y 0px 0px; + margin-right: 17px; +} + +.notify-win .notify-win-body .notify-win-c { + background: transparent url(/img/rounded-box-green-mr.png) repeat-y right 0px; + margin-right: -17px; +} + +.notify-win .notify-win-body .notify-win-c .notify-win-s { /* optional gradient overlay */ + /* background: transparent url(/img/rounded-box-green-ms.jpg) repeat-x 0px 0px; */ + padding: 0px 17px 0px 17px; +} + +.notify-win .notify-win-bot { + background: transparent url(/img/rounded-box-green-bl.png) no-repeat 0px 0px; + margin-right: 17px; +} + +.notify-win .notify-win-bot .notify-win-c { + background: transparent url(/img/rounded-box-green-br.png) no-repeat right 0px; + margin-right: -17px; +} + diff --git a/css/styles.css b/css/styles.css index 8732e31..9bc25ea 100644 --- a/css/styles.css +++ b/css/styles.css @@ -119,37 +119,37 @@ a:active { } .hint-tip .hint-tip-top { - background: transparent url(img/tip-hint-tl.png) no-repeat 0px 0px; + background: transparent url(img/rounded-box-blue-tl.png) no-repeat 0px 0px; margin-right: 17px; /* space for right corner */ } .hint-tip .hint-tip-top .hint-tip-c { - background: transparent url(img/tip-hint-tr.png) no-repeat right 0px; + background: transparent url(img/rounded-box-blue-tr.png) no-repeat right 0px; margin-right: -17px; /* pull right corner back over "empty" space (from above margin) */ } .hint-tip .hint-tip-bdy { - background: transparent url(img/tip-hint-ml.png) repeat-y 0px 0px; + background: transparent url(img/rounded-box-blue-ml.png) repeat-y 0px 0px; margin-right: 17px; } .hint-tip .hint-tip-bdy .hint-tip-c { - background: transparent url(img/tip-hint-mr.png) repeat-y right 0px; + background: transparent url(img/rounded-box-blue-mr.png) repeat-y right 0px; margin-right: -17px; } .hint-tip .hint-tip-bdy .hint-tip-c .hint-tip-s { /* optional gradient overlay */ - /* background: transparent url(img/tip-hint-ms.jpg) repeat-x 0px 0px; */ + /* background: transparent url(img/rounded-box-blue-ms.jpg) repeat-x 0px 0px; */ padding: 0px 17px 0px 17px; } .hint-tip .hint-tip-bot { - background: transparent url(img/tip-hint-bl.png) no-repeat 0px 0px; + background: transparent url(img/rounded-box-blue-bl.png) no-repeat 0px 0px; margin-right: 17px; } .hint-tip .hint-tip-bot .hint-tip-c { - background: transparent url(img/tip-hint-br.png) no-repeat right 0px; + background: transparent url(img/rounded-box-blue-br.png) no-repeat right 0px; margin-right: -17px; } @@ -158,6 +158,112 @@ a:active { } +/* ###################### + # Style for positive notification popup + ###################### +*/ + +.ok-info { + margin: 0px auto; + max-width: 480px; /* depends on the tip backround image width */ + color: #fff; +} + +.ok-info .ok-info-top .ok-info-c, +.ok-info .ok-info-bot .ok-info-c { + font-size: 1px; /* ensure minimum height */ + height: 17px; +} + +.ok-info .ok-info-top { + background: transparent url(/img/rounded-box-green-tl.png) no-repeat 0px 0px; + margin-right: 17px; /* space for right corner */ +} + +.ok-info .ok-info-top .ok-info-c { + background: transparent url(/img/rounded-box-green-tr.png) no-repeat right 0px; + margin-right: -17px; /* pull right corner back over "empty" space (from above margin) */ +} + +.ok-info .ok-info-body { + background: transparent url(/img/rounded-box-green-ml.png) repeat-y 0px 0px; + margin-right: 17px; +} + +.ok-info .ok-info-body .ok-info-c { + background: transparent url(/img/rounded-box-green-mr.png) repeat-y right 0px; + margin-right: -17px; +} + +.ok-info .ok-info-body .ok-info-c .ok-info-s { /* optional gradient overlay */ + /* background: transparent url(/img/rounded-box-green-ms.jpg) repeat-x 0px 0px; */ + padding: 0px 17px 0px 17px; +} + +.ok-info .ok-info-bot { + background: transparent url(/img/rounded-box-green-bl.png) no-repeat 0px 0px; + margin-right: 17px; +} + +.ok-info .ok-info-bot .ok-info-c { + background: transparent url(/img/rounded-box-green-br.png) no-repeat right 0px; + margin-right: -17px; +} + + +.err-info { + margin: 0px auto; + max-width: 480px; /* depends on the tip backround image width */ + color: #fff; +} + + +/* ###################### + # Style for negative notification popup + ###################### +*/ + +.err-info .err-info-top .err-info-c, +.err-info .err-info-bot .err-info-c { + font-size: 1px; /* ensure minimum height */ + height: 17px; +} + +.err-info .err-info-top { + background: transparent url(/img/rounded-box-redwine-tl.png) no-repeat 0px 0px; + margin-right: 17px; /* space for right corner */ +} + +.err-info .err-info-top .err-info-c { + background: transparent url(/img/rounded-box-redwine-tr.png) no-repeat right 0px; + margin-right: -17px; /* pull right corner back over "empty" space (from above margin) */ +} + +.err-info .err-info-body { + background: transparent url(/img/rounded-box-redwine-ml.png) repeat-y 0px 0px; + margin-right: 17px; +} + +.err-info .err-info-body .err-info-c { + background: transparent url(/img/rounded-box-redwine-mr.png) repeat-y right 0px; + margin-right: -17px; +} + +.err-info .err-info-body .err-info-c .err-info-s { /* optional gradient overlay */ + /* background: transparent url(/img/rounded-box-redwine-ms.jpg) repeat-x 0px 0px; */ + padding: 0px 17px 0px 17px; +} + +.err-info .err-info-bot { + background: transparent url(/img/rounded-box-redwine-bl.png) no-repeat 0px 0px; + margin-right: 17px; +} + +.err-info .err-info-bot .err-info-c { + background: transparent url(/img/rounded-box-redwine-br.png) no-repeat right 0px; + margin-right: -17px; +} + /* ###################### # General styles for epg info ###################### -- cgit v1.2.3