import { RFValue } from 'react-native-responsive-fontsize';
import styled from 'styled-components/native';
import { themeDefault } from '../../AppProvider/ITheme';
import { Pressable } from '../../Pressable';
import { RSValue } from '../../RFValue';
import { TextNative } from '../../TextNative';

export const Container = styled.View``;

export const FiltersBtn = styled(TextNative)`
   align-self: center;
   justify-content: center;
   padding-right: 10px;
`;

export const Tag = styled(Pressable)<any>`
   background: #fff;
   border-radius: 100px;
   background: ${(props) => props.theme.primary || themeDefault.primary};
   height: ${RSValue(25)}px;
   position: relative;
   padding: 0 ${RSValue(15)}px;
   font-weight: 600;
   margin-right: ${RSValue(5)}px;
   align-items: center;
   justify-content: center;
   flex-direction: row;
`;

export const Close = styled(TextNative)`
   color: white;
   padding: 0px 0px 0px ${RSValue(12)}px;
   font-size: ${RFValue(16)}px;
   line-height: ${RFValue(27)}px;
`;
