mirrors/ladybird
0
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-08-22 10:19:20 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

LibWeb: Avoid changing button border color on disable/hover

Browse source
This commit is contained in:
Psychpsyo 2025-04-30 18:49:59 +02:00 • committed by Sam Atkins
commit 82387e2127
Notes: github-actions[bot] 2025-04-30 19:14:19 +00:00
6 changed files with 34 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

17
Libraries/LibWeb/CSS/Default.css
View file

@ -53,22 +53,21 @@ button, input[type=submit], input[type=button], input[type=reset], select, ::fil
border: 1px solid ButtonBorder; border: 1px solid ButtonBorder;
color: ButtonText; color: ButtonText;
cursor: default; cursor: default;
/* FIXME: For some reason this filter is required for the :hover style to work */
filter: contrast(100%);
}
button:disabled, input[type=submit]:disabled, input[type=button]:disabled, input[type=reset]:disabled, select:disabled { &:hover {
filter: contrast(70%); background-color: -libweb-ButtonFaceHover;
}
&:disabled {
background-color: -libweb-ButtonFaceDisabled;
color: GrayText;
}
} }
input[type=image] { input[type=image] {
cursor: pointer; cursor: pointer;
} }
button:hover, input[type=submit]:hover, input[type=button]:hover, input[type=reset]:hover, select:hover {
filter: contrast(70%);
}
option { option {
display: none; display: none;
} }

2
Libraries/LibWeb/CSS/Keywords.json
View file

@ -1,5 +1,7 @@
[ [
"-infinity", "-infinity",
"-libweb-buttonfacedisabled",
"-libweb-buttonfacehover",
"-libweb-center", "-libweb-center",
"-libweb-left", "-libweb-left",
"-libweb-link", "-libweb-link",

6
Libraries/LibWeb/CSS/StyleValues/CSSKeywordValue.cpp
View file

@ -50,6 +50,8 @@ bool CSSKeywordValue::is_color(Keyword keyword)
case Keyword::Inactivecaptiontext: case Keyword::Inactivecaptiontext:
case Keyword::Infobackground: case Keyword::Infobackground:
case Keyword::Infotext: case Keyword::Infotext:
case Keyword::LibwebButtonfacedisabled:
case Keyword::LibwebButtonfacehover:
case Keyword::LibwebLink: case Keyword::LibwebLink:
case Keyword::LibwebPaletteActiveLink: case Keyword::LibwebPaletteActiveLink:
case Keyword::LibwebPaletteActiveWindowBorder1: case Keyword::LibwebPaletteActiveWindowBorder1:
@ -205,6 +207,10 @@ Color CSSKeywordValue::to_color(Optional<Layout::NodeWithStyle const&> node) con
return SystemColor::selected_item(scheme); return SystemColor::selected_item(scheme);
case Keyword::Selecteditemtext: case Keyword::Selecteditemtext:
return SystemColor::selected_item_text(scheme); return SystemColor::selected_item_text(scheme);
case Keyword::LibwebButtonfacedisabled:
return SystemColor::button_face(scheme).with_alpha(128);
case Keyword::LibwebButtonfacehover:
return SystemColor::button_face(scheme).darkened(0.8f);
default: default:
break; break;
} }

9
Tests/LibWeb/Ref/expected/disabled-button-border-color-ref.html Normal file
View file

@ -0,0 +1,9 @@
<!DOCTYPE html>
<style>
div {
background-color: green;
width: 100px;
height: 100px;
}
</style>
<div></div>

9
Tests/LibWeb/Ref/input/disabled-button-border-color.html Normal file
View file

@ -0,0 +1,9 @@
<!DOCTYPE html>
<link rel="match" href="../expected/disabled-button-border-color-ref.html" />
<style>
button {
padding: 0;
border: 50px solid green;
}
</style>
<button disabled></button>

BIN
Tests/LibWeb/Screenshot/images/color-scheme-ref.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 23 KiB

After

Width:  |  Height:  |  Size: 18 KiB

Before After
Before After