[release] Firefox Pinstripe Theme

Originally posted by wookietv@Feb 14 2004, 11:29 PM

i think in that flurry of posts there, mine got overlooked...  i'm just bumping it even though it hasn't been that long...  i just don't want it to be forgotten

is there a way to make the address bar rounded out like the google search bar? also, give the address bar the same shadowing along the top of it as the search bar.

thanks much

terribly sorry about that man...

Yes it can be rounded. I'll give you the code to do so. Just give me about 15 minutes.

[EDIT] This is giving more problems then intended, I need more time now. [/EDIT]

#114501

thanks mate... no rush. i realize it's not going to be a mac port anymore by doing that, but in my opinion, it would look more flowing.

thanks again (Y)

by the way, i'm also very interested in your milk theme you're making for firefox, looks very nice (i just went to a milk style for my whole pc, will look good all over) now i can't decide which i like better!

#114514

I figured it out, ill post a screenshot in a few.

Here's the screenshot

[EDIT] Added the screenshot [/EDIT]

#114527

that's sweet, thanks for the quick response... just let us know when it's all ready... if it's more of just downloading a graphic and applying it manually, can you include the instructions, otherwise i'm clueless with those type of things?

thanks much!

#114542

SO YOU WANT ROUND BARS

1. First download these images:

and place into the browser folder using winrar.

2. Apply this code to the browser/browser.css in between /* ::::: nav-bar-inner :::::*/ and /* ::::: page proxy icon ::::: */. Make sure you delete everything inbetween first.

/* ::::: nav-bar-inner ::::: */

#urlbar {
  -moz-appearance: none;
  border: none;
  background-color: transparent;
}

#urlbar > .autocomplete-textbox-container {
  background-image: url('chrome://browser/skin/leftcap.png');
  background-position: left center;
  background-repeat: no-repeat;
  background-color: transparent;  
  padding-left: 3px;
  padding-top: 8px;
  padding-bottom: 9px;
  margin-bottom:0px;
}

#urlbar > .autocomplete-history-dropmarker {
  border: medium none;
  background-image: url('chrome://browser/skin/rightcap.png');
  list-sytle-image:url('chrome://browser/skin/autocomplete-dropmarker.png');
  background-color: Transparent;
  background-repeat: no-repeat;
  margin-top: 6px;
  padding-bottom: 6px;
}

#urlbar > .autocomplete-history-dropmarker:hover,
#urlbar > .autocomplete-history-dropmarker:hover:active {
  -moz-image-region: rect(px 16px 16px 0px);
}


#search-bar {
  -moz-appearance: none;
  border: none;
  background-color: transparent;
  min-height: 22px;
  margin: -1px 0px -4px 0px;
}

#search-bar > .autocomplete-textbox-container {
  border: medium none;
  background-image: url('chrome://browser/skin/x.png');
  background-position: left center;
  background-repeat: repeat-x;
  background-color: transparent;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 2px;
  padding-top: 1px;
  min-height: 22px;
  margin-bottom:2px;
}

.textbox-input-box {
  border-top: 2px solid;
  -moz-border-top-colors: #878787 #B5B5B5;
  border-bottom: 2px solid;
  -moz-border-bottom-colors: #E1E1E1 #F3F3F3;
  background-color: #FFFFFF;
  margin: -1px 0px -1px -1px;
  padding: 0px 0px 1px 2px;
}

#search-bar {
  width: 128px;
}

/* ::::: search-bar ::::: */

#search-proxy-button {
	min-width: 22px;
	margin: 0px 3px 0px 5px;  
}

.search-proxy-button-image {
 padding: 0px;
 list-style-image: url("chrome://browser/skin/Search-bar.png");
}

.search-proxy-button-dropmarker {
	list-style-image: url("chrome://global/skin/arrow/arrow-dn.png");
	padding: 6px 0px 5px 17px;

}

#miSearchModeFind, #__PhoenixFindInPage {
	list-style-image: url("chrome://browser/skin/Search-bar.png");
}

#miSearchModeFind[checked="true"] {
  list-style-image: url("chrome://global/skin/menu/menu-check.png");
}

3. Any problems, let me know

#114551

brilliant, worked perfect. thanks much for that.

i think on my pm to you, i got confused with the actual file i had to go in... i went in browser.jar to change browser.css when it's classic.jar that should be.

just to help in case anyone else needs it...here's the actual path of the file to change:

classic.jar\skin\classic\browser, edit the browser.css here. add the 3 images into this folder as well.

