[!] GENERAL discussion, feedback, questions belong here! (v6)

[Aris-t2]

Make sure you updated to the most recent version of this projects files "before" reporting problems!

Continued from #3, #41, #88, #109 and #133.

Instead of opening new "issues" for general talk we can use this area for discussions, feedback and questions. Open new "issues" for real bugs and problems.

Custom JS scripts to restore more classic features
https://github.com/Aris-t2/CustomJSforFx

Trying to make CSS code ready for Firefox Quantum (57+)?
Remove all @namespace references. They are the reason, if your code refuses to work.

Application/hamburger button in tabs toolbar?
Look here: #46

Things this project will not target/recreate

• curved tabs
• old complete themes
• ...

Things not possible with CSS

• more toolbars like add-on/status bar (CSS can not create new toolbars)
  • displaying full sized status popup below window content is possible
  • moving bookmarks toolbar to windows bottom is possible
• new buttons (CSS can not create new buttons)
• additional menuitems (CSS can not create new items)
• custom/new/different functions for buttons/menuitems/menus
• activity indicator
• preference/options window
• additional location bar
• favicon in location bars identity box
• moving menubar items to a different toolbar
• restart button
• ... many more

[ImSpecial]

Not a bug, but maybe an oversight/inconsistency I though I might as well report since I noticed it.

Using the latest v2.2.2, it looks like the hover effect on the New Tab's page search bar is missing... I'll just do pictures.

Search Bar no hover

Search Bar hover

For comparison:
Location Bar no hover

Location Bar hover

There kinda inverses if you know what I mean.

[aflove65]

When Nightly upgraded to 65.0a1 I can no longer put the tabs under the main content or below the navigation and bookmark toolbar. Is there any fix for this?

[Aris-t2]

@ImSpecial
Do you think Mozilla will take care of this in the future?

@aflove65
This will be fixed on next update.

[ImSpecial]

No idea on that, probably not... it's not a big deal either way, but I think what makes it more noticeable with CustomCSSforFX is that the tiny 1px grey border is being removed on hover when it dosn't with stock FF, also when the bar has the blue highlight effect it's not quite looking right either using CustomCSSforFX.

Stock FF, no chrome folder:

CustomCSSforFX:

[Aris-t2]

If you are not using the old "dark appearance" for Firefox 60 on current Firefox versions, there is nothing, that can affect the about:newtab page.

Location and search bar buttons/icons get altered by @import "./css/locationbar/icons_colorized.css";, but without it, I see no difference compared to browsers Vanilla setup + dark theme (Fx65).

[ImSpecial]

I am using "\css\aboutnewtab\dark_appearance.css" though...

[Crybal]

In the menu>submenu ,how can I change the color of the arrow and the shortcut?
Eg.Menu>bookmarks> Show all bookmarks " Ctrl+Ahift+B "
Menu>bookmarks>bookmarks folder ">" most visited

[John0877]

