blob: e4aff548b1cc26779828a11e3fd203cf91c0d0e5 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
|
Live themeing in a few steps:
=============================
- Copy the 'themes' directory from the sources to
$VDRCONFIG/plugins/live (default: /video/vdr/plugins/live)
- Go to setup page, select desired theme from listbox.
You can add own themes by creating in themes a subdirectory with your
theme. Read further for more detailed information about themeing.
How to do live theming with CSS.
================================
Live supports CSS theming. While the structure of the html pages is
given by the plugin, there is the possibility to change the look
through CSS and exchanged images.
Themable resources
------------------
CSS stylesheets and referenced images are themable. That means a theme
can replace the icons and background images in the markup.
Access scheme for the css stylesheets
-------------------------------------
Each live page requests at least three stylesheets in the following
order:
1. 'styles.css' (the build in stylesheet) is requested.
2. The theme master stylesheet 'theme.css' is requested.
3. A site preferences stylesheet is requested ('siteprefs.css')
Location for the stylesheets
----------------------------
The initial stylesheet 'styles.css' provides a basic layout. It is a
builtin stylesheet and can not be altered after live is compiled and
installed.
The theme stylesheed 'theme.css' is requested through following url:
themes/<themename>/css/theme.css
The site preference stylesheet is requested through this url:
css/siteprefs.css
Access scheme for themable images
---------------------------------
All themable images in the pages, that live delivers to the browser are
accessed through the url
themes/<themename>/img/<imagename>
If a image is not found under that url, the image is searched in
common/img/<imagename>
And if not found there, an attempt to deliver a built in image is taken.
Location of the resources in the file system
--------------------------------------------
All themable content must be present in the directory specified by
'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
----------------------------
A theme package consists of directory named after the theme name. It
must contain the subdirectories 'css' and 'img'. Under css and img no
other subdirectories are allowed for security reasons (see below).
In the subdirectory css a stylesheet theme.css must exist in oder to
override or extend the already defined styles from 'styles.css'.
Additional images referenced through the stylesheet and images
replacing the default images go to the 'img' subdirectory. Replacing
images must have the same name like the image to be replaced.
The live distribution comes with a few predefinded theme packages. You
should take look into them to better understand this structure.
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
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 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 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
=================
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
to submit a suggestion.
|
