Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
const AVATAR_SIZE = 40;
const AVATAR_RADIUS = AVATAR_SIZE / 2;
const Root = styled.View`
height: 50;
flexDirection: row;
alignItems: center;
`;
const AvatarContainer = styled.View`
flex: 0.2;
justifyContent: center;
alignSelf: stretch;
`;
const Avatar = styled.Image`
height: ${AVATAR_SIZE};
width: ${AVATAR_SIZE};
borderRadius: ${AVATAR_RADIUS};
`;
const MetaContainer = styled.View`
flex: 1;
alignSelf: stretch;
`;
const MetaTopContainer = styled.View`
flex: 1;
alignSelf: stretch;
flexDirection: row;
alignItems: center;
justifyContent: flex-start;
const Header = styled.View`
margin-top: 10;
flex-direction: row;
align-items: center;
justify-content: space-between;
z-index: 1000;
`;
const HeaderButton = styled.TouchableOpacity`
align-items: center;
justify-content: center;
z-index: 1000;
margin-top: 10;
`;
const CloseIcon = styled.Image.attrs({
source: IMAGES.ARROW,
})`
width: 30;
height: 24;
tint-color: white;
`;
const EditIcon = styled.Image.attrs({
source: IMAGES.EDIT,
})`
width: 26;
height: 26;
tint-color: white;
`;
const EventName = styled.Text`
background-color: #fff;
width: 100%;
flex-direction: row;
justify-content: space-around;
padding: 8px 8px 32px;
border-top-color: #d7d7d7;
border-top-width: 1px;
`;
export const TabItem = styled.TouchableOpacity`
width: 80px;
height: 40px;
align-items: center;
`;
export const TabIcon = styled.Image`
width: 24px;
height: 24px;
margin-bottom: 8px;
`;
horizontal: true,
})`
background-color: #fff;
padding-bottom: 24px;
`;
export const PromoSliderItem = styled.View`
border: 1px solid #ddd;
border-bottom-width: 3px;
border-radius: 4px;
width: 180px;
overflow: hidden;
margin-right: 10px;
`;
export const PromoSliderImage = styled.Image`
width: 100%;
height: 140px;
`;
export const PromoSliderTitle = styled.View`
padding: 12px;
flex: 1;
`;
export const PromoSliderFooter = styled.View`
padding: 8px 12px 12px;
flex-direction: row;
align-items: center;
`;
export const SeeMoreButton = styled.TouchableOpacity`
export const Input = styled(BaseInput).attrs({
returnKeyType: 'search',
autoCorrect: false,
autoCapitalize: 'none',
includeFontPadding: false,
enablesReturnKeyAutomatically: false
})`
font-size: ${fontSize.sub}px;
flex: 1;
padding-horizontal: ${paddingHorizontal}px;
padding-vertical: 0;
text-align-vertical: center;
`
export const Icon = styled.Image.attrs({
fadeDuration:0
})`
tint-color: ${themed.tintColor};
`
export const Button = styled.TouchableOpacity`
width: ${height-horizontalGap}px;
align-items: center;
justify-content: center;
z-index: 1;
`
import React from "react"
import styled from "styled-components/native"
import { height, position, space, textAlign, width } from "styled-system"
import { HeightProps, SpaceProps, TextAlignProps, WidthProps } from "./types"
interface IconProps extends SpaceProps, WidthProps, HeightProps, SpaceProps, TextAlignProps {}
const StyledImage = styled.Image.attrs({})`
${height};
${position};
${space};
${textAlign};
${width};
`
export const Image = props =>
export const GotoActionText = styled.Text.attrs({
numberOfLines: 1,
ellipsizeMode: 'head'
})`
max-width: 40%;
font-size: ${fontSize.micro}px;
color: ${themed.invertedMedium};
padding-right: ${paddingRight}px;
`
export const GotoImageView = styled.View`
margin-right: ${paddingHorizontal - 2}px;
`
export const GotoIcon = styled.Image`
tint-color: ${themed.tintColor};
`
color: white;
text-align: center;
`;
export const ProductSubtitle = Styled.Text`
font-size: 24;
text-align: center;
padding-left: 50;
padding-right: 50;
`;
export const ProductSquare = Styled.View`
align-self: center;
`;
export const ProductImage = Styled.Image`
width: ${Dimensions.get("window").width / 3 - 50};
height: ${Dimensions.get("window").width / 3 - 50};
margin: 25;
`;
export const ProductBody = Styled.Text`
font-size: 18;
text-align: center;
padding-left: 50;
padding-right: 50;
`;