MozillaZine

[Ext] Classic Theme Restorer

Announce and Discuss the Latest Theme and Extension Releases.
Aris

User avatar
 
Posts: 3175
Joined: February 27th, 2011, 10:14 am

Post Posted January 27th, 2018, 8:24 am

@FineWine
Make sure the path is set correctly to the image file.
If the image is in ./chrome/image/close_alt.png,
list-style-image: url("./../../image/close_alt.png") only works for files with a path like this
./chrome/css/generalui/close_icon_red.css

Add the code of close_icon_red.css to your userChrome.css and replace the path
list-style-image: url("./../../image/close_alt.png") with
list-style-image: url("./image/close_alt.png")

@max2
You asked this question on Github, no need to repeat the question here too.
https://github.com/Aris-t2/CustomCSSfor ... -360991217

FineWine

User avatar
 
Posts: 194
Joined: July 16th, 2004, 12:21 am

Post Posted January 27th, 2018, 3:29 pm

Aris wrote:@FineWine
Make sure the path is set correctly to the image file.
If the image is in ./chrome/image/close_alt.png,
list-style-image: url("./../../image/close_alt.png") only works for files with a path like this
./chrome/css/generalui/close_icon_red.css

Add the code of close_icon_red.css to your userChrome.css and replace the path
list-style-image: url("./../../image/close_alt.png") with
list-style-image: url("./image/close_alt.png")

Oh Thank You - you are my GOD of userChrome.css

I could not get past list-style-image: url("chrome://../../image/close_alt.png") !important;

I now have FFQ58 99% the way I want it and have had it for several years.

I bow to you :D

FineWine

User avatar
 
Posts: 194
Joined: July 16th, 2004, 12:21 am

Post Posted January 27th, 2018, 5:00 pm

FineWine wrote:I now have FFQ58 99% the way I want it AS I (sic) have had it for several years.

Though Mozilla's aberrant behaviour still has a lot to be desired. My missing 1% perfection is "Icons + Text". Most of my family use FF and have always done so whether macOS or WindowsOS and these family members are getting on in years and are not familiar with todays iconography (3 horizontal lines is just that, not a Hamburger drop down menu)

FineWine wrote:Also the text of the focused Tab is blurry. I have the /* tab_titles_remove_blur */ code but with no effect.

Any fix for this?

max2
 
Posts: 247
Joined: September 17th, 2011, 5:37 pm

Post Posted January 27th, 2018, 6:01 pm

OMG your a god Aris thanks!

max2
 
Posts: 247
Joined: September 17th, 2011, 5:37 pm

Post Posted January 27th, 2018, 7:24 pm

nm

marty60
 
Posts: 475
Joined: March 21st, 2012, 7:09 am

Post Posted January 27th, 2018, 9:18 pm

Hi Aris,

Just downloaded nightly 60, it's been weeks since I tested one and it seems they finally killed your addon for good. Gone is the addon bar. I found this page regarding moving the personal toolbar to the bottom:

https://github.com/Aris-t2/CustomCSSforFx/issues/73

Is it possible to do this and what would the css code be?

Aris

User avatar
 
Posts: 3175
Joined: February 27th, 2011, 10:14 am

Post Posted January 28th, 2018, 3:53 am

@FireWine
Toolbar modes text and toolbar+text are part of the project.

(CustomCSSforFx) TOOLBARS > TOOLBAR TEXT MODES > toolbar_mode_icons_and_text.css / toolbar_mode_text.css
Image

I can't confirm the blurry text. At least I don't know what is causing it for you, but the feature of the project only removes the blurry text overlapping like seen on this screenshot.
Image

Any chance your font rendering settings are "wrong"?

gfx.canvas.azure.backends > direct2d1.1,cairo,skia (old font rendering)
gfx.content.azure.backends > direct2d1.1,cairo,skia (old font rendering)

gfx.canvas.azure.backends > direct2d1.1,skia,cairo (current font rendering)
gfx.content.azure.backends > direct2d1.1,skia,cairo (current font rendering)

@marty60
(CustomCSSforFx) TOOLBARS > ADDON BAR > addonbar_move_bookmarks_toolbar_to_bottom.css

There is code to simulate the add-on bar by moving the bookmarks toolbar to the bottom. You can even move the actual bookmarks to navigation toolbar to create a second bookmarks toolbar below navigation toolbar leaving a toolbar for buttons at windows bottom.
https://github.com/Aris-t2/CustomCSSfor ... bottom.css

I suggest to setup portable Firefox (60), add CustomCSSforFx release files to chrome folder and start testing/configuring ui by editing userChrome.css, userContent.css and the files in config folder to see what is available and possible.

Here is also a list of the project covers: https://github.com/Aris-t2/CustomCSSforFx/issues/2

max2
 
Posts: 247
Joined: September 17th, 2011, 5:37 pm

Post Posted January 28th, 2018, 4:01 am

Is this possible to hide the top tab bar but keep the Firefox Orange button please ? If so how ? Thanks.

Aris

User avatar
 
Posts: 3175
Joined: February 27th, 2011, 10:14 am

Post Posted January 28th, 2018, 4:08 am

The button is on Firefox titlebar. If you remove/hide that bar, the button is gone too. In that case I suggest to disable "appbutton in titlebar" settings in userChrome.css and start using the appbutton on toolbar settings where you also can set an orange color or different icons for the button. Just read what userChrome.css offers.

max2
 
Posts: 247
Joined: September 17th, 2011, 5:37 pm

Post Posted January 28th, 2018, 4:10 am

