Recommended Posts

Thanks, foxxyn8!

I got the buttons sorted out. But a comment about the "background: none !important;" bit. On my net-banking site, when I use "background: none !important;" the modal dialog box (if that's the phrase) appears a bit transparent with the contents of the page underneath the box being somewhat visible. Changing it to "background: black !important;" wipes out the rest of the page until I close the box by hitting "OK" so I'm going with "background: black !important;".

that's beacause I used a rgba value to set the background-color of tabmodalprompt .mainContainer. You could just change it to an rgb or html color value instead of blacking out the whole tabmodalprompt background (unless that was the effect you were looking for):

tabmodalprompt .mainContainer {
     background: rgb(0,0,0) !important;
     color: #ddd !important;
}

tabmodalprompt {
     background: none !important;
}

http://lifehacker.com/#!5787398/automatically-hide-the-firefox-bookmarks-bar-when-not-in-use

This has to be my favorite stylish script now (however I changed the values to 0 seconds to make it instantly appear and hide).

  • Like 3

http://lifehacker.com/#!5787398/automatically-hide-the-firefox-bookmarks-bar-when-not-in-use

This has to be my favorite stylish script now (however I changed the values to 0 seconds to make it instantly appear and hide).

That is awesome, i hate having it as a button but i hate the wasted space of having a second toolbar, perfect.

Hi all, I need the code of the container of alert bar, I need to make it transparent but I have the code in the image I present the problem and give them part of the code.

/*chrome://global/content/alerts/alert.xul*/
#alertNotification {
	-moz-appearance: none !important;
	background: none !important;
	background-color: red !important;
	border-radius: 6px !important;
	background-image: -moz-linear-gradient(RGBa(250,253,255,.9), RGBa(250,253,255,.75) 20%, RGBa(250,253,255,.70) 39%, RGBa(250,253,255,0) 41%, RGBa(250,253,255,0)) !important;
	padding: 1px !important;
	margin: 16px !important;
	box-shadow: 0 0 0 1px RGBa(255,255,255,.65) inset,
		0 1px 0 RGBa(255,255,255,.3) inset,
		0 0 0 1px RGBa(0,0,0,.75),
		0 1px 3px 2px RGBa(0,0,0,.65) !important;}

Sinttulo-2.png

here's the style in userstyles -> http://userstyles.org/styles/45961/

Foxxyn or anyone... Can you explain me the difference ( if there is ) between:

a) visibility: collapse !im

b) display: none !im

?

visibility: collapse

For table rows, columns, column groups, and row groups the row(s) or column(s) are hidden and the space they would have occupied is (as if display : none were applied to the column/row of the table). However, the size of other rows and columns is still calculated as though the cells in the collapsed row(s) or column(s) are present. This was designed for fast removal of a row/column from a table without having to recalculate widths and heights for every portion of the table. For XUL elements, the computed size of the element is always zero, regardless of other styles that would normally affect the size, although margins still take effect. For other elements, collapse is treated the same as hidden.

display:none

Turns off the display of an element (it has no effect on layout); all child elements also have their display turned off. The document is rendered as though the element did not exist.

https://developer.mozilla.org/en/CSS/display

https://developer.mozilla.org/en/CSS/visibility

Here is my edited code for the add-on bar:

(both maximized/minimized window mode.)

vnck2g.png

#navigator-toolbox:not([customizing]) ~ #browser-bottombox {
        position: fixed;
        bottom: 0;
        left: 0;
}
#navigator-toolbox:not([customizing]) ~ #browser-bottombox #addon-bar {
        -moz-appearance: none !important;
        padding: 4px 8px 1px 8px !important;
        margin-bottom: -1px !important;
        border: none !important;
        border-radius: 1.5px 1.5px 0 0 !important;
        margin-right: 0px !important;
        background-image: -moz-linear-gradient(rgba(255,255,255,.8), rgba(200,200,200,.8)) !important;
        box-shadow: 0 0 0 1px rgba(0,0,0,.25) inset, 0 0 0 2px rgba(255,255,255,.5) inset !important;
        position: fixed;
        bottom: -7px;
        right: 18px;
        opacity: 0;
        -moz-transition: bottom 0.25s 0.5s ease-in, opacity 0.1s 0.65s ease-in;
}
#addon-bar .toolbarbutton-1 {
        vertical-align: bottom !important;
}
#navigator-toolbox:not([customizing]) ~ #browser-bottombox #addon-bar:hover {
        bottom: 0;
        opacity: 1;
        -moz-transition: bottom .25s .25s ease-out, opacity 0.1s 0.25s ease-out;
}

