Ensure editable content fields are transparent in the editor

#8359 #7007

assets/js/blocks/cart/inner-blocks/cart-order-summary-heading/edit.tsx

@@ -37,6 +37,7 @@ export const Edit = ( {
 					onChange={ ( value ) =>
 						setAttributes( { content: value } )
 					}
+					style={ { backgroundColor: 'transparent' } }
 				/>
 			</Title>
 		</div>

assets/js/blocks/checkout/form-step/form-step-block.tsx

@@ -66,6 +66,7 @@ export const FormStepBlock = ( {
 					className={ '' }
 					value={ title }
 					onChange={ ( value ) => setAttributes( { title: value } ) }
+					style={ { backgroundColor: 'transparent' } }
 				/>
 			</FormStepHeading>
 			<div className="wc-block-components-checkout-step__container">
@@ -86,6 +87,7 @@ export const FormStepBlock = ( {
 								description: value,
 							} )
 						}
+						style={ { backgroundColor: 'transparent' } }
 					/>
 				</p>
 				<div className="wc-block-components-checkout-step__content">

assets/js/blocks/product-search/edit.js

@@ -86,6 +86,7 @@ const Edit = ( {
 							onChange={ ( value ) =>
 								setAttributes( { label: value } )
 							}
+							style={ { backgroundColor: 'transparent' } }
 						/>
 					</>
 				) }

assets/js/editor-components/block-title/index.js

@@ -32,6 +32,7 @@ const BlockTitle = ( {
 				className="wc-block-editor-components-title"
 				value={ heading }
 				onChange={ onChange }
+				style={ { backgroundColor: 'transparent' } }
 			/>
 		</TagName>
 	);