Improve sample block title style

sampler/src/main/java/atlantafx/sampler/page/SampleBlock.java

@@ -1,10 +1,12 @@
 /* SPDX-License-Identifier: MIT */
 package atlantafx.sampler.page;
 
+import javafx.geometry.Insets;
 import javafx.scene.Node;
 import javafx.scene.control.Label;
 import javafx.scene.layout.Priority;
 import javafx.scene.layout.VBox;
+import javafx.scene.shape.Polygon;
 import javafx.scene.text.Text;
 import javafx.scene.text.TextFlow;
 import net.datafaker.Faker;
@@ -31,12 +33,19 @@ public class SampleBlock extends VBox {
 
     public SampleBlock(String title, Node content, String description) {
         titleLabel = new Label(Objects.requireNonNull(title));
-        titleLabel.getStyleClass().add("title");
+
+        Polygon polygon = new Polygon();
+        polygon.getPoints().addAll(0.0, 0.0, 20.0, 10.0, 20.0, 0.0);
+        polygon.getStyleClass().add("polygon");
+
+        var titleBox = new VBox(titleLabel, polygon);
+        titleBox.getStyleClass().add("title");
+        VBox.setMargin(titleBox, new Insets(-5, 0, 0, -40));
 
         this.content = Objects.requireNonNull(content);
         content.getStyleClass().add("content");
 
-        getChildren().setAll(titleLabel, content);
+        getChildren().setAll(titleBox, content);
         if (description != null && !description.isBlank()) {
             descriptionText = new TextFlow(new Text(description));
             getChildren().add(descriptionText);

sampler/src/main/resources/assets/styles/scss/layout/_page.scss

@@ -35,12 +35,20 @@
   -fx-effect: dropshadow(gaussian, -color-shadow-default, 10, 0.4, 0, 0);
   -fx-border-color: -color-border-muted;
   -fx-border-width: 1px;
-  -fx-padding: 1em 1.5em 1.5em 1.5em;
-  -fx-spacing: 1em;
+  -fx-padding: 15px 20px 15px 20px;
+  -fx-spacing: 20px;
   -fx-min-width: 220px;
 
   >.title {
-    -fx-font-weight: bold;
-    -fx-padding: 0 0 10px 0;
+    >.label {
+      -fx-padding: 5px 15px 5px 10px;
+      -fx-background-color: -color-accent-subtle;
+      -fx-text-fill: -color-fg-default;
+      -fx-font-size: 1.1em;
+    }
+
+    >.polygon {
+      -fx-fill: -color-accent-muted;
+    }
   }
-}
+}