Aris-t2 / CustomCSSforFx

Custom CSS tweaks for Firefox
GNU General Public License v3.0
1.88k stars 181 forks source link

[macOS][Fx57] 'tabs below' not working for me #29

Closed dshayne closed 7 years ago

dshayne commented 7 years ago

Hi, sorry, I am probably doing something totally wrong, but I cannot get the tabs below nav bar to work in 57. I am using a Mac...does this only work for Windows? I created a chrome folder in profiles folder, then used textedit to create a userChrome.css file, then pasted in the code. Restarted firefox but no love there. Seems like I am missing something simple. Can you help? Thanks in advance, loved (and contributed to) CTR, Debbie

Aris-t2 commented 7 years ago

Try to extract all the files from the zip file to chrome folder, open userChrome.css and remove comment signs from the corresponding line /* @import url(./css/tabs/tabs_below_navigation_toolbar.css); */ --> @import url(./css/tabs/tabs_below_navigation_toolbar.css);

It worked fine on Windows, macOS and Linux when I ran the tests. Please don't try to use own userChrome.css files/tweaks or combine code from here with existing file while testing.

dshayne commented 7 years ago

Thank you, but I guess I am still missing something. I have gone here:

https://github.com/Aris-t2/CustomCSSforFx/blob/master/classic/userChrome.css

copied the entire contents of the file, and removed the comments signs from that line. I then saved the file and restarted firefox. However, what I did not do, and cannot see how to do, is to "extract all the files from the zip file to chrome folder” where do I find the zip folder?

Thanks again, Debbie

--- please don't add full post quotes ---

Aris-t2 commented 7 years ago

Get latest release from release page: https://github.com/Aris-t2/CustomCSSforFx/releases Look for *v1.2.8.zip file. Download it, extract its content to your profiles /chrome/ folder (remove everything from there, if folder is not empty).

Only that way you will have all files this project offers.

Open userChrome.css file and look for /* @import url(./css/tabs/tabs_below_navigation_toolbar.css); */

ImSpecial commented 7 years ago

Sorry to hi-jack this thread but I wanted to ask you this and its not worth a new issue, and somewhat related to tabs below anyway.

So first off, love your work, CTR and now this, it's damn well appreciated.

Okay so here is my little issue/hi-jack, this is how tabs look normally, when using compact + dark theme. https://i.imgur.com/YgZzpUD.png

Now when using your "tabs_below_nav....css" tweak, they look like this https://i.imgur.com/TX0axfx.png

They're great, but notice now the bar is of a light grey color, is there a way to have them be black like in the first picture.


Okay what the hell I've already jack this, and not making a separate issue for this either.

Hi-jack, Pt. 2: Is there anyway to hide these few quirks of Firefox? I couldn't find them in your 1.2.8 release.

https://i.imgur.com/dmHieRP.png (ugh, hit that bookmark Star 3 times already un-bookmarking my bookmark...) https://i.imgur.com/XX6Vfvi.png (Find that these 3 items just clutter the menu, never use them.) https://i.imgur.com/PKIjkG4.png (I'll assume this can be done since it's already in your Location Bar tweak, but not for the Search Bar yet.)

dshayne commented 7 years ago

Hi, Thanks for that. I would not have found it.

I think I must be an idiot though. I believe I did as you instructed, but still having no luck. I am attaching screenshots. My MAC version is 10.9.5. Could that have anything to do with it?

So sorry to bug you, Debbie

--- please don't add full post quotes ---

Aris-t2 commented 7 years ago

@dshayne I don't see why your macOS version would handle CSS differently, but I'm only testing on macOS 10.13. No screenshots in your post, but just try to start over. Remove everything from chrome folder, extract all files there so it looks like .../[profilefolder]/chrome/userChrome.css, edit userChrome.css, remove /* */ from /* @import url(./css/tabs/tabs_below_navigation_toolbar.css); */ line, save file and restart Firefox.

@ImSpecial I will fix the tab background on next update.

  1. star button can be hidden: right-click it > select "remove from..."
  2. I could add code to remove them on next update (Windows/Linux only).
  3. I will add an option for this on next update.
ImSpecial commented 7 years ago

I will fix the tab background on next update. Hurray!

1. star button can be hidden: right-click it > select "remove from..." Derp. 2. I could add code to remove them on next update (Windows/Linux only). Thanks, looking forward to it. 3. I will add an option for this on next update. Thanks, looking forward to it.

dshayne commented 7 years ago

Thanks, I’ll try it and here are the screenshots

--- please don't add full post quotes ---

ImSpecial commented 7 years ago

Okay so Right On! with all these changes in v1.2.9, much improved, but... I've noticed two things.

With tabs on bottom, the background is much improved from what it was, but I notice there is now a thin whitish/grey line, as seen here https://i.imgur.com/vpGsRZV.png (also ignore the Bookmarks Toolbar, I oopsed, and had it on for the screenshot)

Also is there a way to get this background black? I like the contrast of Black/Grey instead of the current Grey/Grey

A quick little photo job here, but this is what I'm after with tabs on bottom, the black I mean. https://i.imgur.com/xI0Fgix.png