#addonbar-closebutton {
    display: none !important;
}


#FindToolbar {
        border: none !important;
}
#FindToolbar .findbar-container {
        margin-bottom: -2px !important;
        margin-left: -2px !important;
        border-radius: 0 1.5px 0 0 !important;
        background: -moz-linear-gradient(rgba(255,255,255,.8), rgba(200,200,200,.8)) !important;
        box-shadow: 0 0 0 1px rgba(0,0,0,.25) inset, 0 0 0 2px rgba(255,255,255,.5) inset !important;
}
#FindToolbar .find-status-icon[status="notfound"] + .findbar-find-status, #FindToolbar .find-status-icon[status="wrapped"] + .findbar-find-status {
        padding-right: 5px !important;
}
#FindToolbar .find-status-icon[status="notfound"], #FindToolbar .find-status-icon[status="wrapped"] {
         margin-left: -1px !important;
}
#FindToolbar .find-status-icon:not([status="notfound"]):not([status="wrapped"]) + .findbar-find-status {
         display: none !important;
}

I use your nice code, but how i can remove this selection over my Download Button?

post-350070-0-05768200-1301944697.jpg

i want to know how can i set the top radius of the tabs to 0 (see attached image)?

i want to know too how can i set the distance between 2 tabs to 1 px?

and other question is about the text on appmenu-button...how can i change the text in it and remove the dropmarker arrow?

thanks! =)

post-367840-0-51047400-1301965426.png

Thank you foxxyn! Kinda complicated. I wanted to know the practical difference.

Also, I can't get the proper code to remove Addon-bar's border only if FindToolBar = true... Can you help me once again? "border-top" if there is such option... To look like unified with findtoolbar...

Iregados, for squared tabs you must redesign the whole tab... Install "Stratiform" add-on, it has 2 options for squared tabs. One just squared without any change and one IE9-like. You can do also the buttons, text-boxes etc squared. You can change the text of Appmenu Button, too.

Thank you foxxyn! Kinda complicated. I wanted to know the practical difference.

Also, I can't get the proper code to remove Addon-bar's border only if FindToolBar = true... Can you help me once again? "border-top" if there is such option... To look like unified with findtoolbar...

#FindToolbar:not([hidden="true"]) + #addon-bar {
        border-top: 0 !important;
}

i want to know how can i set the top radius of the tabs to 0 (see attached image)?

i want to know too how can i set the distance between 2 tabs to 1 px?

and other question is about the text on appmenu-button...how can i change the text in it and remove the dropmarker arrow?

thanks! =)

@Deo Domuique

i know that Stratiform can do it all to me...but i wanted to do it by myself hehehe =)

Well the tabs are actually images, so you can't simply just change the border radius of them. You will need to edit the images if you want them squared. You can however change the distance:

.tabbrowser-tab {
  -moz-margin-end: 1px !important;
}

What is the code to remove the drop marker from the bookmarks button? I'm sure it's been asked and answered 100 times but I can't find it if it's has, sorry! :laugh:

Not sure it has been asked actually.

#bookmarks-menu-button .toolbarbutton-menu-dropmarker {
  display: none;
}

and other question is about the text on appmenu-button...how can i change the text in it and remove the dropmarker arrow?

thanks! =)

#appmenu-button .button-text { 
   display:none !important; 
}

#appmenu-button .button-menu-dropmarker::before { 
   content: "YOUR TEXT HERE"; 
   margin-left: -4px;
}

#appmenu-button .dropmarker-icon {
   display: none !important;
}

post-350326-0-53044800-1302109907.png

This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.