edit---actually, on closer look, something happened... the address bar came out fine, but look at my screenshot, the search bar's right side came out squared off. did i screw something up?

#114559

could you possibly post your browser.css file for me to see.

#114564

this forum doesn't allow that type of file to be posted... i can email it if that's ok... just pm me the email address to send it to.

#114566

Originally posted by wookietv@Feb 15 2004, 08:00 AM

this forum doesn't allow that type of file to be posted...  i can email it if that's ok...  just pm me the email address to send it to.

Zip it

#114616

Originally posted by wookietv@Feb 15 2004, 02:37 AM

brilliant, worked perfect.  thanks much for that.

i think on my pm to you, i got confused with the actual file i had to go in...  i went in browser.jar to change browser.css when it's classic.jar that should be.

just to help in case anyone else needs it...here's the actual path of the file to change:

classic.jar\skin\classic\browser, edit the browser.css here.  add the 3 images into this folder as well.

edit---actually, on closer look, something happened...  the address bar came out fine, but look at my screenshot, the search bar's right side came out squared off.  did i screw something up?

I tried this and got the exact same result, shown in my ss. Not only does the search bar right end get cut off, but the address bar's right end is somewhat squared off also, like it's being overlapped with whatever is next to it - I have the "go" button there but wookietv didn't and his ss shows it the same way. When you find a solution XJOSHATTACKX please let us know.

#114653

it worked for me, I used the old png, the one in the skin..

#114745

Sorry, this is kinda off-topic.

I believe the tutorial will be updated when where are any breakthrough on the thread. I step by step followed the tutorial and everything went perfect. (Except for the rounded address bar which is in discussion at the moment).

Aw come on, no more "where can I download that ****" questions, those extensions I beleive can be found in the official mozilla site, do some search job will ya? That's where I found my localized FireFox. And perhaps you can get more surprises (such as other extensions) on the site during your search.

I even saw some guy asking where to download netscape 7 in other thread, for christ's sake, have you tried www.netscape.com or www.google.com yet?

There are many try-and-errors in this thread, which I think is very helpful. I go through the tutorial thread (many thanks to magbi9 and folks) first and then I got to this thread. There are experiences in here, just read through the hole thread. Ask for help after that, I believe experts here will be glad to help! (you guys rules :rock: )

peace.

-cherrysoul

#114758

Originally posted by Max Power@Feb 15 2004, 07:45 AM

I tried this and got the exact same result, shown in my ss. Not only does the search bar right end get cut off, but the address bar's right end is somewhat squared off also, like it's being overlapped with whatever is next to it - I have the "go" button there but wookietv didn't and his ss shows it the same way. When you find a solution XJOSHATTACKX please let us know. 

I know how to fix it. Just replace your browser.css with this one. This is the whole thing so just select all of yours and delete and paste this in.

*WARNING*

If you have made your own customizations to the file make sure you keep them because this is the default browser.css.

/* ***** BEGIN LICENSE BLOCK *****
 * Version: NPL 1.1/GPL 2.0/LGPL 2.1
 *
 * The contents of this file are subject to the Netscape Public License
 * Version 1.1 (the "License"); you may not use this file except in
 * compliance with the License. You may obtain a copy of the License at
 * http://www.mozilla.org/NPL/
 *
 * Software distributed under the License is distributed on an "AS IS" basis,
 * WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
 * for the specific language governing rights and limitations under the
 * License.
 *
 * The Original Code is mozilla.org code.
 *
 * The Initial Developer of the Original Code is
 * Netscape Communications Corporation.
 * Portions created by the Initial Developer are Copyright (C) 1998-1999
 * the Initial Developer. All Rights Reserved.
 *
 * Contributor(s):
 *   Joe Hewitt (hewitt@netscape.com)
 *   Jason Kersey (kerz@netscape.com)
 *   Pierre Chanial (chanial@noos.fr)
 *   Dean Tessman (dean_tessman@hotmail.com)
 *
 * Alternatively, the contents of this file may be used under the terms of
 * either the GNU General Public License Version 2 or later (the "GPL"), or
 * the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
 * in which case the provisions of the GPL or the LGPL are applicable instead
 * of those above. If you wish to allow use of your version of this file only
 * under the terms of either the GPL or the LGPL, and not to allow others to
 * use your version of this file under the terms of the NPL, indicate your
 * decision by deleting the provisions above and replace them with the notice
 * and other provisions required by the GPL or the LGPL. If you do not delete
 * the provisions above, a recipient may use your version of this file under
 * the terms of any one of the NPL, the GPL or the LGPL.
 *
 * ***** END LICENSE BLOCK ***** */

