Стилизация div с использованием style.div
работает просто отлично.
Но стилизация стилизованного компонента с использованием style(FlexItem)
ничего не делает.
В чем может быть причина?
import * as React from 'react';
import OuterSectionContainer from './../../ui/OuterSectionContainer';
import InnerSectionContainer from './../../ui/OuterSectionContainer/InnerSectionContainer';
import FlexContainer from './../../ui/OuterSectionContainer/InnerSectionContainer/FlexContainer';
import FlexItem from './../../ui/OuterSectionContainer/InnerSectionContainer/FlexContainer/FlexItem';
import ScaledImage from './../../ui/ScaledImage';
import styled from 'styled-components';
const Testamonials = () => {
const FlexItemStyled = styled(FlexItem)`
padding: 10px;
background-color: red;
display: none;
`;
return (
<OuterSectionContainer>
<InnerSectionContainer>
<FlexContainer>
<FlexItemStyled>
<ScaledImage src={require('../../../images/logo.png')} />
</FlexItemStyled>
<FlexItemStyled>
<ScaledImage src={require('../../../images/logo.png')} />
</FlexItemStyled>
<FlexItemStyled>
<ScaledImage src={require('../../../images/logo.png')} />
</FlexItemStyled>
<FlexItemStyled>
<ScaledImage src={require('../../../images/logo.png')} />
</FlexItemStyled>
</FlexContainer>
</InnerSectionContainer>
</OuterSectionContainer>
);
};
export default Testamonials;