From b58c88a425d87900bc82c4374414878af16a30a1 Mon Sep 17 00:00:00 2001
From: Steve Ross <steve.ds.ross@gmail.com>
Date: Sun, 4 Jan 2026 17:59:01 +0000
Subject: [PATCH] background tint no longer requires background image

---
 .../js/blocks/components/BlockSettings.jsx    | 27 ++++++++++---------
 1 file changed, 15 insertions(+), 12 deletions(-)

diff --git a/resources/js/blocks/components/BlockSettings.jsx b/resources/js/blocks/components/BlockSettings.jsx
index 91a1c84..824cc1c 100644
--- a/resources/js/blocks/components/BlockSettings.jsx
+++ b/resources/js/blocks/components/BlockSettings.jsx
@@ -85,6 +85,7 @@ export default function BlockSettings({ attributes, setAttributes }) {
 		background_hex,
 		background_tint,
 		background_image,
+    background_url,
 		background_opacity,
 		background_contrast,
 		background_fixed,
@@ -156,24 +157,26 @@ export default function BlockSettings({ attributes, setAttributes }) {
             />
 
             { 'background_colour' in attributes && attributes.background_colour && ![0, '0', 'white', 'black'].includes(attributes.background_colour) ? (
-              <SelectControl
-                label={ __("Background Tint", "badegg") }
-                value={ background_tint }
-                options={ configOptions.tints }
-                onChange={ (value) => setAttributes({ background_tint: value }) }
-                __next40pxDefaultSize={ true }
-                __nextHasNoMarginBottom={ true }
-              />
-            ) : null }
-
-            { background_image != 0 && (
               <>
+                <SelectControl
+                  label={ __("Background Tint", "badegg") }
+                  value={ background_tint }
+                  options={ configOptions.tints }
+                  onChange={ (value) => setAttributes({ background_tint: value }) }
+                  __next40pxDefaultSize={ true }
+                  __nextHasNoMarginBottom={ true }
+                />
                 <ToggleControl
                   label={ __('Text Contrast', 'badegg') }
                   checked={ background_contrast }
                   onChange={(value) => setAttributes({ background_contrast: value }) }
                   __nextHasNoMarginBottom
                 />
+              </>
+            ) : null }
+
+            { background_image != 0 && (
+              <>
                 <ToggleControl
                   label={ __('Fixed Position', 'badegg') }
                   checked={ background_fixed }
@@ -216,7 +219,7 @@ export default function BlockSettings({ attributes, setAttributes }) {
 
               { background_image != 0 && (
                 <Button
-                  onClick={ () => setAttributes({ background_image: 0 }) }
+                  onClick={ () => setAttributes({ background_image: 0, background_url: '' }) }
                   isDestructive
                   variant="secondary"
                 >