@import url("chrome://global/skin/");

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

#PersonalToolbar {
  min-height: 26px;
}

/* ::::: bookmark buttons ::::: */

toolbarbutton.bookmark-item[type=menu] {
  padding-left: 7px;
}

toolbarbutton.bookmark-item[type=menu] > .toolbarbutton-menu-dropmarker {
  padding-right: 7px;
}

toolbarbutton.bookmark-item:not([type=menu]) {
  -moz-binding: url("chrome://browser/skin/browser.xml#bm-toolbarbutton");
}

toolbarbutton.bookmark-item {
  margin: 1px;
  padding: 1px 0px 1px 0px;
  min-width: 0;
  max-width: 13em;
  font-weight: bold;
  color: #565656;
  border: none !important;
}

.bookmark-item > .toolbarbutton-icon {
  margin: 0px;
  display: none;

}

toolbarbutton.bookmark-item .toolbarbutton-text {
  font-size: 100% !important; 
  margin: 0px !important;
}


.bookmark-image-left, .bookmark-image-right {
  width: 7px !important;
  height: 16px;
}

.bookmark-item:hover > .bookmark-image-left {
  background: url("chrome://browser/skin/bookmark-hover-left.png") no-repeat center left;
}

.bookmark-item:hover > .bookmark-image-right {
  background: url("chrome://browser/skin/bookmark-hover-right.png") no-repeat center right;
}

.bookmark-item:hover > .toolbarbutton-text {
  background: url("chrome://browser/skin/bookmark-hover-mid.png") repeat-x;
}

.bookmark-item:hover > .toolbarbutton-menu-dropmarker {
  background: url("chrome://browser/skin/bookmark-hover-dropmarker.png") no-repeat;
  list-style-image: url("chrome://browser/skin/bookmarks/folderarrow-hover.png");
}

toolbarbutton.bookmark-item[type=menu]:hover {
  background: url("chrome://browser/skin/bookmark-hover-left.png") no-repeat center left;
}

/* Prevent [mode="icons"] from hiding the label */
.bookmark-item > .toolbarbutton-text {
  display: -moz-box !important;
  height: 16px !important;
  padding-top: 1px;
}

.bookmark-item > .toolbarbutton-menu-dropmarker {
list-style-image: url("chrome://browser/skin/bookmarks/folderarrow.png");
 height: 16px !important;
padding-top: 5px;
padding-left: 3px;
padding-bottom: 4px;
}

.toolbarpaletteitem-box[type="bookmarks-toolbar"][place="palette"] {
  background: url("chrome://browser/skin/bookmarks/Toolbar-bookmarks.png") no-repeat;
}

.bookmarks-toolbar-customize {
  display: none;
  max-width: 15em !important;
}

toolbarpaletteitem[place="toolbar"] .bookmarks-toolbar-customize {
  display: -moz-box;
}

toolbarpaletteitem[place="toolbar"] .bookmarks-toolbar-overflow-items {
  visibility: hidden;
}

toolbarpaletteitem[place="toolbar"] .bookmarks-toolbar-items {
  visibility: hidden;
}

/* ::::: bookmark menus ::::: */

.bookmark-item > .menu-iconic-left > .menu-iconic-icon {
  width: 16px;
  height: 16px;
}

/* ..... drag and drop styles ..... */

.bookmark-item[dragover-left="true"] {
  -moz-border-left-colors: #000000;
}
.bookmark-item[dragover-right="true"] {
  -moz-border-right-colors: #000000;
}
.bookmark-item[dragover-top="true"] {
  -moz-border-top-colors: #000000;
}
.bookmark-item[dragover-bottom="true"] {
  -moz-border-bottom-colors: #000000;
}

/* ::::: primary toolbar buttons ::::: */

.toolbarbutton-1 {
  min-width: 0px;
  list-style-image: url("chrome://browser/skin/Toolbar.png");
  -moz-box-orient: vertical;
}

.toolbarbutton-text {
        margin: 0px;
	padding: 0px;
}

.toolbarbutton-menubutton-stack {
  margin: 0px !important;
  padding: 0px;
  -moz-box-orient: horizontal;
}


.toolbarbutton-menubutton-button {
  margin: 0px !important;
  padding: 0px !important;
}

.toolbarbutton-menubutton-stack > .toolbarbutton-menubutton-button {
  -moz-box-orient: vertical;
}
toolbarbutton:not([disabled="true"]):hover,
menubutton:not([disabled="true"]):hover,
toolbarbutton:not([disabled="true"]):hover:active,
menubutton:not([disabled="true"]):hover:active {
  color: ButtonText !important;
}

