From 6fd2ee9d5c85b6df6f6b4cd59096090d76b88459 Mon Sep 17 00:00:00 2001
From: Arnaud <arnaud@status.im>
Date: Tue, 26 Nov 2024 18:28:57 +0100
Subject: [PATCH] Fix input group background

---
 package-lock.json                        | 4 ++--
 package.json                             | 2 +-
 src/components/Input/input.css           | 2 +-
 src/components/InputGroup/inputGroup.css | 7 +++++++
 4 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index a23be09..77edec6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@codex-storage/marketplace-ui-components",
-  "version": "0.0.49",
+  "version": "0.0.50",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@codex-storage/marketplace-ui-components",
-      "version": "0.0.49",
+      "version": "0.0.50",
       "license": "MIT",
       "devDependencies": {
         "@codex-storage/sdk-js": "^0.0.15",
diff --git a/package.json b/package.json
index 44bb7c0..9c38eb5 100644
--- a/package.json
+++ b/package.json
@@ -5,7 +5,7 @@
     "type": "git",
     "url": "https://github.com/codex-storage/codex-marketplace-ui-components"
   },
-  "version": "0.0.49",
+  "version": "0.0.50",
   "type": "module",
   "scripts": {
     "prepack": "npm run build",
diff --git a/src/components/Input/input.css b/src/components/Input/input.css
index cf04aad..e076075 100644
--- a/src/components/Input/input.css
+++ b/src/components/Input/input.css
@@ -6,7 +6,7 @@
 
 @property --codex-input-background-color {
   syntax: "<color>";
-  inherits: false;
+  inherits: true;
   initial-value: rgba(20, 20, 20, 0.6);
 }
 
diff --git a/src/components/InputGroup/inputGroup.css b/src/components/InputGroup/inputGroup.css
index ec6a744..91668f4 100644
--- a/src/components/InputGroup/inputGroup.css
+++ b/src/components/InputGroup/inputGroup.css
@@ -10,6 +10,12 @@
   initial-value: rgba(150, 150, 150, 0.2);
 }
 
+@property --codex-input-group-background-color {
+  syntax: "<color>";
+  inherits: true;
+  initial-value: rgba(20, 20, 20, 0.6);
+}
+
 .input-group {
   box-sizing: border-box;
 
@@ -38,6 +44,7 @@
         border-bottom-right-radius: var(--codex-input-group-border-radius);
         height: 64px;
         box-sizing: border-box;
+        background-color: var(--codex-input-group-background-color);
 
         select {
           border-top-left-radius: 0;