Added fields to customize border color and device name color

packages/golden_toolkit/lib/src/device_builder.dart

@@ -43,6 +43,8 @@ class DeviceBuilder {
   DeviceBuilder({
     this.wrap,
     this.bgColor,
+    this.nameTextColor,
+    this.lineColor,
   });
 
   /// Can be used to wrap all scenario widgets. Useful if you wish to
@@ -52,6 +54,12 @@ class DeviceBuilder {
   ///  background [bgColor] color of output .png file
   final Color? bgColor;
 
+  ///  [textNameColor] color of device name
+  final Color? nameTextColor;
+
+  ///  [lineColor] color line around device
+  final Color? lineColor;
+
   /// list of created DeviceScenarios for each device type
   final List<DeviceScenario> scenarios = [];
 
@@ -92,6 +100,8 @@ class DeviceBuilder {
             widget: widget,
             wrap: wrap,
             name: scenarioName,
+            nameTextColor: nameTextColor,
+            lineColor: lineColor,
           ),
         ),
       );
@@ -160,12 +170,16 @@ class DeviceScenarioWidget extends StatelessWidget {
     required this.widget,
     this.wrap,
     this.name,
+    this.nameTextColor,
+    this.lineColor,
   }) : super(key: key);
 
   final WidgetWrapper? wrap;
   final Device device;
   final Widget widget;
   final String? name;
+  final Color? nameTextColor;
+  final Color? lineColor;
 
   static const double _horizontalScenarioPadding = 8.0;
   static const double _borderWidth = 1.0;
@@ -208,7 +222,7 @@ class DeviceScenarioWidget extends StatelessWidget {
           decoration: BoxDecoration(
               border: Border.all(
             width: 1,
-            color: Colors.lightBlue,
+            color: lineColor ?? Colors.lightBlue,
           )),
           child: Column(
             crossAxisAlignment: CrossAxisAlignment.start,
@@ -221,8 +235,9 @@ class DeviceScenarioWidget extends StatelessWidget {
                   name ?? device.name,
                   maxLines: 1,
                   overflow: TextOverflow.ellipsis,
-                  style: const TextStyle(
-                    fontSize: 18,
+                  style: TextStyle(
+                    fontSize: 16,
+                    color: nameTextColor,
                   ),
                 ),
               ),

packages/golden_toolkit/lib/src/golden_builder.dart

@@ -28,12 +28,14 @@ class GoldenBuilder {
     required double widthToHeightRatio,
     WidgetWrapper? wrap,
     Color? bgColor,
+    Color? nameTextColor,
   }) {
     return GoldenBuilder._(
       columns: columns,
       widthToHeightRatio: widthToHeightRatio,
       wrap: wrap,
       bgColor: bgColor,
+      nameTextColor: nameTextColor,
     );
   }
 
@@ -45,11 +47,13 @@ class GoldenBuilder {
   ///
   factory GoldenBuilder.column({
     Color? bgColor,
+    Color? nameTextColor,
     WidgetWrapper? wrap,
   }) {
     return GoldenBuilder._(
       wrap: wrap,
       bgColor: bgColor,
+      nameTextColor: nameTextColor,
     );
   }
 
@@ -58,6 +62,7 @@ class GoldenBuilder {
     this.widthToHeightRatio = 1.0,
     this.wrap,
     this.bgColor,
+    this.nameTextColor,
   });
 
   /// Can be used to wrap all scenario widgets. Useful if you wish to
@@ -70,6 +75,9 @@ class GoldenBuilder {
   ///  background [bgColor] color of output .png file
   final Color? bgColor;
 
+  ///  [textNameColor] color of device name
+  final Color? nameTextColor;
+
   ///  [widthToHeightRatio]  grid layout
   final double widthToHeightRatio;
 
@@ -96,6 +104,7 @@ class GoldenBuilder {
       name: name,
       widget: widget,
       wrap: wrap,
+      nameTextColor: nameTextColor,
     ));
   }
 
@@ -149,12 +158,16 @@ class _Scenario extends StatelessWidget {
     required this.name,
     required this.widget,
     this.wrap,
+    this.nameTextColor,
   }) : super(key: key);
 
   final WidgetWrapper? wrap;
   final String name;
   final Widget widget;
 
+  ///  [textNameColor] color of device name
+  final Color? nameTextColor;
+
   @override
   Widget build(BuildContext context) {
     return Padding(
@@ -163,7 +176,7 @@ class _Scenario extends StatelessWidget {
         crossAxisAlignment: CrossAxisAlignment.start,
         mainAxisSize: MainAxisSize.min,
         children: [
-          Text(name, style: const TextStyle(fontSize: 18)),
+          Text(name, style: TextStyle(fontSize: 18, color: nameTextColor)),
           const SizedBox(height: 4),
           wrap?.call(widget) ?? widget,
         ],