.toolbarbutton-menubutton-stack,
.toolbarbutton-menubutton-button,
.toolbarbutton-menubutton-stack:hover,
.toolbarbutton-menubutton-button:hover,
.toolbarbutton-menubutton-stack:hover:active,
.toolbarbutton-menubutton-button:hover:active {
  margin: 0px !important;
  display: -moz-box;
}

toolbar[mode="icons"] .toolbarbutton-text {
  display: none;
}

toolbar[mode="text"] .toolbarbutton-menubutton-dropmarker,
toolbar[mode="text"] .toolbarbutton-icon {
  display: none;
}

toolbar[mode="text"] .toolbarbutton-text {
  padding: 0px !important;
  margin: 3px 5px !important;
}

#back-button, #forward-button  {
  -moz-binding: url("chrome://browser/skin/browser.xml#toolbar-menu-button");
}

#back-button {
  -moz-image-region: rect(0px 32px 32px 0px);
}
#back-button[buttondown="true"] {
  -moz-image-region: rect(32px 32px 64px 0px);
}
#back-button[disabled="true"] {
 -moz-image-region: rect(64px 32px 96px 0px);
}

#forward-button {
  -moz-image-region: rect(0px 64px 32px 32px);
}
#forward-button[buttondown="true"] {
  -moz-image-region: rect(32px 64px 64px 32px);
}
#forward-button[disabled="true"] {
  -moz-image-region: rect(64px 64px 96px 32px) !important;
}

#reload-button {
  -moz-image-region: rect(0px 128px 32px 96px);
}
#reload-button:active {
  -moz-image-region: rect(32px 128px 64px 96px);
}
#reload-button[disabled="true"] {
  -moz-image-region: rect(64px 128px 96px 96px) !important;
}


#stop-button {
  -moz-image-region: rect(0px 96px 32px 64px);
}
#stop-button:active {
  -moz-image-region: rect(32px 96px 64px 64px);
}
#stop-button[disabled="true"] {
  -moz-image-region: rect(64px 96px 96px 64px) !important;
}

#home-button {
  -moz-image-region: rect(0px 160px 32px 128px);
}
#home-button:active {
  -moz-image-region: rect(32px 160px 64px 128px);
}
#home-button[disabled="true"] {
  -moz-image-region: rect(64px 160px 96px 128px) !important;
}

#print-button {
  -moz-image-region: rect(0px 288px 32px 256px);
}
#print-button:active {
  -moz-image-region: rect(32px 288px 64px 256px);
}
#print-button[disabled="true"] {
  -moz-image-region: rect(64px 288px 96px 256px);
}

#new-tab-button {
  -moz-image-region: rect(0px 320px 32px 288px);
}
#new-tab-button:active,
#new-tab-button[checked="true"] {
  -moz-image-region: rect(32px 320px 64px 288px);
}
#new-tab-button[disabled="true"] {
  -moz-image-region: rect(64px 320px 96px 288px);
}

#new-window-button {
  -moz-image-region: rect(0px 352px 32px 320px);
}
#new-window-button:active,
#new-window-button[checked="true"] {
  -moz-image-region: rect(32px 352px 64px 320px);
}
#new-window-button[disabled="true"] {
  -moz-image-region: rect(64px 352px 96px 320px);
}

#downloads-button {
  -moz-image-region: rect(0px 192px 32px 160px);
}
#downloads-button:active {
  -moz-image-region: rect(32px 192px 64px 160px);
}
#downloads-button[disabled="true"] {
  -moz-image-region: rect(64px 192px 96px 160px);
}

#bookmarks-button {
  -moz-image-region: rect(0px 256px 32px 224px);
}
#bookmarks-button:active {
  -moz-image-region: rect(32px 256px 64px 224px);
}
#bookmarks-button[disabled="true"] {
  -moz-image-region: rect(64px 256px 96px 224px);
}

#history-button {
  -moz-image-region: rect(0px 224px 32px 192px);
}
#history-button:active {
  -moz-image-region: rect(32px 224px 64px 192px);
}
#history-button[disabled="true"] {
  -moz-image-region: rect(64px 224px 96px 192px);
}

#cut-button {
  -moz-image-region: rect(0px 384px 32px 352px);
}
#cut-button:active,
#cut-button[checked="true"] {
  -moz-image-region: rect(32px 384px 64px 352px);
}
#cut-button[disabled="true"] {
  -moz-image-region: rect(64px 384px 96px 352px);
}