OK, so, I am pretty sure Im blind but since updating to 2.2.2 and going through the options I cant find where to set some of the color options. I have tried changing settings in custom_tab_color_settings.css after removing the /* in userChrome.css to enable it but they dont seem to take effect.

Few things I would like to change in this screenshot: https://i.imgur.com/zKBR35y.png
-Tab background colors (the light gray on the hovered tab and the darker gray on the other tabs.
-Remove gradient from the selected tab, or at least just know where to remove it.
-Tab border colors
-The space between last tab and the minimize button (it seems to only be there in the multirow css file v1 but its not present in v2 for some reason.
-The background color, and gradient for all the buttons on the toolbar
-Is it possible to remove the line around the address bar?

It would be neat if the second and more tab rows could start at the edge of the screen instead of after the app button but Im sure thats probly not possible.

[That-Random-Guy]

Is it still not possible to move the overflow menu button on the navigation bar? I can't for the life of me understand why they'd fix its position in that way.

[Aris-t2]

@ImSpecial

You don't need that on Firefox 61+, because default 'Dark' theme already styles newtab page automatically.

@Crybal
To colorize the shortcut:

.menu-accel {
  color: red !important;
}

You can not change the color of the arrow. The image has to be switched.

.menu-right image {
}

@John0877
Tab colors
If you are using the whole package, colors have to be configured within config/color_variables.css file.

Space between last tab and the minimize button
Your tab dimensions do not allow another tab there, so it gets moved to next row. Try to set different min/max width values.

The background color, and gradient for all the buttons on the toolbar
Disable @import "./css/buttons/buttons_on_navbar_classic_appearance.css";

Is it possible to remove the line around the address bar?

#urlbar {
  border: 0 !important;
  outline: unset !important;
  box-shadow: unset !important;
}

It would be neat if the second and more tab rows could start at the edge of the screen instead...
Only possible, if the appbutton is not on titlebar.

@That-Random-Guy
Please explain what you mean by that.
The overflow button >> is on navigation toolbar by default. If you are talking about the application/Firefox button, you have to disable @import "./css/appbutton/appbutton_in_titlebar.css"; and @import "./css/appbutton/appbutton_in_titlebar_autocolor.css"; to get the default main menu button on navigation toolbar.

[ImSpecial]

Yeah I suppose it does, but I like your colors better :), you use a lighter grey then default FF's dark mode, also I use your dark bookmark side menu and thus colors wont match because again you use a lighter grey, tabs and duckduckgo's dark mode also all match this way.

This is what things look like with your darkmode, and without.

CustomCSSforFX:
https://i.imgur.com/ggz8Qoq.png

FF Dark Mode:
https://i.imgur.com/GAF24Pv.png

[That-Random-Guy]

@That-Random-Guy
Please explain what you mean by that.
The overflow button >> is on navigation toolbar by default. If you are talking about the application/Firefox button, you have to disable @import "./css/appbutton/appbutton_in_titlebar.css"; and @import "./css/appbutton/appbutton_in_titlebar_autocolor.css"; to get the default main menu button on navigation toolbar.

@Aris-t2
I am indeed referring to the overflow menu button on navbar, or the '>>'. I'm wondering if there's any way to move its position via CSS and have it swap places with the downloads button. I asked this same question for an earlier release/build but after looking at the code available here, I thinking the answer to my question is still no. I'm just asking again to be 100% sure.

[Aris-t2]

@ImSpecial
The colors indeed blend better, but I believe you only need pages background color from that file.

@That-Random-Guy
You can only achieve this with Javascript and you have to know the button ids to place them in the correct order.

Navigation toolbar > main menu button, overflow button, downloads button:

setTimeout(function(){
  try{
	
	document.getElementById("nav-bar-customization-target").insertBefore(document.getElementById("PanelUI-button"),null);
	document.getElementById("nav-bar-customization-target").insertBefore(document.getElementById("nav-bar-overflow-button"),null);
	document.getElementById("nav-bar-customization-target").insertBefore(document.getElementById("downloads-button"),null);
	  
  } catch(e){}
},200);

https://github.com/Aris-t2/CustomJSforFx

[ImSpecial]

Is that just the first few lines of the file?

@-moz-document url(about:newtab), url(about:home) {
  body {
	background-color: #323234 !important;
	color: #D1D1D1 !important;
  }

[happysurf]

Maybe the code is already published but I did'nt found.
Is possible change the background and the text color of status panel?

[That-Random-Guy]

@Aris-t2
Thanks, mate. That did the trick!

[John0877]

The icon for the MySessions extension keeps getting reset to black on browser restart in spite of changing the color in the settings dialog. I was wondering if there'd be a way to override its color since I am assuming its not an actual icon file since there's a color picker in its settings.

[Aris-t2]

@happysurf

:-moz-any(statuspanel,#statuspanel) :-moz-any(#statuspanel-label,.statuspanel-label) {
  -moz-appearance: none !important;
  background: red !important;
  color: yellow !important;
}

@John0877
We can not override that buttons color with CSS, because the used SVG image does not allow it. The internal color changer always generates a new icon with the selected color.

But the internal icon color changer works for me. I enabled/disabled the option a few times and it started to do its job.

[happysurf]

@happysurf

:-moz-any(statuspanel,#statuspanel) :-moz-any(#statuspanel-label,.statuspanel-label) {
  -moz-appearance: none !important;
  background: red !important;
  color: yellow !important;
}

Thanks, but doesn't work on 64beta but this yes:

/* Status panel */
@media (-moz-windows-default-theme) {
#statuspanel-label {
   background-color: white !important;
   color: black !important;
}

Created looking chrome://browser/skin/browser.css code. :-)

[Aris-t2]

@happysurf

