MozillaZine


Box disappears when mouse is hovered over it

User Help for Seamonkey and Mozilla Suite
fixit7

User avatar
 
Posts: 206
Joined: May 19th, 2015, 3:11 pm

Post Posted February 16th, 2021, 8:28 pm

When I post a question here, the box for "post your question" disappears when I hover my mouse over it.

https://askubuntu.com/

It acts normally with Firefox.

Since it works ok with FF, I feel that it is some kind of Seamonkey issue.

Any idea what is causing it?

Thanks

DanRaisch
Moderator

User avatar
 
Posts: 124224
Joined: September 23rd, 2004, 8:57 pm
Location: Somewhere on the right coast

Post Posted February 16th, 2021, 8:45 pm

Have you tried Mozilla Safe Mode?

fixit7

User avatar
 
Posts: 206
Joined: May 19th, 2015, 3:11 pm

Post Posted February 22nd, 2021, 4:06 pm

I tried safe mode, but no change.

I was told it was due to how the web page is written.

The button has this CSS background-color from its class s-btn__primary:
var(--theme-button-primary-background-color)

<https://blog.logrocket.com/how-to-create-better-themes-with-css-variables-5a3744105c74/>
for discussion of this syntax. These CSS variables are part of a site theme.

--theme-button-primary-background-color means --theme-primary-color,
which is hsl(12.87958115,76.70682731%,48.82352941%) -- call it "brick";

On hover, the button gets its background-color from its class

var(--theme-button-primary-hover-background-color)

--theme-button-primary-hover-background-color means
--theme-primary-color-darken-5, the brick colour with 43.82352941%
lightness.

--theme-primary-color-darken-5 is defined using calc(), like this

hsl( h, s, calc(var(--theme-primary-color-l) - 5%)

but units inside calc() were not supported until FF57, and not in
<color> context until FF59. In SM 2.53.6, FF52, etc, apparently colours
specified with calc() default to white. SeaMonkey needs to acquire the
Stylo CSS engine.

Notably the button text is styled white regardless of hovering, as the
theme doesn't contain variables like --theme-button-text-color and
--theme-button-text-hover-color.

Consequently the button seems to disappear on hovering.

This CSS can be injected to correct the display for the default site theme:

.s-btn__primary:hover,.s-btn__primary:focus,.s-btn__primary:active {
color:#fff;
background-color:hsl(12.87958115,76.70682731%,43.82352941%);
}

An extension like StyleM is good for this.

Why anyone would think it's worthwhile to create this CSS is a mystery.
Affordance effects like button hovering ought to be consistent across
not just the browser and all websites displayed in it but all other
applications on the same GUI platform.

Return to SeaMonkey Support


Who is online

Users browsing this forum: No registered users and 1 guest