#copy-button {
  -moz-image-region: rect(0px 416px 32px 384px);
}
#copy-button:active,
#copy-button[checked="true"] {
  -moz-image-region: rect(32px 416px 64px 384px);
}
#copy-button[disabled="true"] {
  -moz-image-region: rect(64px 416px 96px 384px);
}

#paste-button {
  -moz-image-region: rect(0px 448px 32px 416px);
}
#paste-button:active,
#copy-button[checked="true"] {
  -moz-image-region: rect(32px 448px 64px 416px);
}
#paste-button[disabled="true"] {
  -moz-image-region: rect(64px 448px 96px 416px);
}

/* ::::: small primary toolbar buttons ::::: */


toolbar[iconsize="small"] .toolbarbutton-1 {
  list-style-image: url("chrome://browser/skin/Toolbar-small.png");
  padding: 1px 3px 1px 3px !important;
}

toolbar[iconsize="small"] #back-button {
  -moz-image-region: rect(0px 26px 24px 0px);
}

toolbar[iconsize="small"] #back-button[buttondown="true"] {
  -moz-image-region: rect(24px 26px 48px 0px);
}
toolbar[iconsize="small"] #back-button[disabled="true"] {
  -moz-image-region: rect(48px 26px 72px 0px);
}

toolbar[iconsize="small"] #forward-button {
  -moz-image-region: rect(0px 52px 24px 26px);
  padding-right: 2px;
}
toolbar[iconsize="small"] #forward-button[buttondown="true"] {
  -moz-image-region: rect(24px 52px 48px 26px);
}
toolbar[iconsize="small"] #forward-button[disabled="true"] {
  -moz-image-region: rect(48px 52px 72px 26px) !important;
}

toolbar[iconsize="small"] #stop-button {
  -moz-image-region: rect(0px 78px 24px 52px);
}
toolbar[iconsize="small"] #stop-button:active {
  -moz-image-region: rect(24px 78px 48px 52px);
}
toolbar[iconsize="small"] #stop-button[disabled="true"] {
  -moz-image-region: rect(48px 78px 72px 52px) !important;
}

toolbar[iconsize="small"] #reload-button {
  -moz-image-region: rect(0px 104px 24px 78px);
}
toolbar[iconsize="small"] #reload-button:active {
  -moz-image-region: rect(24px 104px 48px 78px);
}
toolbar[iconsize="small"] #reload-button[disabled="true"] {
  -moz-image-region: rect(48px 104px 72px 78px) !important;
}

toolbar[iconsize="small"] #home-button {
  -moz-image-region: rect(0px 130px 24px 104px);
}
toolbar[iconsize="small"] #home-button:active {
  -moz-image-region: rect(24px 130px 48px 104px);
}

toolbar[iconsize="small"] #downloads-button {
  -moz-image-region: rect(0px 154px 24px 130px);
}
toolbar[iconsize="small"] #downloads-button:active {
  -moz-image-region: rect(24px 154px 48px 130px);
}
toolbar[iconsize="small"] #downloads-button[disabled="true"] {
  -moz-image-region: rect(48px 154px 72px 130px) !important;
}

toolbar[iconsize="small"] #history-button {
  -moz-image-region: rect(0px 178px 24px 154px);
}
toolbar[iconsize="small"] #history-button:active {
  -moz-image-region: rect(24px 178px 48px 154px);
}
toolbar[iconsize="small"] #history-button[disabled="true"] {
  -moz-image-region: rect(48px 178px 72px 154px) !important;
}

toolbar[iconsize="small"] #bookmarks-button {
  -moz-image-region: rect(0px 202px 24px 178px);
}
toolbar[iconsize="small"] #bookmarks-button:active {
  -moz-image-region: rect(24px 202px 48px 178px);
}
toolbar[iconsize="small"] #bookmarks-button[disabled="true"] {
  -moz-image-region: rect(48px 202px 72px 178px) !important;
}

toolbar[iconsize="small"] #print-button {
  -moz-image-region: rect(0px 226px 24px 202px);
}
toolbar[iconsize="small"] #print-button:active {
  -moz-image-region: rect(24px 226px 48px 202px);
}
toolbar[iconsize="small"] #print-button[disabled="true"] {
  -moz-image-region: rect(48px 226px 72px 202px);
}

toolbar[iconsize="small"] #new-tab-button {
  -moz-image-region: rect(0px 250px 24px 226px);
}
toolbar[iconsize="small"] #new-tab-button:active,
toolbar[iconsize="small"] #new-tab-button[checked="true"] {
  -moz-image-region: rect(24px 250px 48px 226px);
}
toolbar[iconsize="small"] #new-tab-button[disabled="true"] {
  -moz-image-region: rect(48px 250px 72px 226px) !important;
}