Works for me with every Firefox version I tested between 60 and 65 (ESR, release, beta, Nighty). I even added an option of this for next update.

Those nodes did not change for years. What OS / theme are you testing on?

[happysurf]

@happysurf

Works for me with every Firefox version I testrf between 60 and 65 (esr, release, beta, nighty). I even added an option of this for next update.

Those nodes did not change for years. What OS / theme are you testing on?

This morning on my PC at work (Firefox 64beta +FirefoxColor theme + W10) works fine, maybe at home I have some code line that interfere.
Then I check in detail.
Thanks as always.

[rvansa]

Hi, I must be missing something very simple. Using FF 63.0.1 (64-bit) on Fedora 28 and CustomCSSforFx v2.2.6, all I did is unpacking the release zip into profile folder (verified through about:support - Profile Directory) and uncommented line 355

@import "./css/tabs/tabs_multiple_lines_v2.css";

Nothing happens; opening new tabs still scrolls the tab list horizontally, no more rows appear. I've tried with a fresh profile with the same result.

Thanks for correcting my ignorance.

[Aris-t2]

Did you ui not change at all or do only multilined tabs refuse to work?

Make sure you not just unpacked the release into profile folder, but into profiles chrome folder.
It should look like this:

PROFILEFOLDER\chrome\config\
PROFILEFOLDER\chrome\css\
PROFILEFOLDER\chrome\image\
PROFILEFOLDER\chrome\userChrome.css
PROFILEFOLDER\chrome\userContent.css

[rvansa]

@Aris-t2 Sorry, that was it 🤦‍♂️ However sizing the tab width does not seem to do the trick; I've overwritten --tab_min_width_mlt: 145px; --tab_max_width_mlt: 145px; (trying both multiline v1 and v2), in both cases the tabs in a full row are narrow, in case of v2 the last row has wider tabs.

[Aris-t2]

You are using the complete package, so values have to be overridden within /config/ files:
https://github.com/Aris-t2/CustomCSSforFx/blob/master/classic/config/general_variables.css#L27

[ghost]

@Aris-t2
Hi.
Did both

Add a /* before @import "./css/toolbars/toolbars_old_padding.css"; /**/ I

&

test this code

Unfortunately, neither has any effect. No change from earlier image ...

EDIT: Actually, I think there is a slight change ... namely there's now 1 px spacing above the tabs, below the bookmarks.

[ChasCB]

Once again Aris a big Thank You. That code worked exactly. I just changed the colour to black. This line visibility problem is to do with the macOS Transparency effect versus Opaque.

[nollinvoyd]

Using FX65, search suggestions display like this. Using Fx 66.06b, it "sometimes" displays like this.

But it also randomly looks like this, using the same profile.

On another subject, I'm having trouble locating past posts. Are they deleted after some time?

I asked a question about the space that was created below the tab bar after Fx 65, and how to get rid of it

You made a suggestion but I'm not sure how to go about it.

thanks

[albino1]

On another subject, I'm having trouble locating past posts. Are they deleted after some time?

It's because Github annoyingly hides comments in long threads. Do a find on this page for hidden items and then click Load more and search again.

[bendover22]

The way that email notifications are sent for "discussions" like this is a bit different.
At the very top of this random topic discussion, the default setting is "Not Watching. Be notified only when participating or @ mentioned." :)

I was getting emailed full copies of every comment made (ever). I guess by their system, if you make one comment, they would email you a copy of every comment made, for yrs.

I changed the preference to "Ignoring - never be notified."
A never ending thread like this has no means to know who is replying to a question or comment that one user made. It would be nice if Github used software that handled individual posts / questions, when NOT posting in the issues / bug reporting area.

[Aris-t2]

@Jole7

Test this code to improve bookmarks toolbar padding and height.

#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(#nav-bar) {
  padding-left: 0px !important;
  padding-right: 0px !important;
}

#navigator-toolbox > #PersonalToolbar {
  min-height: 30px !important;
  padding-top: 2px !important;
  padding-bottom: 2px !important;
}

No idea why the new tab button padding does not work for you. Maybe you are overriding the code with own code?

#main-window #navigator-toolbox #TabsToolbar .tabs-newtab-button,
#main-window #navigator-toolbox #TabsToolbar #new-tab-button {
  margin-left: 20px !important;
  margin-right: 20px !important;
}

