WindowServer: Improve window frames by giving them a raised frame look. :^)

Servers/WindowServer/WSMenu.cpp

@@ -115,8 +115,8 @@ void WSMenu::draw()
     Painter painter(*menu_window()->backing_store());
 
     Rect rect { { }, menu_window()->size() };
-    painter.fill_rect(rect.shrunken(4, 4), Color::LightGray);
+    painter.fill_rect(rect.shrunken(6, 6), Color::LightGray);
-    StylePainter::paint_menu_frame(painter, rect);
+    StylePainter::paint_window_frame(painter, rect);
     int width = this->width();
 
     if (!s_checked_bitmap)

Servers/WindowServer/WSMenu.h

@@ -55,7 +55,7 @@ public:
     int height() const;
 
     int item_height() const { return 16; }
-    int frame_thickness() const { return 2; }
+    int frame_thickness() const { return 3; }
     int horizontal_padding() const { return left_padding() + right_padding(); }
     int left_padding() const { return 14; }
     int right_padding() const { return 14; }

Servers/WindowServer/WSWindowFrame.cpp

@@ -67,7 +67,7 @@ WSWindowFrame::~WSWindowFrame()
 
 Rect WSWindowFrame::title_bar_rect() const
 {
-    return { 2, 2, m_window.width() + 2, window_titlebar_height };
+    return { 3, 2, m_window.width(), window_titlebar_height };
 }
 
 Rect WSWindowFrame::title_bar_icon_rect() const
@@ -93,11 +93,6 @@ Rect WSWindowFrame::title_bar_text_rect() const
     };
 }
 
-Rect WSWindowFrame::middle_border_rect() const
-{
-    return { 1, 1, m_window.width() + 4, m_window.height() + 4 + window_titlebar_height };
-}
-
 void WSWindowFrame::paint(Painter& painter)
 {
     PainterStateSaver saver(painter);
@@ -125,13 +120,6 @@ void WSWindowFrame::paint(Painter& painter)
     auto titlebar_title_rect = titlebar_inner_rect;
     titlebar_title_rect.set_width(Font::default_bold_font().width(window.title()));
 
-    Rect inner_border_rect {
-        2,
-        2 + window_titlebar_height,
-        window.width() + 2,
-        window.height() + 2
-    };
-
     Color title_color;
     Color border_color;
     Color border_color2;
@@ -167,9 +155,9 @@ void WSWindowFrame::paint(Painter& painter)
     for (int i = 2; i <= titlebar_inner_rect.height() - 2; i += 2) {
         painter.draw_line({ titlebar_title_rect.right() + 4, titlebar_inner_rect.y() + i }, { leftmost_button_rect.left() - 3, titlebar_inner_rect.y() + i }, border_color);
     }
-    painter.draw_rect(middle_border_rect(), middle_border_color);
+
-    painter.draw_rect(outer_rect, border_color);
+    painter.draw_line(titlebar_rect.bottom_left().translated(0, 1), titlebar_rect.bottom_right().translated(0, 1), Color::LightGray);
-    painter.draw_rect(inner_border_rect, border_color);
+    StylePainter::paint_window_frame(painter, outer_rect);
 
     // FIXME: The translated(0, 1) wouldn't be necessary if we could center text based on its baseline.
     painter.draw_text(titlebar_title_rect.translated(0, 1), window.title(), wm.window_title_font(), TextAlignment::CenterLeft, title_color);

Servers/WindowServer/WSWindowFrame.h

@@ -24,7 +24,6 @@ private:
     Rect title_bar_rect() const;
     Rect title_bar_icon_rect() const;
     Rect title_bar_text_rect() const;
-    Rect middle_border_rect() const;
 
     WSWindow& m_window;
     Vector<OwnPtr<WSButton>> m_buttons;

SharedGraphics/StylePainter.cpp

@@ -203,7 +203,7 @@ void StylePainter::paint_frame(Painter& painter, const Rect& rect, FrameShape sh
     }
 }
 
-void StylePainter::paint_menu_frame(Painter& painter, const Rect& rect)
+void StylePainter::paint_window_frame(Painter& painter, const Rect& rect)
 {
     Color top_left_color;
     Color bottom_right_color;
@@ -216,8 +216,14 @@ void StylePainter::paint_menu_frame(Painter& painter, const Rect& rect)
     painter.draw_line(rect.top_left().translated(0, 1), rect.bottom_left(), base_color);
     painter.draw_line(rect.top_left().translated(1, 1), rect.top_right().translated(-1, 1), light_shade);
     painter.draw_line(rect.top_left().translated(1, 1), rect.bottom_left().translated(1, -1), light_shade);
+    painter.draw_line(rect.top_left().translated(2, 2), rect.top_right().translated(-2, 2), base_color);
+    painter.draw_line(rect.top_left().translated(2, 2), rect.bottom_left().translated(2, -2), base_color);
+
     painter.draw_line(rect.top_right(), rect.bottom_right(), dark_shade);
-    painter.draw_line(rect.bottom_left(), rect.bottom_right(), dark_shade);
     painter.draw_line(rect.top_right().translated(-1, 1), rect.bottom_right().translated(-1, -1), mid_shade);
+    painter.draw_line(rect.top_right().translated(-2, 2), rect.bottom_right().translated(-2, -2), base_color);
+    painter.draw_line(rect.bottom_left(), rect.bottom_right(), dark_shade);
     painter.draw_line(rect.bottom_left().translated(1, -1), rect.bottom_right().translated(-1, -1), mid_shade);
+    painter.draw_line(rect.bottom_left().translated(2, -2), rect.bottom_right().translated(-2, -2), base_color);
 }
+

SharedGraphics/StylePainter.h

@@ -13,5 +13,5 @@ public:
     static void paint_tab_button(Painter&, const Rect&, bool active, bool hovered, bool enabled);
     static void paint_surface(Painter&, const Rect&, bool paint_vertical_lines = true, bool paint_top_line = true);
     static void paint_frame(Painter&, const Rect&, FrameShape, FrameShadow, int thickness, bool skip_vertical_lines = false);
-    static void paint_menu_frame(Painter&, const Rect&);
+    static void paint_window_frame(Painter&, const Rect&);
 };