toolbar[iconsize="small"] #new-window-button {
  -moz-image-region: rect(0px 274px 24px 250px);
}
toolbar[iconsize="small"] #new-window-button:active {
  -moz-image-region: rect(24px 274px 48px 250px);
}
toolbar[iconsize="small"] #new-window-button[disabled="true"] {
  -moz-image-region: rect(48px 274px 72px 250px) !important;
}

toolbar[iconsize="small"] #cut-button {
  -moz-image-region: rect(0px 298px 24px 274px);
}
toolbar[iconsize="small"] #cut-button:active {
  -moz-image-region: rect(24px 298px 48px 274px);
}
toolbar[iconsize="small"] #cut-button[disabled="true"] {
  -moz-image-region: rect(48px 298px 72px 274px) !important;
}

toolbar[iconsize="small"] #copy-button {
  -moz-image-region: rect(0px 322px 24px 298px);
}
toolbar[iconsize="small"] #copy-button:active {
  -moz-image-region: rect(24px 322px 48px 298px);
}
toolbar[iconsize="small"] #copy-button[disabled="true"] {
  -moz-image-region: rect(48px 322px 72px 298px) !important;
}

toolbar[iconsize="small"] #paste-button {
  -moz-image-region: rect(0px 346px 24px 322px);
}
toolbar[iconsize="small"] #paste-button:active {
  -moz-image-region: rect(24px 346px 48px 322px);
}
toolbar[iconsize="small"] #paste-button[disabled="true"] {
  -moz-image-region: rect(48px 346px 72px 322px) !important;
}

/* ::::: fullscreen window controls ::::: */

#window-controls {
  -moz-box-align: center;
  padding: 0 2px 0 4px;
  border-left: 2px solid;
  -moz-border-left-colors: ThreeDHighlight ThreeDShadow;
}

#minimize-button {
  list-style-image: url("chrome://global/skin/icons/Minimize.gif");
}
#restore-button {
  list-style-image: url("chrome://global/skin/icons/Restore.gif");
}
#close-button {
  list-style-image: url("chrome://global/skin/icons/Close.gif");
}

/* ::::: nav-bar-inner ::::: */

#urlbar {
 -moz-appearance: none;
 border: none;
 background-color: transparent;
}

#urlbar > .autocomplete-textbox-container {
 background-image: url('chrome://browser/skin/leftcap.png');
 background-position: left center;
 background-repeat: no-repeat;
 background-color: transparent;  
 padding-left: 3px;
 padding-top: 8px;
 padding-bottom: 9px;
 margin-bottom:0px;
}

#urlbar > .autocomplete-history-dropmarker {
 border: medium none;
 background-image: url('chrome://browser/skin/rightcap.png');
 list-sytle-image:url('chrome://browser/skin/autocomplete-dropmarker.png');
 background-color: Transparent;
 background-repeat: no-repeat;
 margin-top: 6px;
 padding-bottom: 6px;
}

#urlbar > .autocomplete-history-dropmarker:hover,
#urlbar > .autocomplete-history-dropmarker:hover:active {
 -moz-image-region: rect(px 16px 16px 0px);
}


#search-bar {
 -moz-appearance: none;
 border: none;
 background-color: transparent;
 min-height: 22px;
 margin: -1px 0px -4px 0px;
}

#search-bar > .autocomplete-textbox-container {
 border: medium none;
 background-image: url('chrome://browser/skin/x.png');
 background-position: left center;
 background-repeat: repeat-x;
 background-color: transparent;
 padding-left: 10px;
 padding-right: 10px;
 padding-bottom: 2px;
 padding-top: 1px;
 min-height: 22px;
 margin-bottom:2px;
}

.textbox-input-box {
 border-top: 2px solid;
 -moz-border-top-colors: #878787 #B5B5B5;
 border-bottom: 2px solid;
 -moz-border-bottom-colors: #E1E1E1 #F3F3F3;
 background-color: #FFFFFF;
 margin: -1px 0px -1px -1px;
 padding: 0px 0px 1px 2px;
}

#search-bar {
 width: 128px;
}

/* ::::: search-bar ::::: */

#search-proxy-button {
min-width: 22px;
margin: 0px 3px 0px 5px;  
}

.search-proxy-button-image {
padding: 0px;
list-style-image: url("chrome://browser/skin/Search-bar.png");
}

