MrOtherGuy / firefox-csshacks

Collection of userstyles affecting the browser
Mozilla Public License 2.0
3.13k stars 310 forks source link

Hi, using the FF "tabs on bottom" causing FF extension button to disappear #298

Closed CatsinQ closed 1 year ago

CatsinQ commented 1 year ago

OK, this is my first post on github, and please be patient with me. I am in my 60's and never taken a computer course in my life, but I do like my FF tabs on bottom, so I learned how to create a chrome file, and that's about it! This evening I was trying to take a screenshot using Awesome screenshot, and realized the icon had disappeared. Then realized the extension button (the puzzle piece) had also disappeared, and that none of my extensions were available. I refreshed FF, the extension button returned, I re-customized my toolbars, and re-created the userchrome file to get my tabs on bottom. Worked perfectly - tabs are on bottom, BUT extension button has disappeared again. I notice in the text that it says "Get window_control_placeholder_support.css Window controls will be all wrong without it."

Is this what I'm missing? Is this a reference to what the FF windows look like, and not a reference to Windows OS? And if that will fix my issues, where can I find window_control_placeholder_support.css ? I tried searching for it, and ended up here, so I joined github and now you are completely up to speed on my process. {haha]

Please help! And thank you VERY MUCH. I literally have no idea what else to do except ask :)

MrOtherGuy commented 1 year ago

Yeah, so I imagine what is happening is that window control buttons (the three buttons, minimize, maximize and close, in either left or right corner of the window depending on your OS) are now covering the extensions puzzle-piece button. And also probably covering main menu button and likely some other button as well.

This is where that one stylesheet you mentioned comes in to play; it can be found here - window_control_placeholder_support.css

That style creates empty space in the main toolbar where window control buttons can be shown without them covering anything.

So, what you need to do is to use content of both styles in your userChrome.css file. The resulting userChrome.css should then have content like this, i.e. the content of both files is just appended to one another.

CatsinQ commented 1 year ago

First of all, thank you so much for trying to help me. Now, for the report:  it kind of halfway worked. The menu bar  and the address bar switched places, the puzzle piece icon is half visible but it doesn't do anything when I click it (although tabs are still on bottom, so yay!)

I know it says to modify according to one's preferences, but I'm not sure what to modify, or what preferences I would need to make it look normal (i.e., address bar on the second line, menu bar on the top) and work normally.

Thoughts about what I should do next? Do I have a setting wrong somewhere? Or can you tell me what to modify (and HOW)?

Anaya Palay, DAOM Doctor of Acupuncture and Oriental Medicine cell: 773-505-4401 This e-mail and any files transmitted with it are confidential and intended solely for the use of the individual or entity to whom they are addressed. If you are not the intended addressee, or the person responsible for delivering it to them, you may not copy, forward, disclose or otherwise use it or any part of it in any way. To do so may be unlawful. If you receive this e-mail by mistake, please advise the sender immediately and permanently delete your copy.

On Sunday, July 9, 2023 at 01:01:24 AM CDT, MrOtherGuy ***@***.***> wrote:  

Yeah, so I imagine what is happening is that window control buttons (the three buttons, minimize, maximize and close, in either left or right corner of the window depending on your OS) are now covering the extensions puzzle-piece button. And also probably covering main menu button and likely some other button as well.

This is where that one stylesheet you mentioned comes in to play; it can be found here - window_control_placeholder_support.css

That style creates empty space in the main toolbar where window control buttons can be shown without them covering anything.

So, what you need to do is to use content of both styles in your userChrome.css file. The resulting userChrome.css should then have content like this, i.e. the content of both files is just appended to one another.

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you authored the thread.Message ID: @.***>

MrOtherGuy commented 1 year ago

Can you share a screenshot about how the toolbar area looks on your system? That would give me more clues about what might be the issue.