Also the hide "Subscribe to This Page" seems to work, but pops up on certain pages like this here gitHub page and ghacks.net for example https://i.imgur.com/vugMNyV.png

Other then that, its all good.

dshayne commented 7 years ago

Thank you, I’ve done that, but still tabs are on top. Can’t imagine what I am doing wrong. I tried it on my husband’s computer, same thing.

Debbie

On Nov 15, 2017, at 5:15 AM, Aris notifications@github.com wrote:

@dshayne I don't see why your macOS version would handle CSS differently, but I'm only testing on macOS 10.13. No screenshots in your post, but just try to start over. Remove everything from chrome folder, extract all files there so it looks like .../[profilefolder]/chrome/userChrome.css, edit userChrome.css, remove / / from / @import url(./css/tabs/tabs_below_navigation_toolbar.css); / line, save file and restart Firefox.

@ImSpecial I will fix the tab background on next update.

star button can be hidden: right-click it > select "remove from..." I could add code to remove them on next update (Windows/Linux only). I will add an option for this on next update. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.

Aris-t2 commented 7 years ago

@ImSpecial The grey line will be removed on next update.

Some users want the background to match other toolbars, some want it black. I can't be both at the same time, so I'm going the first one to be more consistent withe other settings ;-) Use this to get the background black.

#main-window[style*='--lwt-header-image:url("resource:///chrome/browser/content/browser/defaultthemes/compact.header.png");']:-moz-lwtheme-brighttext #TabsToolbar:-moz-lwtheme {
  background: #000000 !important;
}

There is a second subscribe entry I missed. Next update will take care of it.

@dshayne I'm suspecting some macOS incompatibilities, which may be related to user/admin rights management. Maybe some macOS versions do not support everything the latest one does.

Look here https://github.com/Aris-t2/CustomCSSforFx/issues/28 The user @mcnesium has problems to enable top level image on OSX 10.11, while it works fine for me on macOS 10,13.

At this point I have no idea how to help you, because all I can do is providing files and instructions how to use them. If Firefox refuses to recognize them in some unclear cases, the is nothing I can fix or change from my end. Do other settings work besides "tabs below navigation toolbar"? How does your window look after extracting this projects files into chrome folder? Can you post a screenshot?

ImSpecial commented 7 years ago

Fair enough, but umm, where to I paste that line into?

When I put it anywhere in the userChrome.css it seems to break the entirety of the settings I had set up.

dshayne commented 7 years ago

Hi, Thank you for your help. I understand that you cannot be responsible for different MAC versions, and I just appreciate what you have been able to do.

Everything looks fine, otherwise. I am attaching a screenshot.

Best, Debbie

dshayne commented 7 years ago

Hi Aris, Good news! I figured it out. I went to about:config and hit the ‘show in finder’ button for profile. Instead of going to the Profile folder, or the Chrome Folder, it went to the other folder in my Profile folder ending in .default. I just dragged my Chrome folder into that and it worked!

Hope this helps others, Debbie

Aris-t2 commented 7 years ago

@ImSpecial The code should not break anything. I suggest to add it to the end of your userChrome.css file or to wait for next update.

@dshayne Good to hear you found a solution. So this issue can be closed now?

Tethin commented 7 years ago

Hello, I'm a windows user and am also having issues getting the tabs to get down. I'm pretty new to coding stuff, so I'm probably doing something wrong. I've got screenshots of the folders, the section I changed in the first "tabs down" option I found, and my system specs in case that somehow applies. Thanks for the help.

folders tabs below nav system specs

Aris-t2 commented 7 years ago

@Tethin Your modified comments inside the file break its uage.

The green ones are correct comments, everything else is not, so you have to edit that file and add /* and */ correctly for the following lines.

toolbar order... navigation toolbar bookmarks toolbar tabs toolbar toolbar end

Why did you even edit those parts? Here is how it looks when you download it.

/* toolbar order (start) ************************************/
#print-preview-toolbar,
#printedit-toolbar,
#titlebar {
  -moz-box-ordinal-group: 0 !important;
}
#navigator-toolbox #toolbar-menubar {
  -moz-box-ordinal-group: 1 !important;
}
/* navigation toolbar */
#navigator-toolbox #nav-bar {
  -moz-box-ordinal-group: 2 !important;
}
/* bookmarks toolbar */
#navigator-toolbox #PersonalToolbar {
  -moz-box-ordinal-group: 3 !important;
}
/* 3rd party toolbars */
#navigator-toolbox toolbar {
  -moz-box-ordinal-group: 10 !important;
}
/* tabs toolbar */
#navigator-toolbox #TabsToolbar {
  -moz-box-ordinal-group: 100 !important;
}
/* toolbar order (end) **************************************/
Tethin commented 7 years ago

Yes that's how it looked, and your instructions say (in short) "Code between / and / won't be used by Firefox." so when I made the chrome folder and put the zip download files in there and nothing changed when I restarted the browser, I assumed I was supposed to use that instruction to toggle which features I wanted active. I see now looking back at the instructions that my dumb butt missed the bit about using userChrome.css and userContent.css files for that.

I've got it working now. Thanks for putting up with me and for providing all these tweaks.