pfp: 4.0 stroke, add border_stroke method

This reduces code duplication, and makes the border a bit cleaner
so that it blends into the panel color

Signed-off-by: William Casarin <jb55@jb55.com>

crates/notedeck_columns/src/ui/profile/edit.rs

@@ -64,7 +64,7 @@ impl<'a> EditProfileView<'a> {
             pfp_rect,
             ProfilePic::new(self.img_cache, pfp_url)
                 .size(size)
-                .border(2.0),
+                .border(ProfilePic::border_stroke(ui)),
         );
 
         in_frame(ui, |ui| {

crates/notedeck_columns/src/ui/profile/mod.rs

@@ -151,7 +151,7 @@ impl<'a> ProfileView<'a> {
                         pfp_rect,
                         ProfilePic::new(self.img_cache, get_profile_url(Some(&profile)))
                             .size(size)
-                            .border(2.0),
+                            .border(ProfilePic::border_stroke(ui)),
                     );
 
                     if ui.add(copy_key_widget(&pfp_rect)).clicked() {

crates/notedeck_columns/src/ui/profile/picture.rs

@@ -1,6 +1,6 @@
 use crate::images::ImageType;
 use crate::ui::{Preview, PreviewConfig};
-use egui::{vec2, Sense, TextureHandle};
+use egui::{vec2, Sense, Stroke, TextureHandle};
 use nostrdb::{Ndb, Transaction};
 use tracing::info;
 
@@ -10,7 +10,7 @@ pub struct ProfilePic<'cache, 'url> {
     cache: &'cache mut ImageCache,
     url: &'url str,
     size: f32,
-    border: Option<f32>,
+    border: Option<Stroke>,
 }
 
 impl egui::Widget for ProfilePic<'_, '_> {
@@ -30,6 +30,10 @@ impl<'cache, 'url> ProfilePic<'cache, 'url> {
         }
     }
 
+    pub fn border_stroke(ui: &egui::Ui) -> Stroke {
+        Stroke::new(4.0, ui.visuals().panel_fill)
+    }
+
     pub fn from_profile(
         cache: &'cache mut ImageCache,
         profile: &nostrdb::ProfileRecord<'url>,
@@ -68,8 +72,8 @@ impl<'cache, 'url> ProfilePic<'cache, 'url> {
     }
 
     #[inline]
-    pub fn border(mut self, width: f32) -> Self {
+    pub fn border(mut self, stroke: Stroke) -> Self {
-        self.border = Some(width);
+        self.border = Some(stroke);
         self
     }
 }
@@ -79,7 +83,7 @@ fn render_pfp(
     img_cache: &mut ImageCache,
     url: &str,
     ui_size: f32,
-    border: Option<f32>,
+    border: Option<Stroke>,
 ) -> egui::Response {
     #[cfg(feature = "profiling")]
     puffin::profile_function!();
@@ -126,39 +130,37 @@ fn pfp_image(
     ui: &mut egui::Ui,
     img: &TextureHandle,
     size: f32,
-    border: Option<f32>,
+    border: Option<Stroke>,
 ) -> egui::Response {
     #[cfg(feature = "profiling")]
     puffin::profile_function!();
 
     let (rect, response) = ui.allocate_at_least(vec2(size, size), Sense::hover());
-    if let Some(border_width) = border {
+    if let Some(stroke) = border {
-        draw_bg_border(ui, rect.center(), size, border_width);
+        draw_bg_border(ui, rect.center(), size, stroke);
     }
     ui.put(rect, egui::Image::new(img).max_width(size));
 
     response
 }
 
-fn paint_circle(ui: &mut egui::Ui, size: f32, border: Option<f32>) -> egui::Response {
+fn paint_circle(ui: &mut egui::Ui, size: f32, border: Option<Stroke>) -> egui::Response {
     let (rect, response) = ui.allocate_at_least(vec2(size, size), Sense::hover());
 
-    if let Some(border_width) = border {
+    if let Some(stroke) = border {
-        draw_bg_border(ui, rect.center(), size, border_width);
+        draw_bg_border(ui, rect.center(), size, stroke);
     }
+
     ui.painter()
         .circle_filled(rect.center(), size / 2.0, ui.visuals().weak_text_color());
 
     response
 }
 
-fn draw_bg_border(ui: &mut egui::Ui, center: egui::Pos2, size: f32, border_width: f32) {
+fn draw_bg_border(ui: &mut egui::Ui, center: egui::Pos2, size: f32, stroke: Stroke) {
-    let border_size = size + (border_width * 2.0);
+    let border_size = size + (stroke.width * 2.0);
-    ui.painter().circle_filled(
+    ui.painter()
-        center,
+        .circle_filled(center, border_size / 2.0, stroke.color);
-        border_size / 2.0,
-        ui.visuals().widgets.noninteractive.bg_stroke.color,
-    );
 }
 
 mod preview {
@@ -211,7 +213,7 @@ mod preview {
                             rect,
                             ui::ProfilePic::new(app.img_cache, url)
                                 .size(size)
-                                .border(2.0),
+                                .border(ui::ProfilePic::border_stroke(ui)),
                         )
                         .on_hover_ui_at_pointer(|ui| {
                             ui.set_max_width(300.0);

crates/notedeck_columns/src/ui/profile/preview.rs

@@ -41,7 +41,7 @@ impl<'a, 'cache> ProfilePreview<'a, 'cache> {
                 pfp_rect,
                 ProfilePic::new(self.cache, get_profile_url(Some(self.profile)))
                     .size(size)
-                    .border(2.0),
+                    .border(ProfilePic::border_stroke(ui)),
             );
             ui.add(display_name_widget(
                 get_display_name(Some(self.profile)),