@nollinvoyd
I know about the bug, but have not found a proper solution yet. The alternative would be a smaller list with a scrollbar.

This thread became too long. Its probably time for a new one.

[Aris-t2]

Continue here: #189

[nollinvoyd]

@albino1

On another subject, I'm having trouble locating past posts. Are they deleted after some time?

It's because Github annoyingly hides comments in long threads. Do a find on this page for hidden items and then click Load more and search again.

Thanks

[nollinvoyd]

@Aris-t2

@nollinvoyd
I don't think the old code is compatible to the new/different CSS code required for tabs on Fx 65+.
Try to change tab height using this projects internal variables and "option files". I have not tested such tiny tab height values on Fx65 yet.

Please point me in the direction of these files, etc. I tried altering the values in certain files I thought would apply, but couldn't get anything to happen.

[krystian3w]

copy quote to #189 (v7)...

[Aris-t2]

@nollinvoyd
For this projects classic squared tabs:
https://github.com/Aris-t2/CustomCSSforFx/blob/master/classic/config/general_variables.css#L9

[nollinvoyd]

@Aris-t2

@nollinvoyd
Yes, move the search bar to navigation toolbar during testing to be sure it does not cause the "missing buttons" glitch.

After moving the search bar, this is what the toolbar looks like with all buttons correctly displayed

This is how it looks when the "glitch" occurs. In this situation. There are 4 addon buttons that actually do appear (enclosed in the red box). This does not occur when glitch occurs and the search bar is on the menu bar, when no addon buttons appear.

In addition, I have several addon buttons pinned to the overflow. That display remains the same regardless.

[Aris-t2]

Without searchbar the rest of navigation toolbars content uses different space calculations.

[nollinvoyd]

@Aris-t2

@nollinvoyd
For this projects classic squared tabs:
/classic/config/general_variables.css@master#L9

These are the only items that seem to apply to height

Altering this only affects the top tab border

/* general settings */ :root { /* custom height for 'classic squared tabs' only */ --classic_squared_tabs_tab_height: 26px !important;

Changing this has no affect that I can see

:root[uidensity="touch"] { /* custom height for 'classic squared tabs' only */ --classic_squared_tabs_tab_height: 36px !important; }

[Aris-t2]

Use complete package and only change one line (the one I pointed in a post above).

[nollinvoyd]

@Aris-t2

Without searchbar the rest of navigation toolbars content uses different space calculations.

Can you elaborate. I don't understand. This event occurs no matter where the search bar is located. I wish I could test it in a purely clean profile, but ironically it requires addons to prompt the glitch.

Is it possible that a custom button is responsible? I had then before the problem began and things were fine.

[nollinvoyd]

@Aris-t2

Use complete package and only change one line (the one I pointed in a post above).

By "complete package" I assume you mean the entire general_variables.css file? I did, and tried to change the values I mentioned previoiusly.

I don't see a reference to a particular line in the post.

[Aris-t2]

By complete package I mean the full release of this projects files: https://github.com/Aris-t2/CustomCSSforFx/releases

Backup your /chrome/ folder, extract all files from releases zip file into a new empty /chrome/ folder.
Change tab height in general_variables.css ( https://github.com/Aris-t2/CustomCSSforFx/blob/master/classic/config/general_variables.css#L9 ).

[LionWrathz]

How can i fixes this .tabs-newtab-button boxe , I want to make it same size .tabbrowser-tab.

[Aris-t2]

I will add this as new option on next update:

#navigator-toolbox #TabsToolbar .tabs-newtab-button {
  -moz-box-flex: 100 !important;
  max-width: 225px !important;
  width: auto !important;
  min-width: var(--tab-min-width) !important;
}

[p1nkyy]

Hi I've just updated to FF 68 and CTR 2.5.7. I'm using the new classic/old autocomplete popup with two-lined results. However the height for each result becomes so big it almost fully cover the screen. What option to tweak? Is it the one in general_variable? http://puu.sh/DRUUn/705246a420.png

I want the tabs to have a highlight on top of them, like in this screenshot: http://puu.sh/DRUYD/d19e2d1112.png, what option to use?

[Aris-t2]

Change this value https://github.com/Aris-t2/CustomCSSforFx/blob/master/classic/css/locationbar/ac_popup_classic_with_two_lines_fx68.css#L70

I will tweak this a bit on next update.