742 lines
14 KiB
TypeScript
742 lines
14 KiB
TypeScript
import { colors } from '@/assets/styles/colors';
|
|
import { fonts } from '@/assets/styles/fonts';
|
|
import { StyleSheet } from 'react-native';
|
|
|
|
export default StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
backgroundColor: colors.background_1,
|
|
},
|
|
header: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
paddingHorizontal: 16,
|
|
paddingTop: 54,
|
|
paddingBottom: 10,
|
|
gap: 10,
|
|
},
|
|
backButton: {
|
|
width: 32,
|
|
height: 32,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
},
|
|
logo: {
|
|
width: 150,
|
|
height: 34,
|
|
},
|
|
centered: {
|
|
flex: 1,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
},
|
|
content: {
|
|
paddingHorizontal: 16,
|
|
paddingBottom: 120,
|
|
gap: 10,
|
|
},
|
|
errorText: {
|
|
color: colors.vermelho,
|
|
fontFamily: fonts.medium,
|
|
fontSize: 13,
|
|
marginBottom: 8,
|
|
},
|
|
summaryCard: {
|
|
backgroundColor: colors.branco,
|
|
borderRadius: 16,
|
|
padding: 12,
|
|
},
|
|
rowBetween: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
justifyContent: 'space-between',
|
|
gap: 8,
|
|
marginBottom: 6,
|
|
},
|
|
idTop: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.bold,
|
|
fontSize: 16,
|
|
marginBottom: 2,
|
|
},
|
|
idBlock: {
|
|
marginTop: 6,
|
|
flex: 1,
|
|
flexShrink: 1,
|
|
marginRight: 8,
|
|
},
|
|
statusBadge: {
|
|
flexShrink: 1,
|
|
maxWidth: '40%',
|
|
borderRadius: 12,
|
|
paddingVertical: 4,
|
|
paddingHorizontal: 6,
|
|
backgroundColor: '#E9EDF4',
|
|
},
|
|
statusBadgeContent: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
gap: 4,
|
|
flexShrink: 1,
|
|
},
|
|
statusBadgeText: {
|
|
flexShrink: 1,
|
|
fontSize: 11,
|
|
fontFamily: fonts.medium,
|
|
textAlign: 'center',
|
|
color: '#4A6592',
|
|
},
|
|
statusSuccess: {
|
|
backgroundColor: '#D8FFE3',
|
|
},
|
|
statusDanger: {
|
|
backgroundColor: '#FFE2E0',
|
|
},
|
|
statusInfo: {
|
|
backgroundColor: '#F3DBFF',
|
|
},
|
|
statusPendente: {
|
|
backgroundColor: '#FFF6D9',
|
|
},
|
|
statusTextSuccess: {
|
|
color: '#13AE45',
|
|
},
|
|
statusTextDanger: {
|
|
color: '#E6463B',
|
|
},
|
|
statusTextInfo: {
|
|
color: '#B138E6',
|
|
},
|
|
statusTextPendente: {
|
|
color: '#C99700',
|
|
},
|
|
summaryImage: {
|
|
width: '100%',
|
|
height: 180,
|
|
borderRadius: 12,
|
|
marginBottom: 8,
|
|
backgroundColor: '#E7ECF4',
|
|
},
|
|
destination: {
|
|
marginTop: 16,
|
|
color: colors.azul,
|
|
fontFamily: fonts.bold,
|
|
fontSize: 24,
|
|
marginBottom: 2,
|
|
},
|
|
dateText: {
|
|
color: '#4A6592',
|
|
fontFamily: fonts.regular,
|
|
fontSize: 12,
|
|
marginBottom: 8,
|
|
},
|
|
refsRow: {
|
|
flexDirection: 'row',
|
|
justifyContent: 'space-between',
|
|
marginBottom: 8,
|
|
},
|
|
smallLabel: {
|
|
color: '#4A6592',
|
|
fontFamily: fonts.regular,
|
|
fontSize: 11,
|
|
},
|
|
smallValue: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.medium,
|
|
fontSize: 14,
|
|
},
|
|
priceRow: {
|
|
flexDirection: 'row',
|
|
justifyContent: 'space-between',
|
|
backgroundColor: '#F3F6FC',
|
|
borderRadius: 10,
|
|
padding: 8,
|
|
},
|
|
priceLeft: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.bold,
|
|
fontSize: 13,
|
|
},
|
|
priceRight: {
|
|
color: '#4A6592',
|
|
fontFamily: fonts.medium,
|
|
fontSize: 13,
|
|
},
|
|
sectionHeader: {
|
|
backgroundColor: colors.branco,
|
|
borderRadius: 14,
|
|
paddingHorizontal: 12,
|
|
paddingVertical: 12,
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
justifyContent: 'space-between',
|
|
},
|
|
sectionTitle: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.bold,
|
|
fontSize: 16,
|
|
marginBottom: 10,
|
|
},
|
|
sectionBody: {
|
|
backgroundColor: colors.branco,
|
|
borderRadius: 14,
|
|
paddingHorizontal: 12,
|
|
paddingVertical: 10,
|
|
marginTop: -4,
|
|
marginBottom: 2,
|
|
gap: 8,
|
|
},
|
|
rowLine: {
|
|
flexDirection: 'row',
|
|
justifyContent: 'space-between',
|
|
alignItems: 'center',
|
|
gap: 8,
|
|
paddingBottom: 8,
|
|
},
|
|
rowLineNoBorder: {
|
|
flexDirection: 'row',
|
|
justifyContent: 'space-between',
|
|
alignItems: 'center',
|
|
gap: 8,
|
|
paddingVertical: 8,
|
|
},
|
|
rowLabel: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.medium,
|
|
fontSize: 16,
|
|
},
|
|
rowTitle: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.medium,
|
|
fontSize: 13,
|
|
flex: 1,
|
|
},
|
|
rowValue: {
|
|
color: '#4A6592',
|
|
fontFamily: fonts.light,
|
|
fontSize: 15,
|
|
textAlign: 'right',
|
|
flex: 1,
|
|
},
|
|
priceBox: {
|
|
marginTop: 6,
|
|
backgroundColor: colors.azul,
|
|
borderRadius: 12,
|
|
padding: 10,
|
|
},
|
|
priceMain: {
|
|
color: colors.branco,
|
|
fontSize: 26,
|
|
fontFamily: fonts.bold,
|
|
marginBottom: 2,
|
|
},
|
|
priceSub: {
|
|
color: colors.branco,
|
|
fontSize: 12,
|
|
fontFamily: fonts.medium,
|
|
},
|
|
empty: {
|
|
marginTop: 10,
|
|
color: '#4A6592',
|
|
fontFamily: fonts.regular,
|
|
fontSize: 12,
|
|
},
|
|
extrasList: {
|
|
gap: 10,
|
|
},
|
|
extrasItem: {
|
|
backgroundColor: colors.background_2,
|
|
borderRadius: 10,
|
|
padding: 10,
|
|
},
|
|
extrasItemText: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.regular,
|
|
fontSize: 13,
|
|
},
|
|
|
|
divider: {
|
|
height: 1,
|
|
backgroundColor: '#EDF1F7',
|
|
marginVertical: 10,
|
|
},
|
|
blockBorderTop: {
|
|
borderTopWidth: 1,
|
|
borderTopColor: '#EDF1F7',
|
|
paddingTop: 10,
|
|
marginTop: 4,
|
|
},
|
|
|
|
refsBlock: {
|
|
flexDirection: 'row',
|
|
gap: 16,
|
|
marginTop: 6,
|
|
},
|
|
refsCol: {
|
|
flex: 1,
|
|
},
|
|
|
|
hotelRow: {
|
|
flexDirection: 'row',
|
|
gap: 12,
|
|
paddingVertical: 6,
|
|
},
|
|
hotelImage: {
|
|
width: 104,
|
|
height: 126,
|
|
borderRadius: 12,
|
|
backgroundColor: '#E7ECF4',
|
|
},
|
|
hotelInfo: {
|
|
flex: 1,
|
|
justifyContent: 'center',
|
|
},
|
|
hotelStarsRow: {
|
|
flexDirection: 'row',
|
|
gap: 2,
|
|
marginBottom: 2,
|
|
},
|
|
hotelName: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.bold,
|
|
fontSize: 16,
|
|
marginBottom: 4,
|
|
},
|
|
hotelMetaLine: {
|
|
fontSize: 13,
|
|
lineHeight: 17,
|
|
marginBottom:4,
|
|
},
|
|
hotelMetaLabel: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.semiBold,
|
|
},
|
|
hotelMetaValue: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.regular,
|
|
},
|
|
|
|
vooList: {
|
|
gap: 10,
|
|
},
|
|
vooCard: {
|
|
backgroundColor: colors.background_2,
|
|
borderRadius: 14,
|
|
padding: 12,
|
|
},
|
|
vooRouteRow: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
marginBottom: 4,
|
|
},
|
|
vooSideCol: {
|
|
flex: 1,
|
|
},
|
|
vooSideColRight: {
|
|
alignItems: 'flex-end',
|
|
},
|
|
vooCode: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.medium,
|
|
fontSize: 28,
|
|
lineHeight: 32,
|
|
},
|
|
vooCodeRight: {
|
|
textAlign: 'right',
|
|
},
|
|
vooMidCol: {
|
|
alignItems: 'center',
|
|
paddingHorizontal: 8,
|
|
gap: 6,
|
|
},
|
|
vooDuration: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.regular,
|
|
fontSize: 11,
|
|
},
|
|
vooPathWrap: {
|
|
width: 140,
|
|
height: 16,
|
|
justifyContent: 'center',
|
|
alignItems: 'center',
|
|
},
|
|
vooPathLine: {
|
|
position: 'absolute',
|
|
left: 0,
|
|
right: 0,
|
|
height: 1,
|
|
backgroundColor: colors.cinza,
|
|
},
|
|
vooPathIcon: {
|
|
backgroundColor: '#EDEDED',
|
|
paddingHorizontal: 5,
|
|
},
|
|
vooTime: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.light,
|
|
fontSize: 15,
|
|
marginTop: 2,
|
|
},
|
|
vooTimeRight: {
|
|
textAlign: 'right',
|
|
},
|
|
vooAirport: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.light,
|
|
fontSize: 11,
|
|
marginTop: 2,
|
|
flexShrink: 1,
|
|
},
|
|
vooAirportRight: {
|
|
textAlign: 'right',
|
|
},
|
|
vooInfoBox: {
|
|
flexDirection: 'row',
|
|
borderWidth: 1,
|
|
borderColor: colors.cinza,
|
|
borderRadius: 10,
|
|
paddingTop: 10,
|
|
paddingBottom: 10,
|
|
paddingHorizontal: 20,
|
|
marginTop: 12,
|
|
marginBottom: 12,
|
|
gap: 8,
|
|
},
|
|
vooInfoColLeft: {
|
|
width: '50%',
|
|
flex: 1,
|
|
gap: 6,
|
|
alignItems: 'center',
|
|
justifyContent: 'space-around',
|
|
},
|
|
vooInfoColRight: {
|
|
width: '50%',
|
|
flex: 1,
|
|
gap: 6,
|
|
alignItems: 'center',
|
|
justifyContent: 'space-around',
|
|
},
|
|
vooInfoDate: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.regular,
|
|
fontSize: 14,
|
|
},
|
|
vooLegRow: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
gap: 5,
|
|
},
|
|
vooLegLabel: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.bold,
|
|
fontSize: 14,
|
|
letterSpacing: 0.3,
|
|
},
|
|
vooMetaLine: {
|
|
fontSize: 14,
|
|
lineHeight: 17,
|
|
},
|
|
vooMetaLabel: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.semiBold,
|
|
},
|
|
vooMetaValue: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.regular,
|
|
},
|
|
vooEscalasBadge: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
gap: 5,
|
|
alignSelf: 'flex-start',
|
|
backgroundColor: '#E7ECF4',
|
|
borderRadius: 8,
|
|
paddingHorizontal: 8,
|
|
paddingVertical: 4,
|
|
marginBottom: 10,
|
|
},
|
|
vooEscalasBadgeText: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.medium,
|
|
fontSize: 14,
|
|
},
|
|
vooEscalaDivider: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
gap: 8,
|
|
marginVertical: 10,
|
|
},
|
|
vooEscalaLine: {
|
|
flex: 1,
|
|
height: 1,
|
|
backgroundColor: colors.cinza,
|
|
},
|
|
vooEscalaChip: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
gap: 5,
|
|
backgroundColor: '#F0F3FA',
|
|
borderRadius: 8,
|
|
paddingHorizontal: 8,
|
|
paddingVertical: 4,
|
|
},
|
|
vooEscalaChipText: {
|
|
color: '#4A6592',
|
|
fontFamily: fonts.medium,
|
|
fontSize: 11,
|
|
},
|
|
mapaBtn: {
|
|
backgroundColor: colors.azul,
|
|
borderRadius: 10,
|
|
paddingVertical: 11,
|
|
alignItems: 'center',
|
|
flexDirection: 'row',
|
|
justifyContent: 'center',
|
|
gap: 8,
|
|
},
|
|
mapaBtnText: {
|
|
color: colors.branco,
|
|
fontFamily: fonts.medium,
|
|
fontSize: 12,
|
|
},
|
|
mapaBtnIcon: {
|
|
width: 12,
|
|
height: 12,
|
|
},
|
|
passageiroHeaderRow: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
justifyContent: 'space-between',
|
|
gap: 8,
|
|
},
|
|
passageiroContainer: {
|
|
marginVertical: 10,
|
|
},
|
|
passageiroSubtitle: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.bold,
|
|
fontSize: 14,
|
|
},
|
|
passageiroName: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.regular,
|
|
fontSize: 14,
|
|
},
|
|
passageiroBodyWrap: {
|
|
overflow: 'hidden',
|
|
},
|
|
passageiroBodyMeasure: {
|
|
position: 'absolute',
|
|
left: 0,
|
|
right: 0,
|
|
top: 0,
|
|
},
|
|
passageiroBody: {
|
|
marginTop: 10,
|
|
gap: 10,
|
|
},
|
|
twoCol: {
|
|
flexDirection: 'row',
|
|
gap: 10,
|
|
},
|
|
twoColItem: {
|
|
flex: 1,
|
|
},
|
|
fieldLabel: {
|
|
color: '#4A6592',
|
|
fontFamily: fonts.regular,
|
|
fontSize: 14,
|
|
marginBottom: 4,
|
|
},
|
|
fieldBox: {
|
|
backgroundColor: colors.background_2,
|
|
borderWidth: 1,
|
|
borderColor: colors.cinza,
|
|
borderRadius: 10,
|
|
paddingVertical: 9,
|
|
paddingHorizontal: 10,
|
|
},
|
|
fieldBoxText: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.regular,
|
|
fontSize: 13,
|
|
},
|
|
refsField: {
|
|
flex: 1,
|
|
},
|
|
|
|
extrasText: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.regular,
|
|
fontSize: 13,
|
|
lineHeight: 19,
|
|
},
|
|
|
|
tableHeader: {
|
|
flexDirection: 'row',
|
|
paddingBottom: 6,
|
|
},
|
|
tableRow: {
|
|
flexDirection: 'row',
|
|
paddingVertical: 8,
|
|
},
|
|
tableRowLast: {
|
|
borderBottomWidth: 0,
|
|
},
|
|
tableCellLeft: {
|
|
flex: 1.2,
|
|
},
|
|
tableCellMid: {
|
|
flex: 1,
|
|
alignItems: 'flex-start',
|
|
},
|
|
tableCellRight: {
|
|
flex: 1.2,
|
|
alignItems: 'flex-end',
|
|
},
|
|
tableHeaderText: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.bold,
|
|
fontSize: 14,
|
|
},
|
|
tableValueText: {
|
|
color: colors.azul,
|
|
fontFamily: fonts.medium,
|
|
fontSize: 13,
|
|
},
|
|
valorSection: {
|
|
backgroundColor: colors.branco,
|
|
borderRadius: 16,
|
|
padding: 12,
|
|
gap: 10,
|
|
},
|
|
valorInnerCard: {
|
|
backgroundColor: colors.azul,
|
|
borderRadius: 14,
|
|
padding: 16,
|
|
gap: 6,
|
|
},
|
|
valorAmount: {
|
|
color: colors.branco,
|
|
fontFamily: fonts.regular,
|
|
fontSize: 36,
|
|
},
|
|
valorAmountLabel: {
|
|
color: colors.branco,
|
|
fontFamily: fonts.regular,
|
|
fontSize: 16,
|
|
opacity: 0.9,
|
|
marginBottom: 8,
|
|
marginTop: -10,
|
|
},
|
|
valorPagoLine: {
|
|
color: colors.branco,
|
|
fontFamily: fonts.medium,
|
|
fontSize: 14,
|
|
marginTop: 8,
|
|
},
|
|
valorProgressTrack: {
|
|
height: 20,
|
|
borderRadius: 10,
|
|
backgroundColor: 'rgba(255, 255, 255, 0.2)',
|
|
marginBottom: 14,
|
|
overflow: 'hidden',
|
|
},
|
|
valorProgressFill: {
|
|
height: '100%',
|
|
backgroundColor: colors.branco,
|
|
borderRadius: 10,
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
justifyContent: 'flex-end',
|
|
paddingRight: 4,
|
|
},
|
|
valorProgressDot: {
|
|
width: 14,
|
|
height: 14,
|
|
borderRadius: 8,
|
|
backgroundColor: colors.vermelho,
|
|
},
|
|
valorFaltaRow: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
justifyContent: 'space-between',
|
|
},
|
|
valorFaltaRowPago: {
|
|
justifyContent: 'flex-start',
|
|
},
|
|
valorPagoStatus: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
gap: 8,
|
|
},
|
|
valorFaltaLabel: {
|
|
color: colors.branco,
|
|
fontFamily: fonts.regular,
|
|
fontSize: 14,
|
|
},
|
|
valorFaltaBadge: {
|
|
backgroundColor: 'rgba(255, 255, 255, 0.15)',
|
|
borderRadius: 8,
|
|
paddingHorizontal: 12,
|
|
paddingVertical: 6,
|
|
},
|
|
valorFaltaBadgeText: {
|
|
color: colors.branco,
|
|
fontFamily: fonts.bold,
|
|
fontSize: 14,
|
|
},
|
|
|
|
documentoRow: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
gap: 10,
|
|
paddingVertical: 10,
|
|
},
|
|
documentoRowLast: {
|
|
borderBottomWidth: 0,
|
|
},
|
|
documentoBadge: {
|
|
backgroundColor: '#FFE2E0',
|
|
borderRadius: 6,
|
|
paddingVertical: 2,
|
|
paddingHorizontal: 6,
|
|
},
|
|
documentoBadgeText: {
|
|
color: '#E6463B',
|
|
fontFamily: fonts.bold,
|
|
fontSize: 10,
|
|
},
|
|
documentoName: {
|
|
flex: 1,
|
|
color: colors.azul,
|
|
fontFamily: fonts.medium,
|
|
fontSize: 13,
|
|
},
|
|
offlineBanner: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
gap: 8,
|
|
backgroundColor: '#4A6592',
|
|
borderRadius: 10,
|
|
paddingVertical: 8,
|
|
paddingHorizontal: 12,
|
|
marginBottom: 12,
|
|
},
|
|
offlineBannerText: {
|
|
color: '#ffffff',
|
|
fontFamily: fonts.medium,
|
|
fontSize: 12,
|
|
flex: 1,
|
|
},
|
|
syncLabel: {
|
|
textAlign: 'center',
|
|
color: '#9AA8BE',
|
|
fontFamily: fonts.regular,
|
|
fontSize: 11,
|
|
marginTop: 8,
|
|
marginBottom: 16,
|
|
},
|
|
});
|