This is not strictly a Stylish Style at all.

But it is in css and there is nowhwere else to put it right now.

_______________________________________________________________________________________

This was telega's sample css that he put together for Fast Dial 2.5-6.
It is a useful template for creating a css for Fast Dial

(It was very easy in 2.15-6 to load and save css versions to Themes)

I will put 2 Versions here

The original telega Version

The expanded Stylish Version of the same code that a user can modify to suit.

Original telega Version

body { background-image: none; background-repeat: repeat;
background-position: top left; font-family: 'Tahoma'; font-size: 11;
background-color: #000000; } .back { background-image:
url(chrome://fastdial/skin/back.png); } #grid { border-spacing: 10; }
.thumbnail { background-color: transparent; border: 1px solid #d3d3d3;
opacity: 1; } .title { color: #000000; background-color: #eeeeee;
border-top: 1px solid #d3d3d3; } div.thumbnail:hover, .hover {
background-color: transparent; border: 1px solid #d3d3d3; opacity: 1; }
div.thumbnail:hover .title, .hover .title { color: #000000;
background-color: #e8e8e8; border-top: 1px solid #d3d3d3;


3. Stylish Version (modified)

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document url("chrome://fastdial/content/fastdial.html") {

}

body
{
/*background-image: none !important;*/
/*background-repeat: repeat !important;*/
background-position: center !important;
font-family: 'Tahoma' !important;
font-size: 11px !important;
background-color: black !important;
}

.back
{
background-image: url(chrome://fastdial/skin/back.png) !important;
}

#grid
{
border-spacing: 10px !important;
}

div.thumbnail
{
background-color: transparent !important;
border: 1px solid transparent !important;
opacity: 0.9 !important;
}

div.thumbnail:hover
{
background-color: transparent !important;
border: 1px solid transparent !important;
opacity: 1.0 !important;
}

div.title
{
color: transparent !important;
background-color: transparent !important;
border-top: 1px solid transparent !important;
}

div.title:hover
{
color: white !important;
background-color: transparent !important;
border-top: 1px solid transparent !important;
}

Came across these few lines of code that remove the very annoying
Search Bookmarks and History in the URL Field.

These words appear when you are in the Root Folder in Fast Dial

Here is the link to the Userstyles Page
http://userstyles.org/styles/19165

Pop these few lines into Stylsh

And things will be back to normal.

Perfect for Fast Dial users !

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

#urlbar[empty="true"] {

color: transparent !important;

}

This is just a temporary fix due to shortcomings in Preferences in Version 2.15 beta 11

Please copy paste into Stylish.

To simply remove Favicons please use this

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document url("chrome://fastdial/content/fastdial.html") {

}

.title img
{
-moz-opacity: 0.0 !important;
}

or


@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document url("chrome://fastdial/content/fastdial.html") {

}

.title img
{
display:none !important;
}


---

Help (top right) only appears on hover
Favicons the same (does not work as favicons so small)
Fast Dial logo removed

In 2.15 beta 11 favicons appear on hover.
So this works well with Title also appearing on Hover

---

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document url("chrome://fastdial/content/fastdial.html") {

}

/* help button top right */

a#help
{
-moz-opacity: 0.0 !important;
}

a#help:hover
{
-moz-opacity: 1.0 !important;
}

/* favicons */
.title img
{
-moz-opacity: 0.0 !important;
}

.title img:hover
{
-moz-opacity: 1.0 !important;
}

/* fast dial logo */
img#enable
{
-moz-opacity: 0.0 !important;
}

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document url("chrome://fastdial/content/fastdial.html") {

}

/* help button top right */

a#help
{
-moz-opacity: 0.0 !important;
}

a#help:hover
{
-moz-opacity: 1.0 !important;
}


Please load into Stylish

This code will stop the word Help from appearing in your Fast Dial Screen.

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document url("chrome://fastdial/content/fastdial.html") {

}

/* help button top right */

a#help
{
display:none !important;
}

Playing around with this at the moment.

Works after a fashion.

Please change size to suit

Best maybe to keep original ratio size of cell.

So check computed values in Fast Dial/Preferences/General/General/Size

before changing values in code

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document url("chrome://fastdial/content/fastdial.html") {

}

div.thumbnail:hover
{
width: 480px !important;
height: 360px !important;
}


This description will be expanded but is at present quite usable.

--------------------------------------------------------------------------------------

It is quite possible to alter the Opacity of all the Cells in Fast Dial 1.x

To do this one makes use of a very useful Firefox Extension called Stylish.

There is a short introduction to Stylish here

To simply download Stylish from the Mozilla Add-Ons page go here.

The best site for finding Styles to use in Stylish is called Userstyles

At the moment there are a couple of Styles on the Userstyles Site that will enable you to alter the Opacity of your Fast Dial Cells

Style 1 enables one to change the Opacity of All Cells in Fast Dial 1.x.
Also it allows one to alter the Opacity of Dialling Cells Seperately from Group Cells.

Style 2 is eactly the same as Style 1 but it has the added possibility of altering the opacity of your cell when you hover over it with the Mouse.

.

This fix was invented entirely by PedroMRP here .

It was placed in a Style format for ease of loading.

---

Text colour of course can be changed to suit in this line

color: white;

font size in this line

font-size: 1.2em;

---

this is the effect

Before (your wndow may also be white) Default v2.14 Toolbar

after

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document url("chrome://fastdial/content/fastdial.html") {

}

#search {
margin-top: 5px;
margin-bottom: -5px;
}

#search input {
font-size: 1.2em;
color: white;
border: 1px solid lightgray;
background: transparent;
}


This is an adaption of a Lain_13 idea see here to be used in Fast Dial 1.x

The whole matter is discussed in detail in Mafi0z Tutorial Rounder Fast Dial Cells

This can also be downloaded directly into Stylish from Userstyles here

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document url("about:blank") {

}

div.cell

{

-moz-border-radius: 25px !important;

}


There is it seems a new Version of Stylish

---

References to new Stylish Logo here

---

Mozilla Addons/ AMO Ver 1.0.1 (May 4 ) Download link

---

There a number of not so positive reports on AMO to this Version

Old version better
by Kellchmia on May 5, 2009
I don’t want Jason to feel bad but I really like the old version.
Other users have mentioned the reasons.

---

Some Feedback to Version 1.0 (Jason Barnabe) Link

---

Further more detailed comments on Version 1.0 here

---

Please see more detailed comments on Version 1.0a here

---

Please see more detailed comments on Version 1.0.1beta here

---

How to get old icons back, revert to previous version and other useful tips by Jason Barnabe (plus a thread devoted to the whole question) here

---

Stylish Nostalgia Icons here (uses old icons in new Version)

But effects icons both in status bar and addons panel.
But probably can be edited to suit, but have not tried as yet.

---

There are a number of facilities that are being permanently removed.

No important! button anymore.
No colorpicker either.

My sympathies are with Drugoy...

---

Two useful styles to go with Version 1.0.1

Stylish - Manage Window beautified

Stylish - Edit Window beautified

---

So modified by Stylish now becomes:

---

The problem of turning off the display of the Search Bar in Fast Dial v2.23b has been resolved in Version 2.23b1

Please see also see discussion here
______________________________________________________________________________________

It is easy to hide the search bar in Version 2.22b

But there is a setting change in Version 2.23earlybeta (not yet released) that is not so effective.

I am told that I should set in Preferences/General the Search value to zero
I have done that
But it has no effect at all.

Either I will discover how to remove it, or maybe Fast Dial will be changed.

However in the meanwhile for anyone that has a similar problem, one can make the search bar transparent and remove the search engine faviocon with this Style.

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document url("chrome://fastdial/content/fastdial.html") {

}

img#search-icon
{
display:none !important
}

This Style is for Fast Dial 1.x

Thanks to telega a very well designed and easily set up Opacity setting is in place in Fast Dial 2

This Style can be loaded directly into Stylish from here.

________________________________________________________________________________________

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document url("about:blank") {
}

/*-----for dialling cells-----*/

.image
{
opacity: 0.5;
}

.image:hover
{
opacity: 0.0;
}

/*-----for cells with group-----*/

.parent
{
opacity: 0.5;
}

.parent:hover
{
opacity: 0.0;
}


Please enter the colours or images of your choice to make your own display.

Hover and opacity settings are offered should you want to use them

This is the gradient Version seen against a dark background

This Version at the moment set to grey with change of opacity on hover
Please enter the colours you would like to use and change settings to suit.

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("userlogos.org") {

}

div.foreground
{
background:grey !important;
-moz-opacity: 0.75 !important;
}

/* colour on hover */

div.foreground:hover
{
background:grey !important;
-moz-opacity: 1.0 !important;
}

This is a variation using Mafi0z Gradient that he made for the Search Bar
See picture above

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("userlogos.org") {

}

div.foreground
{
background:url("/files/layout/FastDial/gradient4search20px.png") center center repeat-x !important;
-moz-opacity: 0.75 !important;
}

div.foreground:hover
{
-moz-opacity: 1.0 !important;
}


This Style is just sitting here to be adapted by different users for their own needs

If you change the values you can use Fast Dial to calculate the height for you

Put this together really for anyone who wanted to make cells smaller than the Fast Dial minimum size

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document url("chrome://fastdial/content/fastdial.html") {

.box
{
width:400px !important;
height:300px !important;
}

}