brontide
04-19-2008, 10:23 PM
http://www.albinoblacksheep.com/iphone/weather/
I've been looking for a nice, simple, weather page that loads and runs well on the NIT. I found the page above and then used some css-fu to make the page layout widescreen. All of the weather data fits on one screen in both windowed and full screen mode.
Here is the userContent.css additions that I have made. If you don't know how to do this modification check the forums for other posts on the topic.
@-moz-document url-prefix("http://albinoblacksheep.com/iphone/weather"),
url-prefix("http://www.albinoblacksheep.com/iphone/weather") {
* { background-image: none ! important; }
#maincontent > .text:first-child {
float: left !important;
width:180px;
padding-right: 5px;
border-right: 2px solid #666;
margin-right: 5px;
}
#maincontent > .text > h1:first-child,
#maincontent > .text > h2, .shade
{ display: none }
#maincontent > .text > h3
{ padding: 10px ! important }
#maincontent
{ max-width: 800px ! important; clear: both }
p > span + img + span {
font-size: 14px !important;
line-height: 14px !important
}
p { line-height: 1.2em ! important }
.righty
{ width: 80px }
}
I've gotten pretty good about doing css-fu and I'm planning on trying to package up these "fixes" into a cohesive tool that can be easily installed for MicroB.
I've been looking for a nice, simple, weather page that loads and runs well on the NIT. I found the page above and then used some css-fu to make the page layout widescreen. All of the weather data fits on one screen in both windowed and full screen mode.
Here is the userContent.css additions that I have made. If you don't know how to do this modification check the forums for other posts on the topic.
@-moz-document url-prefix("http://albinoblacksheep.com/iphone/weather"),
url-prefix("http://www.albinoblacksheep.com/iphone/weather") {
* { background-image: none ! important; }
#maincontent > .text:first-child {
float: left !important;
width:180px;
padding-right: 5px;
border-right: 2px solid #666;
margin-right: 5px;
}
#maincontent > .text > h1:first-child,
#maincontent > .text > h2, .shade
{ display: none }
#maincontent > .text > h3
{ padding: 10px ! important }
#maincontent
{ max-width: 800px ! important; clear: both }
p > span + img + span {
font-size: 14px !important;
line-height: 14px !important
}
p { line-height: 1.2em ! important }
.righty
{ width: 80px }
}
I've gotten pretty good about doing css-fu and I'm planning on trying to package up these "fixes" into a cohesive tool that can be easily installed for MicroB.