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
Box disappears when mouse is hovered over it
- DanRaisch
- Moderator
- Posts: 127232
- Joined: September 23rd, 2004, 8:57 pm
- Location: Somewhere on the right coast
Re: Box disappears when mouse is hovered over it
Have you tried Mozilla Safe Mode?
- fixit7
- Posts: 233
- Joined: May 19th, 2015, 3:11 pm
Re: Box disappears when mouse is hovered over it
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-creat ... 744105c74/>
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.
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-creat ... 744105c74/>
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.