RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-26 16:47:45 +00:00
Code Issues Activity Actions

LibWeb: Apply the color for inset and outset border styles

Browse source 
There's no specification for what the dark and light colors should be,
match the behavior of other browsers instead.
This commit is contained in:
Andi Gallo 2023-08-24 05:26:27 +00:00 • committed by Andreas Kling
parent c3f38c6cb8
commit 11e5865d53
1 changed files with 22 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

26
Userland/Libraries/LibWeb/Painting/BorderPainting.cpp
View file

@ -57,6 +57,24 @@ BorderRadiiData normalized_border_radii_data(Layout::Node const& node, CSSPixelR
return BorderRadiiData { top_left_radius_px, top_right_radius_px, bottom_right_radius_px, bottom_left_radius_px };
}
static constexpr double dark_light_absolute_value_difference = 1. / 3;
static Color light_color_for_inset_and_outset(Color const& color)
{
auto hsv = color.to_hsv();
if (hsv.value >= dark_light_absolute_value_difference)
return Color::from_hsv(hsv);
return Color::from_hsv({ hsv.hue, hsv.saturation, hsv.value + dark_light_absolute_value_difference });
}
static Color dark_color_for_inset_and_outset(Color const& color)
{
auto hsv = color.to_hsv();
if (hsv.value < dark_light_absolute_value_difference)
return Color::from_hsv(hsv);
return Color::from_hsv({ hsv.hue, hsv.saturation, hsv.value - dark_light_absolute_value_difference });
}
Gfx::Color border_color(BorderEdge edge, BordersData const& borders_data)
{
auto const& border_data = [&] {
@ -75,12 +93,12 @@ Gfx::Color border_color(BorderEdge edge, BordersData const& borders_data)
}();
if (border_data.line_style == CSS::LineStyle::Inset) {
auto top_left_color = Color::from_rgb(0x5a5a5a);
auto bottom_right_color = Color::from_rgb(0x888888);
auto top_left_color = dark_color_for_inset_and_outset(border_data.color);
auto bottom_right_color = light_color_for_inset_and_outset(border_data.color);
return (edge == BorderEdge::Left || edge == BorderEdge::Top) ? top_left_color : bottom_right_color;
} else if (border_data.line_style == CSS::LineStyle::Outset) {
auto top_left_color = Color::from_rgb(0x888888);
auto bottom_right_color = Color::from_rgb(0x5a5a5a);
auto top_left_color = light_color_for_inset_and_outset(border_data.color);
auto bottom_right_color = dark_color_for_inset_and_outset(border_data.color);
return (edge == BorderEdge::Left || edge == BorderEdge::Top) ? top_left_color : bottom_right_color;
}