- New theme orange-blue (see ChangeLog for more info).

- Some minor style fixes.

23 files changed, 377 insertions, 83 deletions

diff --git a/css/styles.css b/css/styles.css
index e29b3a8..69e0fa7 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -333,68 +333,10 @@ div#infobox div.st_controls div#infobox_channel_buttons {
         padding-left: 5px;
 }
 
-/* #######################
-   #  Head Box
-   #######################
-*/
-
-/* NOT USED
-div.head_box_l {
-	background-image: url(bg_header_l.png);
-	background-position: top left;
-	background-repeat: no-repeat;
-	margin: 0;
-	margin-bottom: 2ex;
-	padding: 0;
-}
-*/
-
-/* NOT USED
-div.head_box_m {
-	background-image: url(bg_header_h.png);
-	background-repeat: repeat-x;
-	margin: 3px;
-	padding: 0;
-}
+/* #################################
+   # Buttons
+   #################################
 */
-
-/* NOT USED
-div.head_box_r {
-	background-image: url(bg_header_r.png);
-	background-position: top right;
-	background-repeat: no-repeat;
-	margin: -3px;
-	padding: 0;
-	padding-left: 0.5em;
-}
-*/
-
-/* NOT USED:
-table.head_box_text {
-	color: #ffffff;
-	font-weight: bold;
-	padding: 0;
-	margin: 0;
-	height: 30px;
-}
-*/
-
-/* NOT USED:
-button.smallbutton {
-	width: 51px;
-	height: 17px;
-	background-color: inherit;
-	background-image: url(button_blue.png);
-	background-repeat: no-repeat;
-	color: #FFFFFF;
-	font-size: 11px;
-	border: 0px;
-	vertical-align: middle;
-	text-align: center;
-	cursor: pointer;
-}
-*/
-
 button.green {
 	width: 100px;
 	height: 20px;
@@ -440,6 +382,11 @@ button.blue {
 	padding-bottom: 3px;
 }
 
+
+/* ################################
+   # general table cell classes
+   ################################
+*/
 table td.buttonpanel {
 	text-align: right;
 }
@@ -572,6 +519,14 @@ div.description {
 	margin: 5px;
 }
 
+div.title {
+	margin: 5px;
+}
+
+div.short {
+	margin: 5px;
+}
+
 div.info {
 	text-align: right;
 	padding: 5px;
@@ -941,7 +896,6 @@ table.formular tr td.label {
 }
 
 table.formular tr.head td {
-	background: white;
 	color: white;
 	font-weight: bold;
 	margin: 0;
diff --git a/doc/ChangeLog b/doc/ChangeLog
index 97ea096..2576af5 100644
--- a/doc/ChangeLog
+++ b/doc/ChangeLog
@@ -1,3 +1,18 @@
+2007-06-12  Dieter Hametner  <dh+vdr at gekrumbel dot de>
+
+	Added orange-blue theme as an example of a theme with dark
+	background and light foreground colors. This theme also
+	demonstrates the use of exchanged images (logo.png, tv.jpg and
+	remotecontrol.jpg)
+
+	* styles.css: some minor style fixes, that became visible while
+	creating the orange-blue theme.
+
+2007-06-11  Dieter Hametner  <dh+vdr at gekrumbel dot de>
+
+	Fixed style layout of the tables. Added class 'bottomrow' to the
+	rows that are followed by empty spacer rows.
+
 2007-06-06  Dieter Hametner  <dh+vdr at gekrumbel dot de>
 
 	Use GetConfigDir instead of USRDIR define.
diff --git a/doc/css-themeing.txt b/doc/css-themeing.txt
index 3148838..7b9137d 100644
--- a/doc/css-themeing.txt
+++ b/doc/css-themeing.txt
@@ -58,11 +58,11 @@ Location of the resources in the file system
 --------------------------------------------
 
 All themable content must be present in the directory specified by
-USRDIR. The default USRDIR is /usr/share/vdr-plugin-live. This can be
-changed at compile time by setting the USRDIR variable
-(i.E. USRDIR=/tmp/live make).
-
-That means all themes must reside in USRDIR/themes.
+'GetConfigDir'. GetConfigDir returns at runtime the position in the
+filesystem where the plugins configuration file is stored. The
+location is build from the vdr config path appended with the plugins
+name (i.E. /var/lib/vdr/plugins/live). The themes are located in the
+'themes' subdirectory of the above path.
 
 
 Structure of a theme package
@@ -89,25 +89,25 @@ Selecting a theme in live
 In the live setup page, the user can select the desired theme. When
 the settings are saved the selected themes become active. Live detects
 the available themes dynamicaly by scanning the 'themes' directory in
-USERDIR for available themes and creates the select box from this
-information.
+plugins config directory for available themes and creates the select
+box from this information.
 
 So the installation of a new theme is easyly done by unpacking a
-theme-archive in USRDIR/themes. This assumes the theme-archive follows
-the structure of a theme package as described above.
+theme-archive in the themes directory. This assumes the theme-archive
+follows the structure of a theme package as described above.
 
 
 Security provisions
 -------------------
 
 Live will map every url starting with themes/<themename>/css or
-themes/<themename>/img to exactly these directories under USRDIR. That
-means any path components after 'img' or 'css' are discarded. Only the
-basename of the url is appended to these directories. This is to
-prevent possible malicous requests to other locations in the
-filesystem by adding '..' to the request path. The downside of this
-is, that no additional directories below 'img' and 'css' are possible
-for the theme designer.
+themes/<themename>/img to exactly these directories under the location
+of the themes directory. That means any path components after 'img' or
+'css' are discarded. Only the basename of the url is appended to these
+directories. This is to prevent possible malicous requests to other
+locations in the filesystem by adding '..' to the request path. The
+downside of this is, that no additional directories below 'img' and
+'css' are possible for the theme designer.
 
 
 User Contribution
@@ -116,5 +116,5 @@ User Contribution
 If you created a nice new look, you can provide it to us. We will try
 to include it into the live distribution.
 
-If you need special html support for your styling needs don't hesitate
+If you need special html support for your styling needs, don't hesitate
 to submit a suggestion.
diff --git a/images/button_blue.png b/images/button_blue.png
index 722c9de..f18eb4e 100644
--- a/images/button_blue.png
+++ b/images/button_blue.png
diff --git a/images/button_green.png b/images/button_green.png
index 45074cf..23b40bd 100644
--- a/images/button_green.png
+++ b/images/button_green.png
diff --git a/images/button_red.png b/images/button_red.png
index cfe76b3..5492ec7 100644
--- a/images/button_red.png
+++ b/images/button_red.png
diff --git a/images/button_yellow.png b/images/button_yellow.png
index 18fcae3..02c00cf 100644
--- a/images/button_yellow.png
+++ b/images/button_yellow.png
diff --git a/pages/recordings.ecpp b/pages/recordings.ecpp
index 6695925..21d1f14 100644
--- a/pages/recordings.ecpp
+++ b/pages/recordings.ecpp
@@ -43,18 +43,20 @@ EpgEvents epgEvents;
 		<div class="inhalt">
 			<div class="boxheader"><div><div><$ tr("List of recordings") $></div></div></div>
 %			if (Recordings.Count() == 0) {
-				<$ tr("No recordings found") $>
+			<$ tr("No recordings found") $>
 %			} else {
 			<div class="recordings">
 			<ul class="recordingslist" style="display: block;">
 <& recordings.recordings_item &>
 			</ul>
 			</div>
-			<div class="epg_data" style="display: none;">
-<& recordings.recordings_data &>
-			</div>
 %			}
 		</div>
+%			if (Recordings.Count() > 0) {
+		<div class="epg_data" style="display: none;">
+<& recordings.recordings_data &>
+		</div>
+%			}
 	</body>
 </html>
 <%include>page_exit.eh</%include>
diff --git a/themes/orange-blue/css/theme.css b/themes/orange-blue/css/theme.css
new file mode 100644
index 0000000..a9fa79b
--- /dev/null
+++ b/themes/orange-blue/css/theme.css
@@ -0,0 +1,323 @@
+/* ######################
+   #  Globals
+   ######################
+*/
+body {
+	background-color: #081966;
+	color: white;
+}
+
+table {
+	background-color: #263480;
+}
+
+input {
+	border: 1px solid #081966;
+        background: #DDDDFF;
+}
+
+select {
+	border: 1px solid #081966;
+        background: #DDDDFF;
+}
+
+/* ######################
+   # Tooltip style for hints
+   ######################
+*/
+
+div.domTThint {
+	border: 1px solid #FCB840;
+	background-color: #EEEEFF;
+	color: black;
+}
+
+
+/* ##############################
+   # Tooltip style for epg infos
+   ##############################
+*/
+
+.domTTepg div.epg_content {
+	border-left: 1px solid #fffddd;
+	border-right: 1px solid #fffddd;
+	border-bottom: 1px solid #fffddd;
+        background: #263480 url(../img/bg_tools.png) top left repeat-y;
+}
+
+/* #######################
+   #  Menue
+   #######################
+*/
+
+div.menu {
+	background: #FCBC40  url(../img/menu_line_bg.png) repeat-x;
+	border-top: 1px solid #FFFDDD;
+	border-bottom: 1px solid #FFFDDD;
+	color: #122DBA;
+}
+
+div.menu a {
+	color: black;
+}
+
+a#login {
+	color: red;
+}
+
+div.menu a.active {
+	color: #122DBA;
+}
+
+div.pagemenu {
+	background: #FFFFFF url(../img/bg_line.png) top repeat-x;
+}
+
+div.pagemenu div {
+	background: #FFFFFF url(../img/bg_line_top.png) bottom repeat-x;
+}
+
+div.pagemenu div div {
+	background: #122DBA;
+	border-top: 1px solid #C0C0FF;
+	border-bottom: 1px solid #C0C0FF;
+}
+
+div.pagemenu a {
+	color: #FCBC40;
+}
+
+div.pagemenu a.active {
+	color: #FFFDDD;
+}
+
+div.pagemenu span {
+	color: #FCBC40;
+}
+
+div.pagemenu span.sep {
+	color: #FCBC40;
+}
+
+/* #######################
+   #  Info Box (near logo)
+   #######################
+*/
+
+div#infobox {
+	border: 1px solid #FCBC40;
+}
+
+div#infobox div.st_header {
+	background: #122DBA;
+	border-bottom: 1px solid #C0C0FF;
+}
+
+div#infobox div.st_content {
+	background: #081966 url(../img/bg_line_top.png) top left repeat-x;
+}
+
+div#infobox div.st_controls div.st_update {
+        border-right: 1px solid  #FCBC40;
+}
+
+/* ################################
+   # general table cell classes
+   ################################
+*/
+
+table td.bottomrow {
+	border-bottom: 1px solid #FFFDDD !important;
+}
+
+table td.leftcol {
+	border-left: 1px solid #FFFDDD;
+}
+
+table td.rightcol {
+	border-right: 1px solid #FFFDDD;
+}
+
+
+/* ################
+   #  Event
+   ################
+*/
+
+div.station div {
+	background: url(../img/bg_box_l.png) top left no-repeat;
+}
+
+div.station div div {
+	background: url(../img/bg_box_r.png) top right no-repeat;
+}
+
+div.station div div div {
+	background: url(../img/bg_box_h.png) repeat-x;
+}
+
+div.station div div div a {
+	color: #000000;
+}
+
+td div.station a {
+	color: #FCBC40;
+}
+
+div.content {
+	background: #263480 url(../img/bg_tools.png) top left repeat-y;
+	border-left: 1px solid #FFFDDD;
+	border-right: 1px solid #FFFDDD;
+	border-bottom: 1px solid #FFFDDD;
+}
+
+div.__progress {
+	border: 1px solid #C0C0FF;
+}
+
+div.__progress div.__elapsed {
+	background-color: #FCB840;
+}
+
+
+/* #############
+   # Timers
+   #############
+*/
+
+table.listing tr td {
+	/* background: url(../img/bg_line.png) bottom repeat-x; */
+        background: transparent;
+	border-bottom: 1px solid #FCBC40;
+}
+
+table.listing tr.description td {
+	background: #122DBA;
+}
+
+table.listing tr td.current {
+	color: #FCBC40;
+}
+
+table.listing tr.spacer td {
+	background-color: #081966;
+}
+
+table.listing a {
+	color: #FCBC40;
+}
+
+
+/*
+  ##############################
+  #  Blue Background Thingy
+  ##############################
+*/
+
+div.boxheader	 {
+	background: url(../img/bg_box_l.png) top left no-repeat;
+}
+
+div.boxheader div {
+	background: url(../img/bg_box_r.png) top right no-repeat;
+}
+
+div.boxheader div div {
+	background: url(../img/bg_box_h.png) repeat-x;
+	color: black;
+}
+
+/*
+  ##############################
+  #  Recordings
+  ##############################
+*/
+
+div.recordings {
+	border: 1px solid #FFFDDD;
+	background-color: #263480;
+}
+
+div.recording_item {
+	/* background: url(../img/bg_line.png) bottom repeat-x; */
+        background: transparent;
+	border-bottom: 1px solid #FCBC40;
+}
+
+
+/*
+  ##############################
+  #  Remote Control Keypad
+  ##############################
+*/
+
+div.screenshot {
+	background-image: url(../img/tv.jpg);
+}
+
+
+/*
+  ##############################
+  #  Dotted Frame
+  ##############################
+*/
+
+div.dotted {
+	border: 1px dotted #bbbbbb;
+	padding: 3px;
+	margin: 2px;
+	float: left;
+	background-color: #122dBA;
+}
+
+
+/*
+  ##############################
+  #  Edit Tables
+  ##############################
+*/
+
+table.formular tr td {
+	/* background: url(../img/bg_line.png) bottom repeat-x; */
+	background: transparent;
+	border-bottom: 1px solid #FCBC40;
+}
+
+table.dependent {
+	background-color: #263480;
+}
+
+
+/* ##############################
+   # About box
+   ##############################
+*/
+
+div.about_box a {
+	color: #FCBC40;
+}
+
+.about_box div.about_content {
+	border-left: 1px solid #FFFDDD;
+	border-right: 1px solid #FFFDDD;
+	border-bottom: 1px solid #FFFDDD;
+}
+
+.about_box div.about_content div {
+	background-color: #081966;
+	padding-bottom: 6px;
+}
+
+.about_box div.about_content div.about_head {
+	background: #081966 url(../img/bg_line.png) top repeat-x;
+}
+
+.about_box div.about_content div.about_head div {
+	background: #FFFFFF url(../img/bg_line_top.png) bottom repeat-x;
+}
+
+.about_box div.about_content div.about_head div div {
+	background: #122DBA;
+	border-top: 1px solid #FCBC40;
+	border-bottom: 1px solid #FCBC40;
+}
diff --git a/themes/orange-blue/img/bg_box_h.png b/themes/orange-blue/img/bg_box_h.png
new file mode 100644
index 0000000..5278328
--- /dev/null
+++ b/themes/orange-blue/img/bg_box_h.png
diff --git a/themes/orange-blue/img/bg_box_l.png b/themes/orange-blue/img/bg_box_l.png
new file mode 100644
index 0000000..18e61bc
--- /dev/null
+++ b/themes/orange-blue/img/bg_box_l.png
diff --git a/themes/orange-blue/img/bg_box_r.png b/themes/orange-blue/img/bg_box_r.png
new file mode 100644
index 0000000..dedf3f6
--- /dev/null
+++ b/themes/orange-blue/img/bg_box_r.png
diff --git a/themes/orange-blue/img/bg_header_h.png b/themes/orange-blue/img/bg_header_h.png
new file mode 100644
index 0000000..0683ec4
--- /dev/null
+++ b/themes/orange-blue/img/bg_header_h.png
diff --git a/themes/orange-blue/img/bg_header_l.png b/themes/orange-blue/img/bg_header_l.png
new file mode 100644
index 0000000..8f19326
--- /dev/null
+++ b/themes/orange-blue/img/bg_header_l.png
diff --git a/themes/orange-blue/img/bg_header_r.png b/themes/orange-blue/img/bg_header_r.png
new file mode 100644
index 0000000..985a2cf
--- /dev/null
+++ b/themes/orange-blue/img/bg_header_r.png
diff --git a/themes/orange-blue/img/bg_line.png b/themes/orange-blue/img/bg_line.png
new file mode 100644
index 0000000..1bfa8c4
--- /dev/null
+++ b/themes/orange-blue/img/bg_line.png
diff --git a/themes/orange-blue/img/bg_line_top.png b/themes/orange-blue/img/bg_line_top.png
new file mode 100644
index 0000000..2fcde11
--- /dev/null
+++ b/themes/orange-blue/img/bg_line_top.png
diff --git a/themes/orange-blue/img/bg_tools.png b/themes/orange-blue/img/bg_tools.png
new file mode 100644
index 0000000..871947a
--- /dev/null
+++ b/themes/orange-blue/img/bg_tools.png
diff --git a/themes/orange-blue/img/logo.png b/themes/orange-blue/img/logo.png
new file mode 100644
index 0000000..5a27635
--- /dev/null
+++ b/themes/orange-blue/img/logo.png
diff --git a/themes/orange-blue/img/menu_line_bg.png b/themes/orange-blue/img/menu_line_bg.png
new file mode 100644
index 0000000..0346cdb
--- /dev/null
+++ b/themes/orange-blue/img/menu_line_bg.png
diff --git a/themes/orange-blue/img/remotecontrol.jpg b/themes/orange-blue/img/remotecontrol.jpg
new file mode 100644
index 0000000..89447c8
--- /dev/null
+++ b/themes/orange-blue/img/remotecontrol.jpg
diff --git a/themes/orange-blue/img/tv.jpg b/themes/orange-blue/img/tv.jpg
new file mode 100644
index 0000000..5d4dab8
--- /dev/null
+++ b/themes/orange-blue/img/tv.jpg
diff --git a/themes/orange-blue/img/zap.png b/themes/orange-blue/img/zap.png
new file mode 100644
index 0000000..d5d8628
--- /dev/null
+++ b/themes/orange-blue/img/zap.png