diff --git a/webapp/channels/src/components/global_header/right_controls/right_controls.tsx b/webapp/channels/src/components/global_header/right_controls/right_controls.tsx index 1bd6d625a4..defe1f7a5a 100644 --- a/webapp/channels/src/components/global_header/right_controls/right_controls.tsx +++ b/webapp/channels/src/components/global_header/right_controls/right_controls.tsx @@ -40,6 +40,16 @@ const RightControlsContainer = styled.div` } `; +const StyledCustomizeYourExperienceTour = styled.div` + display: flex; + align-items: center; + height: 100% +`; + +const StyledStatusDropdown = styled.div` + margin-left: 8px; +`; + export type Props = { productId?: ProductIdentifier; } @@ -60,8 +70,6 @@ const RightControls = ({productId = null}: Props): JSX.Element => { <> - - {showCustomizeTip && } ) : ( { pluggableId={productId} /> )} - + + { + isChannels(productId) ? ( + <> + + {showCustomizeTip && } + + ) : null + } + + + + ); }; diff --git a/webapp/channels/src/components/tours/onboarding_tour/customize_your_experience_tour_tip.tsx b/webapp/channels/src/components/tours/onboarding_tour/customize_your_experience_tour_tip.tsx index ddd8de690f..55a7ecdbe8 100644 --- a/webapp/channels/src/components/tours/onboarding_tour/customize_your_experience_tour_tip.tsx +++ b/webapp/channels/src/components/tours/onboarding_tour/customize_your_experience_tour_tip.tsx @@ -29,7 +29,7 @@ export const CustomizeYourExperienceTour = () => {

); - const overlayPunchOut = useMeasurePunchouts(['RightControlsContainer'], [], {y: 6, height: -6, x: 64, width: 0}); + const overlayPunchOut = useMeasurePunchouts(['CustomizeYourExperienceTour'], []); return (