From 7efbdaf03d800f9e5d61d17ff5407bb96dbfdf5c Mon Sep 17 00:00:00 2001
From: Marcin Orlowski <MarcinOrlowski@users.noreply.github.com>
Date: Tue, 30 Dec 2025 15:12:23 +0100
Subject: [PATCH 1/2] #35 Add customizable background colors for breathing
 stripes

---
 CHANGES.md                         |  1 +
 README.md                          |  9 +++++++++
 Resources/public/devbar.css        | 10 +++++-----
 Resources/views/devbar.html.twig   |  2 +-
 src/Dto/DiscoDevBarData.php        |  6 +++++-
 src/Service/DiscoDevBarService.php | 17 +++++++++++++++--
 6 files changed, 36 insertions(+), 9 deletions(-)

diff --git a/CHANGES.md b/CHANGES.md
index 2e3d530..4ca1e0d 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -2,6 +2,7 @@
 
 ## 1.5.2 (2025-12-12)
 
+- [#035] Added customizable background colors for breathing stripes
 - [#033] Added close widget type to dismiss devbar
 - [#027] Devbar template now includes its own CSS for self-contained styling
 - [#029] Normalized uses CSS styles in both views
diff --git a/README.md b/README.md
index 1483bf3..57d63dc 100644
--- a/README.md
+++ b/README.md
@@ -208,6 +208,15 @@ Include the devbar template in your base layout:
 
 ## Customization
 
+### Background Colors
+
+Customize the breathing stripes background colors in your `.disco-devbar.yaml`:
+
+```yaml
+bg_color_light: '#b71c1c'
+bg_color_dark: '#8e0000'
+```
+
 ### Custom CSS
 
 The bundle includes default styling. To customize, override the CSS after importing bundle assets or
diff --git a/Resources/public/devbar.css b/Resources/public/devbar.css
index 84a2223..245bab0 100644
--- a/Resources/public/devbar.css
+++ b/Resources/public/devbar.css
@@ -5,7 +5,7 @@
     left: 0;
     right: 0;
     z-index: 1001; /* Higher than top-nav (1000) to ensure it's above */
-    background: #8e0000;
+    background: var(--bg-color-dark, #8e0000);
     color: white;
     font-size: 15px;
     overflow: hidden;
@@ -17,10 +17,10 @@
     inset: 0;
     background: repeating-linear-gradient(
         45deg,
-        #b71c1c,
-        #b71c1c 10px,
-        #8e0000 10px,
-        #8e0000 20px
+        var(--bg-color-light, #b71c1c),
+        var(--bg-color-light, #b71c1c) 10px,
+        var(--bg-color-dark, #8e0000) 10px,
+        var(--bg-color-dark, #8e0000) 20px
     );
     animation: breathe 6s ease-in-out infinite;
 }
diff --git a/Resources/views/devbar.html.twig b/Resources/views/devbar.html.twig
index 2b9d2e9..b8b4625 100644
--- a/Resources/views/devbar.html.twig
+++ b/Resources/views/devbar.html.twig
@@ -10,7 +10,7 @@
   crossorigin="anonymous"
   referrerpolicy="no-referrer" />
 
-<div class="disco-devbar{% if banner_data.hasError %} disco-devbar-error{% endif %}">
+<div class="disco-devbar{% if banner_data.hasError %} disco-devbar-error{% endif %}" style="--bg-color-light: {{ banner_data.bgColorLight }}; --bg-color-dark: {{ banner_data.bgColorDark }}">
     <div class="disco-devbar-content">
         {% if banner_data.hasError %}
             <div class="disco-devbar-container-left">
diff --git a/src/Dto/DiscoDevBarData.php b/src/Dto/DiscoDevBarData.php
index f1cb501..23dc177 100644
--- a/src/Dto/DiscoDevBarData.php
+++ b/src/Dto/DiscoDevBarData.php
@@ -32,6 +32,8 @@ class DiscoDevBarData
      * @param string|null   $version             Bundle version (null shows as N/A)
      * @param bool          $fontAwesomeEnabled  Whether to auto-include Font Awesome
      * @param string        $fontAwesomeVersion  Font Awesome version to use
+     * @param string        $bgColorLight        Light stripe color for background gradient
+     * @param string        $bgColorDark         Dark stripe color for background gradient
      */
     public function __construct(
         public readonly array $left,
@@ -42,7 +44,9 @@ public function __construct(
         public readonly string $errorMessage = '',
         public readonly ?string $version = null,
         public readonly bool $fontAwesomeEnabled = false,
-        public readonly string $fontAwesomeVersion = '6.5.1'
+        public readonly string $fontAwesomeVersion = '6.5.1',
+        public readonly string $bgColorLight = '#b71c1c',
+        public readonly string $bgColorDark = '#8e0000'
     ) {
     }
 }
diff --git a/src/Service/DiscoDevBarService.php b/src/Service/DiscoDevBarService.php
index 25969ec..f0113d3 100644
--- a/src/Service/DiscoDevBarService.php
+++ b/src/Service/DiscoDevBarService.php
@@ -41,6 +41,12 @@ class DiscoDevBarService
      */
     private const DEFAULT_FONT_AWESOME_VERSION = '6.5.1';
 
+    /**
+     * Default background colors for breathing stripes
+     */
+    private const DEFAULT_BG_COLOR_LIGHT = '#b71c1c';
+    private const DEFAULT_BG_COLOR_DARK = '#8e0000';
+
     public function __construct(
         private readonly string $projectDir
     ) {
@@ -63,7 +69,9 @@ public function getDiscoDevBarData(): DiscoDevBarData
                 errorMessage:        $errorMessage,
                 version:             $version,
                 fontAwesomeEnabled:  false,
-                fontAwesomeVersion:  self::DEFAULT_FONT_AWESOME_VERSION
+                fontAwesomeVersion:  self::DEFAULT_FONT_AWESOME_VERSION,
+                bgColorLight:        self::DEFAULT_BG_COLOR_LIGHT,
+                bgColorDark:         self::DEFAULT_BG_COLOR_DARK
             );
         }
 
@@ -99,6 +107,9 @@ public function getDiscoDevBarData(): DiscoDevBarData
         $leftWidgets = $this->loadWidgets(\is_array($left) ? $left : []);
         $rightWidgets = $this->loadWidgets(\is_array($right) ? $right : []);
 
+        $bgColorLight = $config['bg_color_light'] ?? self::DEFAULT_BG_COLOR_LIGHT;
+        $bgColorDark = $config['bg_color_dark'] ?? self::DEFAULT_BG_COLOR_DARK;
+
         return new DiscoDevBarData(
             left:                $leftWidgets,
             right:               $rightWidgets,
@@ -108,7 +119,9 @@ public function getDiscoDevBarData(): DiscoDevBarData
             errorMessage:        '',
             version:             $version,
             fontAwesomeEnabled:  \is_bool($fontAwesomeEnabled) ? $fontAwesomeEnabled : false,
-            fontAwesomeVersion:  $fontAwesomeVersion
+            fontAwesomeVersion:  $fontAwesomeVersion,
+            bgColorLight:        \is_string($bgColorLight) ? $bgColorLight : self::DEFAULT_BG_COLOR_LIGHT,
+            bgColorDark:         \is_string($bgColorDark) ? $bgColorDark : self::DEFAULT_BG_COLOR_DARK
         );
     }
 

From adc5d04c49588712523563744543eb57fe608a17 Mon Sep 17 00:00:00 2001
From: Marcin Orlowski <MarcinOrlowski@users.noreply.github.com>
Date: Tue, 30 Dec 2025 15:13:30 +0100
Subject: [PATCH 2/2] #35 Fix changelog version

---
 CHANGES.md | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/CHANGES.md b/CHANGES.md
index 4ca1e0d..58cef6b 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -1,9 +1,12 @@
 # Changelog
 
-## 1.5.2 (2025-12-12)
+## 1.6.0 (TBD)
 
 - [#035] Added customizable background colors for breathing stripes
 - [#033] Added close widget type to dismiss devbar
+
+## 1.5.2 (2025-12-12)
+
 - [#027] Devbar template now includes its own CSS for self-contained styling
 - [#029] Normalized uses CSS styles in both views