Theme changes from Firefox 1.5 to 2.0
- ehume
- Posts: 6743
- Joined: November 17th, 2002, 12:33 pm
- Location: Princeton, NJ, USA
All this is a lot to digest. I'm glad I looked before sending up the latest releases of my themes.
By looking at the default theme (something I rarely do) I notice that the search engine button is now attached to the left end of the searchbar. Of course, with my 20%-larger text, this looks awful; but the devs are going for a niche theme this time around, and letting people who use larger text put up with a theme that does not look major league.
I have not yet figured out what [addengines="true"] is about.
Those large negative margins for the searchbar-engine-button are interesting. I do not understand them yet.
Curiouser and curiouser.
By looking at the default theme (something I rarely do) I notice that the search engine button is now attached to the left end of the searchbar. Of course, with my 20%-larger text, this looks awful; but the devs are going for a niche theme this time around, and letting people who use larger text put up with a theme that does not look major league.
I have not yet figured out what [addengines="true"] is about.
Those large negative margins for the searchbar-engine-button are interesting. I do not understand them yet.
Curiouser and curiouser.
Firefox: Sic transit gloria mundi.
- ehume
- Posts: 6743
- Joined: November 17th, 2002, 12:33 pm
- Location: Princeton, NJ, USA
ATM, I can't see how to fix the problems without breaking compatibility with Fx 1.5, so i'm going to leave the searchengine button outside the text box, and without any border. It looks like a too-small toolbar button (my buttons start at 24x22, not 16x16), but it is better than trashing everything.
Firefox: Sic transit gloria mundi.
- ShareBird
- Posts: 2740
- Joined: December 8th, 2004, 7:09 am
- Location: Berlin | Made in Brasil
- Contact:
Maybe is too early for updating the searchbar on themes since Bug[*]#345407[Firefox]-Visual refresh for searchbar [All] is not marked as FIXED yet. I did work on this stuff a couple weeks ago and all the work is gone...
For those themers which used to have rounded searchbars with different backgrounds for focused searchbar it will be a little difficult, but the introduction from a left and a right part could make things interesting. Unfortunately to appropriate use this stuff will break compatibility.
For compatibility I guess the attribute "empty" could be a little help, since it doesn't exist on 1.5. This can maybe be used to selective skin the searchbar for 2.0 without breaking things.
The [addengines="true"] is the state for a site which contains a search engine. You can test it on http://technorati.com/
Things becomes more and more difficult to make themes for Firefox and Thunderbird... I'm very apprehensive about [*]#305746[Toolkit:Build Config]-Move default toolkit and Firefox theming from skin to content packages [All]. I would like to see a discussion here in Forum to clarify how it will impact theme designing…
For those themers which used to have rounded searchbars with different backgrounds for focused searchbar it will be a little difficult, but the introduction from a left and a right part could make things interesting. Unfortunately to appropriate use this stuff will break compatibility.
For compatibility I guess the attribute "empty" could be a little help, since it doesn't exist on 1.5. This can maybe be used to selective skin the searchbar for 2.0 without breaking things.
The [addengines="true"] is the state for a site which contains a search engine. You can test it on http://technorati.com/
Things becomes more and more difficult to make themes for Firefox and Thunderbird... I'm very apprehensive about [*]#305746[Toolkit:Build Config]-Move default toolkit and Firefox theming from skin to content packages [All]. I would like to see a discussion here in Forum to clarify how it will impact theme designing…
- mcdavis
- Posts: 3195
- Joined: December 9th, 2005, 5:51 am
ShareBird wrote:Things becomes more and more difficult to make themes for Firefox and Thunderbird... I'm very apprehensive about [*]#305746[Toolkit:Build Config]-Move default toolkit and Firefox theming from skin to content packages [All]. I would like to see a discussion here in Forum to clarify how it will impact theme designing…
Yowza. Whatever else I was going to think about this evening just went out the window.
- hhh
- Posts: 6731
- Joined: February 29th, 2004, 11:21 am
- Location: Stuart, FL
ehume wrote:Oh, this is so stupid! Now they force their notions on the rest of us! Wait until you see what their newest trick with the searchengine button does to YOUR theme!
Blech.
For me, removing the "gloss" from Search-provider-bkgnd.png helped integrate it to Orbit better. I had to resize it slightly as well to match it to the Search bar.
Of course, that does nothing to help your text-size issue, Ed.
- ehume
- Posts: 6743
- Joined: November 17th, 2002, 12:33 pm
- Location: Princeton, NJ, USA
In global/browser.css, this: becomes this:
Code: Select all
.tabbrowser-tab[selected="true"] > .tab-close-button {
-moz-margin-start: 2px;
margin-top: 0px;
opacity: 1.0;
-moz-image-region: rect(0px, 16px, 16px, 0px);
}
Code: Select all
.tabbrowser-tab[selected="true"] > .tab-close-button {
-moz-margin-start: 2px;
margin-top: 0px;
opacity: 1.0;
-moz-image-region: rect(0px, 16px, 16px, 0px);
/* Make this button focusable so clicking on it will not focus the tab while
it's getting closed */
-moz-user-focus: normal;
}
.tab-close-button:focus {
outline: none !important;
}
Firefox: Sic transit gloria mundi.
- ehume
- Posts: 6743
- Joined: November 17th, 2002, 12:33 pm
- Location: Princeton, NJ, USA
In downloads.css, this: becomes this:
Code: Select all
/* Download View */
#downloadView {
margin: 10px 10px 5px 10px;
}
Code: Select all
/* Download View */
#downloadView {
margin: 10px 10px 5px 10px;
border: 2px solid;
-moz-border-top-colors: ThreeDShadow ThreeDDarkShadow;
-moz-border-right-colors: ThreeDHighlight ThreeDLightShadow;
-moz-border-bottom-colors: ThreeDHighlight ThreeDLightShadow;
-moz-border-left-colors: ThreeDShadow ThreeDDarkShadow;
}
Firefox: Sic transit gloria mundi.
- ehume
- Posts: 6743
- Joined: November 17th, 2002, 12:33 pm
- Location: Princeton, NJ, USA
- ehume
- Posts: 6743
- Joined: November 17th, 2002, 12:33 pm
- Location: Princeton, NJ, USA
The problem I am having with the search engine button is the surrounding turf. I have it putting on colors for hover, hover:active and open. However, the need to maintain compatibility with Fx 1.5 means that my lit-up area must be two pixels shorter than the height of the searchbar in FX 2.0. If it is the same height, then it muscles the searchbar in 1.5 to be taller than the urlbar.
This problem will be solved when AMO finally implements a system where we can maintain themes separately for the different Firefox builds.
This problem will be solved when AMO finally implements a system where we can maintain themes separately for the different Firefox builds.
Firefox: Sic transit gloria mundi.
- ehume
- Posts: 6743
- Joined: November 17th, 2002, 12:33 pm
- Location: Princeton, NJ, USA
As of the 2006-08-15-1719 build, in browser/browser.css, this: becomes this:
Code: Select all
/* livemarks have the same layout as folder-item, but in the browser-only livemark-item.png */
/* only the folder icon has any effect for now, item icon is unused */
.bookmark-item[livemark="true"] {
list-style-image: url("chrome://browser/skin/livemark-item.png") !important;
}
.bookmark-item[livemark="true"][chromedir="rtl"] {
list-style-image: url("chrome://browser/skin/livemark-item-rtl.png") !important;
}
.bookmark-item[type="menu"][livemark="true"] {
-moz-image-region: rect(0px, 54px, 18px, 36px) !important;
}
.bookmark-item[type="menu"][livemark="true"][open="true"] {
-moz-image-region: rect(18px, 54px, 36px, 36px) !important;
}
Code: Select all
/* livemarks have the same layout as folder-item, but in the browser-only livemark-item.png */
/* only the folder icon has any effect for now, item icon is unused */
.bookmark-item[livemark="true"] {
list-style-image: url("chrome://browser/skin/livemark-item.png") !important;
-moz-image-region: rect(0px, 36px, 18px, 18px) !important;
}
.bookmark-item[livemark="true"][chromedir="rtl"] {
list-style-image: url("chrome://browser/skin/livemark-item-rtl.png") !important;
-moz-image-region: rect(0px, 36px, 18px, 18px) !important;
}
.bookmark-item[livemark="true"][open="true"],
.bookmark-item[livemark="true"][open="true"][chromedir="rtl"] {
-moz-image-region: rect(18px, 36px, 36px, 18px) !important;
}
.bookmark-item[type="menu"][livemark="true"],
.bookmark-item[type="menu"][livemark="true"][chromedir="rtl"] {
-moz-image-region: rect(1px, 53px, 17px, 37px) !important;
}
.bookmark-item[type="menu"][livemark="true"][open="true"],
.bookmark-item[type="menu"][livemark="true"][open="true"][chromedir="rtl"] {
-moz-image-region: rect(19px, 53px, 35px, 37px) !important;
}
Firefox: Sic transit gloria mundi.