Pale Moon forum

Posted: **2022-05-03, 22:37**

Hi, do any of the developers have access to Google Drive? Not very long ago, the file view broke. Some relevant CSS code of the problematic element:

Code: Select all

.PEfnhb {
    box-sizing: border-box;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-flow: column nowrap;
    height: 100%;
    outline: none;
    overflow-y: scroll;
    position: relative;
    width: 100%;
}

What's interesting, if you set fixed height in pixels, it behaves properly, can scroll and view all files in the view, but at 100%, you can't see everything and scroll bar disables itself even though it should be enabled. At 99% for instance, you can only scroll as far as you could at 100%.

Some console output:

Code: Select all

Content Security Policy: Couldn’t parse invalid host 'report-sample'  
(unknown)
Content Security Policy: Ignoring “'unsafe-inline'” within script-src: ‘strict-dynamic’ specified  
(unknown)
Content Security Policy: Ignoring “https:” within script-src: ‘strict-dynamic’ specified  
(unknown)
Content Security Policy: Ignoring “http:” within script-src: ‘strict-dynamic’ specified  
(unknown)
Unexpected value  parsing height attribute.  
drive
Unexpected value  parsing width attribute.  
drive
Unexpected value  parsing height attribute.  
drive
Unexpected value  parsing width attribute.  
drive
Unexpected value  parsing height attribute.  
drive
Unexpected value  parsing width attribute.  
drive
Content Security Policy: Couldn’t process unknown directive ‘require-trusted-types-for’  
(unknown)
The character encoding of a framed document was not declared. The document may appear different if viewed without the document framing it.  
bscframe
Content Security Policy: Ignoring ‘x-frame-options’ because of ‘frame-ancestors’ directive.  
(unknown)
Content Security Policy: Ignoring “'unsafe-inline'” within script-src or style-src: nonce-source or hash-source specified  
(unknown)
Chat support:  /drive sl undefined undefined  
chat_load.js:133:141
Chat support operator creation succeeded  
chat_load.js:140:403
Chat support created successfully  
chat_load.js:141:11
Empty string passed to getElementById().  
m=b:1800:143

Posted: **2022-05-04, 09:29**

They're intentionally hiding the native scrollbars and replacing them with their own, as evidenced by the repeated overflow: none style declarations and differing appearance on other browsers, which doesn't seem to work well with Pale Moon.

You can use the following user style to fix the broken scrolling functionality:

Code: Select all

@-moz-document domain("drive.google.com") {
  body,
  div[data-label] > *,
  #drive_main_page,
  C-WIZ[data-view-root],
  C-WIZ[data-region-root]{
    overflow: auto !important;
  }
}

Off-topic:
IMHO, their custom scrollbars look ugly and reduces visibility due to the transparent background.

Screenshot 2022-05-04 173351.png

Posted: **2022-05-05, 17:49**

I suspected the problem might be somewhere else. That CSS makes it better, though it makes the whole thing scrollable, not just the problematic section.

Does custom scroll bar show out-of-the-box on Firefox? I haven't checked yet. Not as obvious on Chromium browsers since they already use custom controls for everything. Is thickness the telling factor? I have Firefox 96 as well where I've flipped all known preferences to restore native OS controls whereever possible as I just prefer that look.

Posted: **2022-05-05, 18:25**

Good Morning?

I have searched everywhere and can't figure out how to add a "user style"??

It looks like that solution above might fix the problem I am having with the "BRAND NEW" Otter.ai interface that came out a few days ago, "no scrolling bar".

Palemoon is my everyday browser, but unfortunately everyday I find a website with issues, arggh.

I have decided I may have to learn enough to help myself overcome some of these, so I don't have to keep going to Opera, which dang near crashes my computer with zero tabs open!!!

Thank you all in advance and for all you do
Randy

Posted: **2022-05-06, 00:16**

I found my profile at : C:\Users\your_user_name\AppData\Roaming\Moonchild Productions\Pale Moon\Profiles\

and I found in the "chrome/' folder - userChrome-example.css - which explained:

" * Edit this file and copy it as userChrome.css into your profile-directory/chrome/"

So I pasted the below code into a my new "userChrome.css"

Code: Select all

@-moz-document domain("otter.ai") {
  body,
  div[data-label] > *,
  #drive_main_page,
  C-WIZ[data-view-root],
  C-WIZ[data-region-root]{
    overflow: auto !important;
  }
}

I restarted Palemoon and there is no change at Otter.ai

I am wondering if that code is specific to "Google Drive", I guess I need to start my own thread on my scrollbar issue

Thanks
Randy

Posted: **2022-05-07, 05:38**

RandyC wrote: ↑
2022-05-05, 18:25
I have searched everywhere and can't figure out how to add a "user style"??

Install Stylem, a user style manager, and add the script to it. It adds a page to the addon manager for user styles, you can manage them from there. You don't have to mess with userstyle.css - that is to control CSS for the browser's own interface, not for webpages.

Posted: **2022-05-07, 12:35**

You could also try userContent.css instead of userChrome.css.

Posted: **2022-05-08, 00:07**

[/quote]

opus_27 wrote: ↑
2022-05-07, 12:35
You could also try userContent.css instead of userChrome.css.

So, I tried changing the name to "userContent" but I saw no change in the behavior at Otter.ai

moonbat wrote: ↑
2022-05-07, 05:38
Install Stylem, a user style manager, and add the script to it. It adds a page to the addon manager for user styles, you can manage them from there. You don't have to mess with userstyle.css - that is to control CSS for the browser's own interface, not for webpages.

Stylem is pretty neat, it shows me a great little green light, that my code should be affecting Otter.ai when I go there, but it still doesn't, so I guess the code really isn't correct.

I thank you both!!! I will get back to work on writing up the post for Otter.ai with renewed hope.

Randy

Posted: **2022-05-08, 13:15**

Using userContent.css is perfectly valid for storing CSS rules for web sites, but Stylem is obviously more convenient.

Posted: **2022-05-09, 01:32**

Oh, right - I was confusing it with userChrome.css.

Pale Moon forum

Google Drive - broken unscrollable file view (flex, height 100%)

Google Drive - broken unscrollable file view (flex, height 100%)

Re: Google Drive - broken unscrollable file view (flex, height 100%)

Re: Google Drive - broken unscrollable file view (flex, height 100%)

Re: Google Drive - broken unscrollable file view (flex, height 100%)

Re: Google Drive - broken unscrollable file view (flex, height 100%)

Re: Google Drive - broken unscrollable file view (flex, height 100%)

Re: Google Drive - broken unscrollable file view (flex, height 100%)

Re: Google Drive - broken unscrollable file view (flex, height 100%)

Re: Google Drive - broken unscrollable file view (flex, height 100%)

Re: Google Drive - broken unscrollable file view (flex, height 100%)