One thing is for certain though, you mentioned menubar. Yes, if you need menubar to be visible then you also need to add code from tabs_on_bottom_menubar_on_top_patch.css. Just add it to your userChrome.css after everything else. That shouldn't help with extensions button being unclickable, but the toolbar order should then be what you want.

CatsinQ commented 1 year ago

Hi, I'm so sorry - thought included the screen shot last time, here it is again. I'm at work and will be able to try this again with the additional script at home. The bigger issue is still not being able to use the puzzle piece button.

And before I forget -- THANK YOU SO MUCH!!!  It's very kind of you to help me and I appreciate it so much.

Anaya Palay, DAOM Doctor of Acupuncture and Oriental Medicine cell: 773-505-4401 This e-mail and any files transmitted with it are confidential and intended solely for the use of the individual or entity to whom they are addressed. If you are not the intended addressee, or the person responsible for delivering it to them, you may not copy, forward, disclose or otherwise use it or any part of it in any way. To do so may be unlawful. If you receive this e-mail by mistake, please advise the sender immediately and permanently delete your copy.

On Sunday, July 9, 2023 at 09:50:57 PM CDT, MrOtherGuy ***@***.***> wrote:  

Can you share a screenshot about how the toolbar area looks on your system? That would give me more clues about what might be the issue.

One thing is for certain though, you mentioned menubar. Yes, if you need menubar to be visible then you also need to add code from tabs_on_bottom_menubar_on_top_patch.css. Just add it to your userChrome.css after everything else. That shouldn't help with extensions button being unclickable, but the toolbar order should then be what you want.

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you authored the thread.Message ID: @.***>

MrOtherGuy commented 1 year ago

Your images are not coming through. I'm assuming this is because you are replying via email. Try writing your reply directly to the issue thread on github.

For reference, with the mentioned three styles things are supposed to look like something like this: image

CatsinQ commented 1 year ago

Apologies for causing so much difficulty! I don't see a way to add a picture. So, this is a link to my google photos. I hope it works! https://photos.app.goo.gl/HzWCovWHr5wNfMki8

MrOtherGuy commented 1 year ago

Okay, now I understand what the issue is; all the buttons that you have can't fit into the toolbar and the extensions puzzle-piece being the right-most one is pushed out of the view. The menu button suffers from basically the same thing except the behavior is a bit different for technical reasons.

You want menubar to be visible, right? In your image it is between tabs and main toolbars, but the style I mentioned above will fix that. Anyway, the menubar is mostly empty - you can right-click the toolbar area, say the home-button and then select "Customize toolbar". Then move some of the buttons there thus, leaving enough space for the extensions-button. You could also move the separate search-bar or zoom-buttons there. Alternatively you could remove some of those from the toolbar by either dragging them into the customization palette when customize mode is active, or by right-clicking the button and selecting "remove from toolbar" - but indeed, menubar is mostly empty so it might just be better to move some of the items there.

A sidenote, your image indeed seems to be taken before you had applied tabs_on_bottom_menubar_on_top_patch.css because menubar should not be between toolbars if that patch is applied. But in case the the image actually is taken after applying the patch then something went wrong somewhere. In such case go to this link - the code area should include content for all three styles mentioned in this conversation. Then copy the whole code and make sure your userChrome.css contains only that (hopefully you don't have any other styles in your userChrome). Copying the whole thing from that page at once should make sure it gets copied correctly and in right order.

CatsinQ commented 1 year ago

OMG You're a GENIUS. THANK YOU SO MUCH. I really appreciate you helping a total stranger to this extent. I am literally thrilled (it's the little things, right?) to have everything back the way it should be. I was scared to try it because if it didn't work I wasn't sure I'd have the nerve to bother you again, but it works. THANK YOU!

CatsinQ commented 1 year ago

UGH - now I can't figure out how to mark this issue as resolved! But hopefully I've done it right.

MrOtherGuy commented 1 year ago

Alright cool, it sounds like things are working :)

And if you have trouble with stuff in this repository then feel free to bother me again - it's what the issue tracker is here for.