Aris wrote:The button is on Firefox titlebar. If you remove/hide that bar, the button is gone too. In that case I suggest to disable "appbutton in titlebar" settings in userChrome.css and start using the appbutton on toolbar settings where you also can set an orange color or different icons for the button. Just read what userChrome.css offers.


Thanks.

Yes but when I start using the appbutton on the toolbar settings it is not the full button that says Firefox on it :( It is the small little button. Is this normal ?


Also anyway to just hide the tabs and not the tab bar?

Aris

User avatar
 
Posts: 3175
Joined: February 27th, 2011, 10:14 am

Post Posted January 28th, 2018, 5:47 am

That is right, the button text only shows for the button on titlebar, but I can add an option for the label to show up on next update.


Use this to hide all tabs without collapsing their space.
Code: Select all
#tabbrowser-tabs {
  visibility: hidden !important;
}

FineWine

User avatar
 
Posts: 194
Joined: July 16th, 2004, 12:21 am

Post Posted January 30th, 2018, 8:28 pm

Aris wrote:I can't confirm the blurry text. At least I don't know what is causing it for you, but the feature of the project only removes the blurry text overlapping like seen on this screenshot.

Any chance your font rendering settings are "wrong"?

As you can see it looks like its casting a bottom shadow.

Image
Code: Select all
/*******************************************/
/* CUSTOM_TAB_TEXT_SETTINGS */
/*******************************************/

/**** default tab ****/

/* Set font & size for tabs' text */
.tabbrowser-tab  .tab-text {
font-size: 12pt !important;
font-family: Times Bold !important;
}

/* Centre tabs' text */
.tab-label {
  -moz-box-flex: 1 !important;
  text-align: center !important;
}

/* text color */
.tabbrowser-tab .tab-label {
  color: white !important;
}

.tabbrowser-tab .tab-label {
  font-weight: bold !important;
}

/**** selected tab ****/

/* text color */
.tabbrowser-tab[selected] .tab-label {
  color: white !important;
}

.tabbrowser-tab[selected] .tab-label {
  font-weight: bold !important;
}

/**** hovered tab ****/

.tabbrowser-tab:hover:not([selected]) .tab-label {
  color: black !important;
}

.tabbrowser-tab:hover:not([selected]) .tab-label {
  font-weight: bold !important;
}

/**** unloaded/pending tab ****/

/* text color */
.tabbrowser-tab[pending] .tab-label {
  color: white !important;
}

.tabbrowser-tab[pending] .tab-label {
  font-weight: bold !important;
}
/* italic */
.tabbrowser-tab[pending] .tab-label {
  font-style: italic !important;
}

/**** unread tab ****/

/* text color */
.tabbrowser-tab[unread] .tab-label {
  color: white !important;
}

/*bold*/
.tabbrowser-tab[unread] .tab-label {
  font-weight: bold !important;
}
/* italic */
.tabbrowser-tab[unread] .tab-label {
  font-style: italic !important;
}

/*******************************************/

Plus, I must admit, the text on any Tab (Default, selected, unloaded/pending, unread, hovered) are not very crisp & do not have sharp edges. the overall effect looks blurry.

Image

This is using the FFQ58.1 Default theme
and your:
TABS_BELOW_NAVIGATION_TOOLBAR (I have made no adjustments)
CUSTOM_COLORS_FOR_SQUARED_TABS (I have only made adustments to: background: linear-gradient (to bottom,#******,#******) !important;)
CUSTOM_TAB_TEXT_SETTINGS (I have only made adustments to: font-family, font-size, font-weight, font-style, color)

Aris

User avatar
 
Posts: 3175
Joined: February 27th, 2011, 10:14 am

Post Posted January 31st, 2018, 2:06 am

I thinks this is unrelated to CustomCSSforFx project. There are tons of rendering settings in about:config, maybe one of them causes this glitch for you?
How does it look on a new profile, if you only add modified tab text code or a different font than "Times Bold"?

Your code gives me this results:
Image

FineWine

User avatar
 
Posts: 194
Joined: July 16th, 2004, 12:21 am

Post Posted January 31st, 2018, 6:01 pm

Aris wrote:I thinks this is unrelated to CustomCSSforFx project. There are tons of rendering settings in about:config, maybe one of them causes this glitch for you?
How does it look on a new profile, if you only add modified tab text code or a different font than "Times Bold"?

Thank you Aris - I started a complete new Profile and it did clean things up to some extent but there is still a slight blur. So I will keep digging.

1 - What is the default Font that FFQ uses these days?

2 - Since I have now started with a completely new & clean Profile I am now missing the Separator lines from ALL my Toolbars. Prior to Quantum it was a Drag & Drop selection in the Customize settings panel. Anyway of getting this back?

3 - Plus is there anyway of getting back the Restart button? (though I think I know the answer to this one - Bug report)

Aris

User avatar
 
Posts: 3175
Joined: February 27th, 2011, 10:14 am

Post Posted February 1st, 2018, 12:25 am

1. It is most likely different for every OS.
Image

2. There are no separators in Fx57+, but CustomCSSforFx project offers a style to replace flexible spaces with separators.

Code: Select all
#main-window:not([customizing]) #nav-bar toolbarspring {
  -moz-appearance: separator !important;
  min-width: 1px !important;
  max-width: 1px !important;
  -moz-margin-start: 1px !important;
}


3. You could use custom user scripts (--> userChrome.js for Fx57+) and add a restart button script.

https://github.com/nuchi/firefox-quantum-userchromejs
https://github.com/ardiman/userChrome.js

I even have written a script to customize scrollbars, because NewScrollbars add-on was not compatible anymore to Fx57+: https://github.com/Aris-t2/Scrollbars

Return to Extension/Theme Releases


Who is online

Users browsing this forum: No registered users and 1 guest