editor: Use buffer_font for folds and change foreground color (#48652)

xdBronch created 

re: https://github.com/zed-industries/zed/pull/48624
using the UI font could cause a visual bug when the cursor was over the
folded text
before:
<img width="191" height="48" alt="image"
src="https://github.com/user-attachments/assets/def0be7d-6fb3-4890-be47-cafee67558a3"
/>
after:
<img width="194" height="47" alt="image"
src="https://github.com/user-attachments/assets/a9b6fb8b-5646-4bd5-9108-b6f792f4571e"
/>

changing the color is of course just opinionated but i think it looks
better and makes more sense as a placeholder

Release Notes:

- N/A

Change summary

crates/editor/src/display_map/fold_map.rs | 6 +++++-
1 file changed, 5 insertions(+), 1 deletion(-)

Detailed changes

crates/editor/src/display_map/fold_map.rs 🔗 

@@ -56,9 +56,13 @@ impl FoldPlaceholder {
     /// Callers add children and event handlers on top.
     pub fn fold_element(fold_id: FoldId, cx: &App) -> Stateful<gpui::Div> {
         use gpui::{InteractiveElement as _, StatefulInteractiveElement as _, Styled as _};
-        use theme::ActiveTheme as _;
+        use settings::Settings as _;
+        use theme::{ActiveTheme as _, ThemeSettings};
+        let settings = ThemeSettings::get_global(cx);
         gpui::div()
             .id(fold_id)
+            .font(settings.buffer_font.clone())
+            .text_color(cx.theme().colors().text_placeholder)
             .bg(cx.theme().colors().ghost_element_background)
             .hover(|style| style.bg(cx.theme().colors().ghost_element_hover))
             .active(|style| style.bg(cx.theme().colors().ghost_element_active))