From 49a1dac2c97695d4830a19586b91e8ee320eddee Mon Sep 17 00:00:00 2001
From: Jaanus Sellin <sellinjaanus@gmail.com>
Date: Thu, 10 Apr 2025 11:20:02 +0300
Subject: [PATCH] feat: targeting info box new styling (#9740)

Updated styling of info box


![image](https://github.com/user-attachments/assets/983339b7-102d-440e-a937-4972d04496c9)
---
 .../FeatureStrategyForm/FeatureStrategyForm.tsx          | 9 ++-------
 1 file changed, 2 insertions(+), 7 deletions(-)

diff --git a/frontend/src/component/feature/FeatureStrategy/FeatureStrategyForm/FeatureStrategyForm.tsx b/frontend/src/component/feature/FeatureStrategy/FeatureStrategyForm/FeatureStrategyForm.tsx
index cd5a76c5f4..0929d6ae11 100644
--- a/frontend/src/component/feature/FeatureStrategy/FeatureStrategyForm/FeatureStrategyForm.tsx
+++ b/frontend/src/component/feature/FeatureStrategy/FeatureStrategyForm/FeatureStrategyForm.tsx
@@ -126,11 +126,6 @@ const StyledDivider = styled(Divider)(({ theme }) => ({
     width: '100%',
 }));
 
-const StyledTargetingHeader = styled('div')(({ theme }) => ({
-    color: theme.palette.text.secondary,
-    marginTop: theme.spacing(1.5),
-}));
-
 const StyledHeaderBox = styled(Box)(({ theme }) => ({
     display: 'flex',
     alignItems: 'center',
@@ -497,12 +492,12 @@ export const FeatureStrategyForm = ({
                     condition={tab === 1}
                     show={
                         <>
-                            <StyledTargetingHeader>
+                            <Alert severity='info' sx={{ mb: 2 }} icon={false}>
                                 Segmentation and constraints allow you to set
                                 filters on your strategies, so that they will
                                 only be evaluated for users and applications
                                 that match the specified preconditions.
-                            </StyledTargetingHeader>
+                            </Alert>
                             <FeatureStrategySegment
                                 segments={segments}
                                 setSegments={setSegments}