Themes: Fix default theme window stripes and shadow after #2811
Change #2811 made window title stripes and window title shadow themable, but it used the same stripe and shadow color for all window modes. This is fine for the new 'basalt' theme which uses the same color in all four window modes, but it changed the default theme so that background windows had brown stripes and a brown shadow. Instead, make the title stripe and title shadow themable per window mode, and change the default theme to restore the colors it had before change #2811: The title stripe color is the same as Border1 for all window modes, and the title shadow is the same as the title stripe darkened by 0.6.
This commit is contained in:
Nico Weber
Andreas Kling
parent
d366ad8232
commit
6dd10ad8dc
Notes:
sideshowbarker
2024-07-19 04:24:22 +09:00
Author: https://github.com/nico Commit: https://github.com/SerenityOS/serenity/commit/6dd10ad8dce Pull-request: https://github.com/SerenityOS/serenity/pull/2941
7 changed files with 50 additions and 18 deletions
|
|
@ -3,17 +3,23 @@ DesktopBackground=#171717
|
|||
ActiveWindowBorder1=black
|
||||
ActiveWindowBorder2=#1f1f1f
|
||||
ActiveWindowTitle=white
|
||||
ActiveWindowTitleShadow=#00000000
|
||||
ActiveWindowTitleStripes=#00000000
|
||||
InactiveWindowBorder1=#171717
|
||||
InactiveWindowBorder2=#1f1f1f
|
||||
InactiveWindowTitle=#aaaaaa
|
||||
InactiveWindowTitleShadow=#00000000
|
||||
InactiveWindowTitleStripes=#00000000
|
||||
MovingWindowBorder1=black
|
||||
MovingWindowBorder2=#2f1f1f
|
||||
MovingWindowTitle=white
|
||||
MovingWindowTitleShadow=#00000000
|
||||
MovingWindowTitleStripes=#00000000
|
||||
HighlightWindowBorder1=black
|
||||
HighlightWindowBorder2=#3f2f0f
|
||||
HighlightWindowTitle=white
|
||||
WindowTitleShadow=#00000000
|
||||
WindowTitleStripes=#00000000
|
||||
HighlightWindowTitleShadow=#00000000
|
||||
HighlightWindowTitleStripes=#00000000
|
||||
MenuBase=#1f1f1f
|
||||
MenuBaseText=white
|
||||
MenuStripe=#171717
|
||||
|
|
|
|||
|
|
@ -3,17 +3,23 @@ DesktopBackground=#505050
|
|||
ActiveWindowBorder1=#6e2209
|
||||
ActiveWindowBorder2=#f4ca9e
|
||||
ActiveWindowTitle=white
|
||||
ActiveWindowTitleShadow=#421405
|
||||
ActiveWindowTitleStripes=#6e2209
|
||||
InactiveWindowBorder1=#808080
|
||||
InactiveWindowBorder2=#c0c0c0
|
||||
InactiveWindowTitle=#d5d0c7
|
||||
InactiveWindowTitleShadow=#4c4c4c
|
||||
InactiveWindowTitleStripes=#808080
|
||||
MovingWindowBorder1=#a1320d
|
||||
MovingWindowBorder2=#fadcbb
|
||||
MovingWindowTitle=white
|
||||
MovingWindowTitleShadow=#601e07
|
||||
MovingWindowTitleStripes=#a1320d
|
||||
HighlightWindowBorder1=#a10d0d
|
||||
HighlightWindowBorder2=#fabbbb
|
||||
HighlightWindowTitle=white
|
||||
WindowTitleShadow=#421405
|
||||
WindowTitleStripes=#6e2209
|
||||
HighlightWindowTitleShadow=#600707
|
||||
HighlightWindowTitleStripes=#a10d0d
|
||||
MenuBase=white
|
||||
MenuBaseText=black
|
||||
MenuStripe=#bbb7b0
|
||||
|
|
|
|||
|
|
@ -72,17 +72,23 @@ public:
|
|||
Color active_window_border1() const { return color(ColorRole::ActiveWindowBorder1); }
|
||||
Color active_window_border2() const { return color(ColorRole::ActiveWindowBorder2); }
|
||||
Color active_window_title() const { return color(ColorRole::ActiveWindowTitle); }
|
||||
Color active_window_title_stripes() const { return color(ColorRole::ActiveWindowTitleStripes); }
|
||||
Color active_window_title_shadow() const { return color(ColorRole::ActiveWindowTitleShadow); }
|
||||
Color inactive_window_border1() const { return color(ColorRole::InactiveWindowBorder1); }
|
||||
Color inactive_window_border2() const { return color(ColorRole::InactiveWindowBorder2); }
|
||||
Color inactive_window_title() const { return color(ColorRole::InactiveWindowTitle); }
|
||||
Color inactive_window_title_stripes() const { return color(ColorRole::InactiveWindowTitleStripes); }
|
||||
Color inactive_window_title_shadow() const { return color(ColorRole::InactiveWindowTitleShadow); }
|
||||
Color moving_window_border1() const { return color(ColorRole::MovingWindowBorder1); }
|
||||
Color moving_window_border2() const { return color(ColorRole::MovingWindowBorder2); }
|
||||
Color moving_window_title() const { return color(ColorRole::MovingWindowTitle); }
|
||||
Color moving_window_title_stripes() const { return color(ColorRole::MovingWindowTitleStripes); }
|
||||
Color moving_window_title_shadow() const { return color(ColorRole::MovingWindowTitleShadow); }
|
||||
Color highlight_window_border1() const { return color(ColorRole::HighlightWindowBorder1); }
|
||||
Color highlight_window_border2() const { return color(ColorRole::HighlightWindowBorder2); }
|
||||
Color highlight_window_title() const { return color(ColorRole::HighlightWindowTitle); }
|
||||
Color window_title_stripes() const { return color(ColorRole::WindowTitleStripes); }
|
||||
Color window_title_shadow() const { return color(ColorRole::WindowTitleShadow); }
|
||||
Color highlight_window_title_stripes() const { return color(ColorRole::HighlightWindowTitleStripes); }
|
||||
Color highlight_window_title_shadow() const { return color(ColorRole::HighlightWindowTitleShadow); }
|
||||
Color menu_stripe() const { return color(ColorRole::MenuStripe); }
|
||||
Color menu_base() const { return color(ColorRole::MenuBase); }
|
||||
Color menu_base_text() const { return color(ColorRole::MenuBaseText); }
|
||||
|
|
|
|||
|
|
@ -120,17 +120,23 @@ RefPtr<SharedBuffer> load_system_theme(const String& path)
|
|||
DO_COLOR(ActiveWindowBorder1);
|
||||
DO_COLOR(ActiveWindowBorder2);
|
||||
DO_COLOR(ActiveWindowTitle);
|
||||
DO_COLOR(ActiveWindowTitleShadow);
|
||||
DO_COLOR(ActiveWindowTitleStripes);
|
||||
DO_COLOR(InactiveWindowBorder1);
|
||||
DO_COLOR(InactiveWindowBorder2);
|
||||
DO_COLOR(InactiveWindowTitle);
|
||||
DO_COLOR(InactiveWindowTitleShadow);
|
||||
DO_COLOR(InactiveWindowTitleStripes);
|
||||
DO_COLOR(MovingWindowBorder1);
|
||||
DO_COLOR(MovingWindowBorder2);
|
||||
DO_COLOR(MovingWindowTitle);
|
||||
DO_COLOR(MovingWindowTitleShadow);
|
||||
DO_COLOR(MovingWindowTitleStripes);
|
||||
DO_COLOR(HighlightWindowBorder1);
|
||||
DO_COLOR(HighlightWindowBorder2);
|
||||
DO_COLOR(HighlightWindowTitle);
|
||||
DO_COLOR(WindowTitleShadow);
|
||||
DO_COLOR(WindowTitleStripes);
|
||||
DO_COLOR(HighlightWindowTitleShadow);
|
||||
DO_COLOR(HighlightWindowTitleStripes);
|
||||
DO_COLOR(MenuStripe);
|
||||
DO_COLOR(MenuBase);
|
||||
DO_COLOR(MenuBaseText);
|
||||
|
|
|
|||
|
|
@ -39,17 +39,23 @@ enum class ColorRole {
|
|||
ActiveWindowBorder1,
|
||||
ActiveWindowBorder2,
|
||||
ActiveWindowTitle,
|
||||
ActiveWindowTitleShadow,
|
||||
ActiveWindowTitleStripes,
|
||||
InactiveWindowBorder1,
|
||||
InactiveWindowBorder2,
|
||||
InactiveWindowTitle,
|
||||
InactiveWindowTitleShadow,
|
||||
InactiveWindowTitleStripes,
|
||||
MovingWindowBorder1,
|
||||
MovingWindowBorder2,
|
||||
MovingWindowTitle,
|
||||
MovingWindowTitleShadow,
|
||||
MovingWindowTitleStripes,
|
||||
HighlightWindowBorder1,
|
||||
HighlightWindowBorder2,
|
||||
HighlightWindowTitle,
|
||||
WindowTitleShadow,
|
||||
WindowTitleStripes,
|
||||
HighlightWindowTitleStripes,
|
||||
HighlightWindowTitleShadow,
|
||||
MenuStripe,
|
||||
MenuBase,
|
||||
MenuBaseText,
|
||||
|
|
|
|||
|
|
@ -170,12 +170,12 @@ WindowFrame::FrameColors WindowFrame::compute_frame_colors() const
|
|||
auto& wm = WindowManager::the();
|
||||
auto palette = wm.palette();
|
||||
if (&m_window == wm.m_highlight_window)
|
||||
return { palette.highlight_window_title(), palette.highlight_window_border1(), palette.highlight_window_border2() };
|
||||
return { palette.highlight_window_title(), palette.highlight_window_border1(), palette.highlight_window_border2(), palette.highlight_window_title_stripes(), palette.highlight_window_title_shadow() };
|
||||
if (&m_window == wm.m_move_window)
|
||||
return { palette.moving_window_title(), palette.moving_window_border1(), palette.moving_window_border2() };
|
||||
return { palette.moving_window_title(), palette.moving_window_border1(), palette.moving_window_border2(), palette.moving_window_title_stripes(), palette.moving_window_title_shadow() };
|
||||
if (wm.is_active_window_or_accessory(m_window))
|
||||
return { palette.active_window_title(), palette.active_window_border1(), palette.active_window_border2() };
|
||||
return { palette.inactive_window_title(), palette.inactive_window_border1(), palette.inactive_window_border2() };
|
||||
return { palette.active_window_title(), palette.active_window_border1(), palette.active_window_border2(), palette.active_window_title_stripes(), palette.active_window_title_shadow() };
|
||||
return { palette.inactive_window_title(), palette.inactive_window_border1(), palette.inactive_window_border2(), palette.inactive_window_title_stripes(), palette.inactive_window_title_shadow() };
|
||||
}
|
||||
|
||||
void WindowFrame::paint_notification_frame(Gfx::Painter& painter)
|
||||
|
|
@ -192,7 +192,7 @@ void WindowFrame::paint_notification_frame(Gfx::Painter& painter)
|
|||
int stripe_bottom = m_window.height() - 3;
|
||||
if (stripe_top && stripe_bottom && stripe_top < stripe_bottom) {
|
||||
for (int i = 2; i <= palette.window_title_height() - 2; i += 2) {
|
||||
painter.draw_line({ titlebar_rect.x() + i, stripe_top }, { titlebar_rect.x() + i, stripe_bottom }, palette.window_title_stripes());
|
||||
painter.draw_line({ titlebar_rect.x() + i, stripe_top }, { titlebar_rect.x() + i, stripe_bottom }, palette.active_window_title_stripes());
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -220,7 +220,7 @@ void WindowFrame::paint_normal_frame(Gfx::Painter& painter)
|
|||
auto titlebar_title_rect = titlebar_inner_rect;
|
||||
titlebar_title_rect.set_width(WindowManager::the().window_title_font().width(title_text));
|
||||
|
||||
auto [title_color, border_color, border_color2] = compute_frame_colors();
|
||||
auto [title_color, border_color, border_color2, stripes_color, shadow_color] = compute_frame_colors();
|
||||
|
||||
auto& wm = WindowManager::the();
|
||||
painter.draw_line(titlebar_rect.bottom_left().translated(0, 1), titlebar_rect.bottom_right().translated(0, 1), palette.button());
|
||||
|
|
@ -234,14 +234,14 @@ void WindowFrame::paint_normal_frame(Gfx::Painter& painter)
|
|||
int stripe_right = leftmost_button_rect.left() - 3;
|
||||
if (stripe_left && stripe_right && stripe_left < stripe_right) {
|
||||
for (int i = 2; i <= titlebar_inner_rect.height() - 2; i += 2) {
|
||||
painter.draw_line({ stripe_left, titlebar_inner_rect.y() + i }, { stripe_right, titlebar_inner_rect.y() + i }, palette.window_title_stripes());
|
||||
painter.draw_line({ stripe_left, titlebar_inner_rect.y() + i }, { stripe_right, titlebar_inner_rect.y() + i }, stripes_color);
|
||||
}
|
||||
}
|
||||
|
||||
auto clipped_title_rect = titlebar_title_rect;
|
||||
clipped_title_rect.set_width(stripe_right - clipped_title_rect.x());
|
||||
if (!clipped_title_rect.is_empty()) {
|
||||
painter.draw_text(clipped_title_rect.translated(1, 2), title_text, wm.window_title_font(), Gfx::TextAlignment::CenterLeft, palette.window_title_shadow(), Gfx::TextElision::Right);
|
||||
painter.draw_text(clipped_title_rect.translated(1, 2), title_text, wm.window_title_font(), Gfx::TextAlignment::CenterLeft, shadow_color, Gfx::TextElision::Right);
|
||||
// FIXME: The translated(0, 1) wouldn't be necessary if we could center text based on its baseline.
|
||||
painter.draw_text(clipped_title_rect.translated(0, 1), title_text, wm.window_title_font(), Gfx::TextAlignment::CenterLeft, title_color, Gfx::TextElision::Right);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -64,6 +64,8 @@ private:
|
|||
Color title_color;
|
||||
Color border_color;
|
||||
Color border_color2;
|
||||
Color title_stripes_color;
|
||||
Color title_shadow_color;
|
||||
};
|
||||
|
||||
FrameColors compute_frame_colors() const;
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue