import styled from 'styled-components/native';
import { Pressable } from '../Pressable';
import { RSValue } from '../RFValue';

export const Container = styled.View`
   border-bottom-right-radius: 0px;
   border-bottom-left-radius: 0px;
` as any;

export const NavBarStyle = styled.View<any>`
   align-content: center;
   justify-content: center;
   flex-direction: row;
   height: ${RSValue(55)}px;
   background: ${(props) => props.background || props.theme?.navigationBar?.backgroundColor || 'black'};
`;

export const MenuContainer = styled(Pressable)`
   justify-content: center;
   padding: 0px ${RSValue(15)}px;
` as any;

export const ActionButton = styled(Pressable)`
   justify-content: center;
   padding: 0px ${RSValue(13)}px;
` as any;

export const TitleContainer = styled.View`
   flex: 1;
   justify-content: center;
   padding: 0px 5px;
` as any;

export const ActionsRightContainer = styled.View`
   justify-content: center;
   flex-direction: row;
   padding-right: ${RSValue(8)}px;
` as any;

export const BorderContainer = styled.View`
   background: #f0f1f6;
   height: 0px;
   border-top-right-radius: 100px;
   border-top-left-radius: 100px;
` as any;

export const TabsSpace = styled.View`
   padding: 0px 0px;
   height: 35px;
` as any;
