Customize Speed Dials with CSS
Monday, April 18, 2011 7:55:49 AM
I will show you how to make other sites shine in Speed Dial.
It's all about adding custom CSS to a site. Normally no problem. You can add custom style sheets with opera easily. Sadly it doesn't work for speed dials.But there is a simple workaround: Download the Easy User CSS extension.
Now you can add custom CSS to the site you want to feature for speed dial.
Let's try this for Wunderlist. Normally it looks like the picture on the left.
But let's add a bit CSS magic now
Access the site and click on the Easy User CSS button.
I added the following stylesheet for Wunderlist:
In plain text:@media screen and (view-mode: minimized) {
#content, #bottombar, .searchside {
display: none;
}
#lists {
top: 0px;
left: 0px;
width: 100%;
height: 100%;
background-color: #FFFFFF;
}
}
The magic is @media screen and (view-mode: minimized) {...}. It will change the appearance in speed dial but not on the real site.So you can play with the different elements on your speed dial sites and make them more useful in preview mode.
It also works with the "reload every" setting.
I'm looking forward to see your enhanced speed dial sites in the comments







