Fix axis labels overlap with axis ticks (#57)

Currently, when you have custom axis labels, you will end up with the
following:


![plot_clipps](https://github.com/user-attachments/assets/a0bb2637-fae3-4fbc-8c2e-bdcc103eeb6f)

What i would expect (and what this pr does) is that the axis labels do
not overlap with the ticks.

This PR does two things: 
* First, it adds a top axis to the custom axis demo, so that the demo
can be used to verify that its not clipping anymore, in all axis
configurations.
* Second, it fixes the overlap by adding the "text_thickness" to the
axis thickness in the axis' ui() function.

This results in the following: 


![no_clip_fixed](https://github.com/user-attachments/assets/80f5cfea-a614-46fc-a9c9-dbb10778ac21)

A possible optimization would be to figure out the max tick thickness
around the axis label, instead of using the maximal thickness - that
could result in a tad smaller axis for plots where the order of
magnitude changes in the current view.

However, with this PR, the issue is fixed to a level where i'd say its
usable.

I have 
  * run check.sh locally and it went rhough 
  * tested it using the demo 
* thrown this pr into a larger project that uses egui_plot and have not
seen any issues arise from this.

Thanks for your time! 

EDIT: as is tradition, i immediately noticed something of as soon as i
wrote all this. I have updated the image and am gonna force-push a fix
in a sec.

~mkalte

demo/src/plot_demo.rs

@@ -563,6 +563,10 @@ impl CustomAxesDemo {
         ui.label("Zoom in on the X-axis to see hours and minutes");
 
         let x_axes = vec![
+            AxisHints::new_x()
+                .label("Time")
+                .formatter(time_formatter)
+                .placement(egui_plot::VPlacement::Top),
             AxisHints::new_x().label("Time").formatter(time_formatter),
             AxisHints::new_x().label("Value"),
         ];

egui_plot/src/axis.rs

@@ -258,7 +258,7 @@ impl<'a> AxisWidget<'a> {
 
         let visuals = ui.style().visuals.clone();
 
-        {
+        let text_thickness = {
             let text = self.hints.label;
             let galley = text.into_galley(
                 ui,
@@ -274,46 +274,60 @@ impl<'a> AxisWidget<'a> {
                 Axis::Y => -std::f32::consts::TAU * 0.25,
             };
             // select text_pos and angle depending on placement and orientation of widget
-            let text_pos = match self.hints.placement {
+            let (text_pos, text_thickness) = match self.hints.placement {
                 Placement::LeftBottom => match axis {
                     Axis::X => {
                         let pos = response.rect.center_bottom();
-                        Pos2 {
-                            x: pos.x - galley.size().x / 2.0,
-                            y: pos.y - galley.size().y * 1.25,
-                        }
+                        (
+                            Pos2 {
+                                x: pos.x - galley.size().x / 2.0,
+                                y: pos.y - galley.size().y * 1.25,
+                            },
+                            0.0,
+                        )
                     }
                     Axis::Y => {
                         let pos = response.rect.left_center();
-                        Pos2 {
-                            x: pos.x,
-                            y: pos.y + galley.size().x / 2.0,
-                        }
+                        (
+                            Pos2 {
+                                x: pos.x,
+                                y: pos.y + galley.size().x / 2.0,
+                            },
+                            galley.size().x * 0.5,
+                        )
                     }
                 },
                 Placement::RightTop => match axis {
                     Axis::X => {
                         let pos = response.rect.center_top();
-                        Pos2 {
-                            x: pos.x - galley.size().x / 2.0,
-                            y: pos.y + galley.size().y * 0.25,
-                        }
+                        (
+                            Pos2 {
+                                x: pos.x - galley.size().x / 2.0,
+                                y: pos.y + galley.size().y * 0.25,
+                            },
+                            0.0,
+                        )
                     }
                     Axis::Y => {
                         let pos = response.rect.right_center();
-                        Pos2 {
-                            x: pos.x - galley.size().y * 1.5,
-                            y: pos.y + galley.size().x / 2.0,
-                        }
+                        (
+                            Pos2 {
+                                x: pos.x - galley.size().y * 1.5,
+                                y: pos.y + galley.size().x / 2.0,
+                            },
+                            galley.size().x * 0.75,
+                        )
                     }
                 },
             };
 
             ui.painter()
                 .add(TextShape::new(text_pos, galley, text_color).with_angle(angle));
-        }
 
-        (response, thickness)
+            text_thickness
+        };
+
+        (response, thickness + text_thickness)
     }
 
     /// Add tick labels to the axis. Returns the thickness of the axis.