.search-proxy-button-dropmarker {
list-style-image: url("chrome://global/skin/arrow/arrow-dn.png");
padding: 6px 0px 5px 17px;

}

#miSearchModeFind, #__PhoenixFindInPage {
list-style-image: url("chrome://browser/skin/Search-bar.png");
}

#miSearchModeFind[checked="true"] {
 list-style-image: url("chrome://global/skin/menu/menu-check.png");
}

/* ::::: page proxy icon ::::: */

#page-proxy-deck,
#page-proxy-favicon,
#page-proxy-button, 
#search-proxy-button {
  width: 16px;
  height: 16px;
  margin: 0px;
  padding: 0px;
}

#page-proxy-deck {
  cursor: -moz-grab;
  margin: 2px 3px;
}

#page-proxy-favicon {
  list-style-image: none;
}

#page-proxy-button {
  list-style-image: url("chrome://browser/skin/bookmarks/bookmark-item.png");
}

#page-proxy-button[pageproxystate="invalid"] {
  cursor: default;
  -moz-opacity: 0.5;
}


statusbarpanel#statusbar-display {
  padding-left: 0;
}


/* ::::: autocomplete ::::: */

.autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) {
  color: #555566;
}

/* ::::: go button ::::: */

#go-button,
#go-container {
  -moz-appearance: none;
  background-color: transparent;
  margin: 0;
  padding: 0;
  min-width: 0;
  list-style-image: url("chrome://browser/skin/Go.png");
  -moz-image-region: rect(0px, 20px, 20px, 0px);
}

#go-button {
  -moz-appearance: toolbarbutton;
}

#go-button:hover:active {
  -moz-image-region: rect(0px, 40px, 20px, 20px);
}

#go-button[disabled="true"] {
  -moz-image-region: rect(0px, 60px, 20px, 40px);
}

#go-button > .button-box > .button-text {
  margin-left: 5px !important;
}

#go-button > .button-box {
  border: none;
}

sidebarheader {
	border-bottom: 1px solid #A3A3A3;
        background: url("chrome://global/skin/inset_gradient_1px.png") repeat !important;
}

#sidebar-box {
  -moz-appearance: dialog;
}

#sidebar-splitter {
  border-right: 1px solid #8e8e8e;
         border-left: 1px solid #bebebe;
         background-color: #ececec;
} 

#sidebar-title {
  font: icon;
  color: #000;
}

#sidebar-throbber[loading="true"] {
  list-style-image: url("chrome://global/skin/icons/loading_16.gif");
}

/* ::::: content area ::::: */

#status-bar {
  border-top: none;
}

#security-button {
  display: none;
}

#security-button[level="high"] {
  list-style-image: url("chrome://browser/skin/Secure.png");
  display: -moz-box;
}

#security-button[level="low"] {
  list-style-image: url("chrome://browser/skin/Secure.png");
  display: -moz-box;
}

#security-button[level="broken"] {
  list-style-image: url("chrome://browser/skin/Security-broken.png");
  display: -moz-box;
}

#page-report-button {
  display: none;
}

#page-report-button[blocked] {
  display: -moz-box;
  list-style-image: url("chrome://browser/skin/Info.png");
  padding: 0px 3px 0px 3px;
}

#page-theme-button {
  display: none;
}

#page-theme-button[themes] {
  display: -moz-box;
  list-style-image: url("chrome://browser/skin/page-themes.png");
  padding: 0px 3px 0px 3px;
}

/* :::::: throbber :::::::::: */

#navigator-throbber {
  -moz-appearance: none;
  -moz-user-focus: ignore;
  -moz-box-pack: center;
  margin: 0px 1px 0px 1px !important;
  border: none !important;
  padding: 0px !important;
  min-width: 0;
  background-color: transparent;
  list-style-image: url("chrome://global/skin/icons/notloading_16.png");
  padding: 8px !important;
  
}


#navigator-throbber[busy="true"] {
  list-style-image: url("chrome://global/skin/icons/loading_16.gif");
}

toolbar[iconsize="small"] #navigator-throbber,
toolbar[mode="text"] #navigator-throbber {
  list-style-image: url("chrome://global/skin/icons/notloading_16.png");
  padding: 4px !important;
}
toolbar[iconsize="small"] #navigator-throbber[busy="true"],
toolbar[mode="text"] #navigator-throbber[busy="true"] {
  list-style-image: url("chrome://global/skin/icons/loading_16.gif");
}

toolbarbutton.chevron {
  list-style-image: url("chrome://global/skin/icons/chevron.png") !important;
}


toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
  display: none;
}


#PersonalToolbar {
        background-image: none;
}

.bookmark-item {
   list-style-image: url("chrome://browser/skin/bookmarks/bookmark-item.png");
}

.tabs-left {
	display: none !important;
}

/* ::::: close button ::::: */

.tabs-closebutton {
  padding-right: 4px;
  list-style-image: url("chrome://global/skin/icons/closetab.png") !important;
  list-style-image: none;
  border: none;
}

.tabs-closebutton:hover:active {
	list-style-image: url("chrome://global/skin/icons/closetab-active.png") !important;
}

#114762

thanks mate, the address and search bars are now both rounded off. (Y)

#114783

Great theme here, I finally got it to work.

Is there any way to restore the Safari loading animation into the corners of tabs? I'm finding that the lack of them is not only aesthetically displeasing, but it also distorts tabs which are loading.

#114837

I'm currently using the loading animation found in the Saf-P theme.

Go to \global\icons\loading-anim.gif

#114843

I can't seem to get the throbber to work.

Can you post your working CSS here?

#114868

Inside the global file is a browser.css

I took the loading gif from Lynchknot's SAF-P theme, renamed it from "loading-anim.gif" to "tabitem-loading.gif" and put it in the skin\classic\global\icons folder.

Now, open the skin\classic\global\browser.css file and find the following code:

.tab-icon-image {
  width: 16px;
  height: 16px;
  list-style-image: url("chrome://xxxxxxxxxxxx.gif");
}

change the path to:

url("chrome://global/skin/icon/tabitem-loading.gif"");

Relativity_17,

I didn't know if you were talking to me or not but hey, maybe you were.

Edit: I added an image to show what the loading animation looks like if someone has trouble finding it. I also took the liberty to change the tab image, dull grey is not my thing.

#114887

has anyone been able to implement this extension:

http://extensionroom.mozdev.org/more-info/themer

everytime i tried to, my pinstripe theme got all facked.

#114925

sketching

what am i doing wrong

i've renamed the file and added it to classic.jar in the right dir

edited the .css file but its still the same

am i missing a step?

are there suppose to be 2 quotes at the end of this like u posted?

url("chrome://global/skin/icon/tabitem-loading.gif"");

let me know

gable

#114926

Originally posted by gable@Feb 15 2004, 07:31 PM

are there suppose to be 2 quotes at the end of this like u posted?

url("chrome://global/skin/icon/tabitem-loading.gif"");

defintley not.

#114930

The rounded bar tip worked perfectly for me too, thanks. I now only have a problem with the "go" button, the text is visible. How can i make it disappear?

Oh, and i got a problem with the tabs, the favicons sometimes are huge and ugly. Is there a fix for it?

#114954

hmm

well am i supposed to be editing the pinstripe classic.jar file?

thats where i got the .css file and added the lines as mentioned

thats correct right? if so why don't i see any loading animation in the tabs?

is there some setting i might have checked or unchecked in the tabextentions options that i dunno about?

thanks again

gable

#114990

That's not for the tab reloading animation.

It's for getting rounded corners on the address bar.

(Correct me if I'm wrong. )

#115007

i'm talking about sketchings most recent post about animated tab gif not what XJOSHATTACKX posted with the edited .css file

this:

Inside the global file is a browser.css

I took the loading gif from Lynchknot's SAF-P theme, renamed it from "loading-anim.gif" to "tabitem-loading.gif" and put it in the skin\classic\global\icons folder.

Now, open the skin\classic\global\browser.css file and find the following code:

the rounded corner info worked perfect - just can't get any animated tab action going

BTW, is this possible yet with firefox and if so where can i download uabar since the link is dead for now

Step 6: The User-Agent String

1) Install the UA Bar.

2) Restart Mozilla Firebird

3) Customise your toolbar, and drag the UA Bar somewhere.

4) Enter Mozilla/5.0 (Macintosh; U; PPC Mac OS X; en) AppleWebKit/103u (KHTML, like Gecko) safari/100 into the UA Bar and hit enter.

N.B.: This UA String is the most current at the time of writing, and is (apparently) the UA string for the Safari build on Panther. For future reference, all Safari UA strings should be of the form Mozilla/5.0 (Macintosh; U; PPC Mac OS X; en-us) AppleWebKit/XX (KHTML, like Gecko) Safari/YY, where XX and YY indicate builds of the appropriate software (Apple WebKit and Safari).

5) Remove the UA bar

6) Restart Mozilla Firebird.

gable

#115015