source: extensions/p0w0/theme.css @ 12335

Last change on this file since 12335 was 10963, checked in by plg, 14 years ago

new version, compatible with Piwigo 2.2 (css sprite for icons)

File size: 6.6 KB
Line 
1
2/**
3 * Color scheme (Remember #6699cc = #69c)
4 * #000000 #336699 #4477aa #6699cc (Black -> Blues)
5 * #cc6600 #ff9933 (Oranges)
6 * #cccccc
7 * #ccddee #dfe8ff #eeeeff #ffffff (Light colors -> White)
8 * */ 
9/**
10 * Logic
11 * - Texts
12 * - Backgrounds
13 * - Borders, Margins, Padding
14 * - Visibility / Display
15 */
16
17/******************************************************************************/
18/* Texts Only */
19BODY, H1, H3, DT, H2 { color: #369; }
20H2, #menubar DT, TD H3 {
21  color: #fff;
22}
23#menubar DT, #menubar DT A {
24  color: #fff;
25  font-weight: bold;
26}
27.content .titrePage .categoryActions li { color: #cde;}
28#menubar DT A:hover {
29  color: #f92;
30  font-weight: bold;
31}
32h1 { font-weight: bold; letter-spacing: 0.2em; }
33#mbIdentification dd p,
34#menubar .selected A { color: #c60; font-weight: bold; }
35#copyright { color: #c60; }
36.content .pageNumberSelected,
37A, INPUT.rateButton, legend { color: #369; }
38A:hover { color: #f92; }
39INPUT.rateButtonSelected /* <= why IE doesn't inherit this ? */ {
40  color:#69c;
41}
42.infoTable,
43input#qsearchInput { color: #369; }
44.content .infos { color: #036; }
45.content .errors { color: #900; }
46.content .titrePage H2 A { color: #dfe8ff; }
47input.rateButtonSelected,
48.content .titrePage H2 A:hover { color: #f92; }
49.content H2 {
50  letter-spacing: 0.01em;
51  text-indent: 1em;
52  font-weight: normal;
53}
54.content ul.thumbnailCategories li div.thumbnailCategory .description h3,
55.content h3 { text-align: center; }
56.browsePath, .imageNumber,
57#imageHeaderBar H2,
58.browsePath A {
59  color: #eef;
60  font-weight: bold;
61}
62.browsePath A:hover { color: #fff; }
63.content H2:before, .browsePath:before, .imageNumber:before,
64#imageHeaderBar H2:before,
65.content H2:after, .browsePath:after, .imageNumber:after,
66#imageHeaderBar H2:after {
67 content: "   ";
68 color: #fff;
69 font-family: sans-serif;
70 font-weight: normal;
71 letter-spacing: 0em;
72}
73#thePicturePage #comments H3 {
74  color: #69c;
75}
76.content ul.thumbnailCategories li div.thumbnailCategory .description p {
77  color: #c60;
78}
79.content ul.thumbnailCategories li div.thumbnailCategory .description p + p {
80  color: #369;
81}
82.content div.thumbnailCategory .description h3 a {
83  color: #fff;
84}
85.content div.thumbnailCategory .description h3 a:hover {
86  color: #f92;
87}
88
89
90/******************************************************************************/
91/* Backgrounds Only */
92BODY { background: #cde; }
93.header_notes,
94#thePicturePage #the_page,
95#thePicturePage #theImage,
96.content { background-color: #dfe8ff; }
97#the_page { background-color: #dfe8ff; }
98#menubar, H3, #imageHeaderBar { background-color: #eef; }
99H2, #menubar DT, TD H3,
100#imageToolBar,
101#imageHeaderBar, #imageHeaderBar H2,
102.content H2 { background-color: #369; }
103.content .infos { background-color: #47a; ;}
104.content .errors { background-color: #fc5; ;}
105#thePicturePage #comments H3 { background-color: #eef; ;}
106.content ul.thumbnailCategories li div.thumbnailCategory .description h3 {
107  background-color: #69c; 
108}
109.content ul.thumbnailCategories li div.thumbnailCategory,
110.content UL.thumbnails SPAN.wrap2 { background-color: #eef; }
111.content ul.thumbnailCategories li div.thumbnailCategory:hover,
112#theImage IMG, .navThumb IMG,
113.content UL.thumbnails SPAN.wrap2:hover { background-color: #fff; }
114.content UL.thumbnails SPAN.wrap2:active img {
115  outline: 3px ridge #f92;
116}
117input#qsearchInput { background-color: #cde; }
118/******************************************************************************/
119/* Borders, Margins, Padding Only */
120BODY { margin: 0px;  padding: 0px; }
121#menubar {
122  margin : 0px 0px 0px 8px;
123  border: 0px;
124  text-decoration: none;
125  border: 1px solid #369;
126}
127A { border: 0px; text-decoration: none; }
128A:hover { text-decoration: none; border: 0px; }
129.content {
130  border: 1px solid #369;
131  padding: 0px;
132}
133#menubar DT, .content H2 {
134  background-image: url(images/button-bg.png);
135  border: 0px;
136  margin-bottom: 3px;
137}
138.content ul.thumbnailCategories li div.thumbnailCategory .description h3 {
139  background-image: url(images/button-bg.png);
140  border-width: 1px;
141  border-style: outset;
142  border-color: #369;
143}
144.content ul.thumbnailCategories li div.thumbnailCategory .description h3:active
145{
146        background: #69c;
147        border: 1px inset #369;
148}
149.content .errors { border-color: #f92; }
150#imageHeaderBar H2 { border: 0px; }
151#thePicturePage #imageToolBar { padding: 0px 25px 5px 25px; }
152#thePicturePage #theImage {
153  margin: 0px;
154  padding: 3px 0px 15px 0px;
155}
156#thePicturePage #comments H3 {
157  border-top: 2px solid #69c;
158  border-bottom: 1px solid #369;
159}
160H2, #imageToolBar {
161  border-bottom: 1px solid #fff;
162}
163.navThumb IMG { border: 1px solid #c60; padding: 1px; opacity: 0.8; }
164.navThumb:hover IMG { border: 1px solid #f92; padding: 1px; opacity: 1; }
165#theImage IMG {
166  border: 3px solid #369;
167  margin: 2px auto;
168  padding: 1px;
169  box-shadow: 0.2em 0.2em #ccc;
170}
171.content UL.thumbnail IMG {
172  border: 1px solid #666;
173}
174.illustration A {
175  border: 0px;
176}
177FIELDSET, INPUT, SELECT, TEXTAREA,
178.content DIV.thumbnailCategory {
179  border: 1px solid #69c;
180  background-color: #dfe8ff;
181  margin: 3px;
182}
183.content DIV.thumbnailCategory:hover {
184  border: 1px solid #f92;
185}
186.content UL.thumbnails SPAN.wrap2 {
187  border: 1px solid #69c;       /* thumbnails border color and style */
188  border-radius: 4px 4px;       /* round corners with CSS3 compliant browsers */
189}
190.content UL.thumbnails SPAN.wrap2:hover {
191  border-color: #f92;           /* thumbnails border color when mouse cursor is over it */
192}
193A.navThumb, A.navThumb:hover,
194#imageToolBar A, #imageToolBar A:hover {
195  border-bottom: none;
196}
197#the_page {
198  border: 0px;
199  padding: 5px 0px 30px 0px;
200  margin: 0px;
201}
202
203/******************************************************************************/
204/* Display, Visibility, buttons and others */
205label { cursor:pointer }
206.zero { display: none }
207
208input[type="text"], input[type="password"], input.button,
209input.submit, input.reset, input.file,
210select, textarea {
211  color: #369;
212  border: 1px solid #369;
213  background-color: #eeeeff;
214}
215input.submit[type="reset"]:focus,
216input.submit:focus {
217  background-color: #369;
218}
219input.submit[type="reset"],
220input.submit {
221  background-image: url(images/button-bg.png);
222  height:22px;
223  font-weight: bold;
224        color: #fff;
225  border-width: 1px;
226  border-style: outset;
227  border-color: #369;
228  padding-left: 2em;
229  padding-right: 2em;
230}
231input.submit[type="reset"]:active,
232input.submit:active {
233        background: #69c;
234  height:22px;
235        border: 1px inset #369;
236}
237#addComment fieldset input.submit[type="submit"]  {
238  height: 38px;
239  padding-left: 4em;
240  padding-right: 4em;
241}
242#menubar .menuInfoCat, #menubar .menuInfoCatByChild {
243  font-size: 80%;
244  font-style: normal;
245}
246* { outline: none; }
247
248.pwg-icon {
249  background-image: url(../default/s26/outline_ffffff.png);
250}
251
252A:hover .pwg-icon {
253  background-image: url(../default/s26/outline_ffffff.png);
254}
255
Note: See TracBrowser for help on using the repository browser.