| « IBM DB2 prior to 9.7 Fix Pack 2 Multiple Security Vulnerabilities | InterfaceFLOR news: 'War on waste' and EPD » |
xpages: Theme's and css media types
This weekend I was trying to embed blueprint in a xpages app.
All went fine, but I ran into 1 problem: How do you get your theme to use the following syntax?
<!--sample -->
<!-- Framework CSS -->
<link rel="stylesheet" href="../../blueprint/screen.css" type="text/css" media="screen, projection">
<link rel="stylesheet" href="../../blueprint/print.css" type="text/css" media="print">
<!--[if lt IE 8]>
<!-- Import fancy-type plugin for the sample page. -->
<link rel="stylesheet" href="../../blueprint/plugins/fancy-type/screen.css" type="text/css" media="screen, projection">
The media= part I can't fix with the theme? I tried the following:
<resource>
<content-type>text/css</content-type>
<href>screen.css</href>
<media>screen, projection</media>
</resource>
But the generated code doesn't take the media stuff into account at all.
<link rel="stylesheet" type="text/css" href="/dev/blueprint.nsf/screen.css">
<link rel="stylesheet" type="text/css" href="/dev/blueprint.nsf/fancyscreen.css">
Any suggestions on this?
6 comments
<resources>
<styleSheet media="print" type="text/css" href="/path/to/stylesheet.css"></styleSheet>
</resources>
I don't know if the syntax will change or if it even makes it to the final build (as always with beta software) but we can at least hope(the syntax is much cleaner imho).
Let's hope this makes the gold release then ;-)
@media print {
.buttonLeft {display:none}
.buttonRight {display:none}
.locallinks {display:none}
}
@media screen {
.buttonLeft {display:block}
.buttonRight {display:block}
.locallinks {display:block}
}