First commit of the new app
This commit is contained in:
133
styles/screens/auth/login.styles.ts
Normal file
133
styles/screens/auth/login.styles.ts
Normal file
@@ -0,0 +1,133 @@
|
||||
import { StyleSheet } from 'react-native';
|
||||
import { colors } from '@/assets/styles/colors';
|
||||
import { fonts } from '@/assets/styles/fonts';
|
||||
|
||||
export default StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
backgroundColor: colors.background_1,
|
||||
},
|
||||
scrollContent: {
|
||||
flexGrow: 1,
|
||||
paddingBottom: 40,
|
||||
},
|
||||
hero: {
|
||||
height: 380,
|
||||
justifyContent: 'flex-end',
|
||||
},
|
||||
heroImage: {
|
||||
width: '100%',
|
||||
},
|
||||
overlay: {
|
||||
...StyleSheet.absoluteFillObject,
|
||||
backgroundColor: colors.azul_escuro,
|
||||
opacity: 0.9,
|
||||
},
|
||||
heroContent: {
|
||||
zIndex: 1,
|
||||
alignItems: 'center',
|
||||
paddingHorizontal: 18,
|
||||
paddingBottom: 100,
|
||||
},
|
||||
logo: {
|
||||
width: 250,
|
||||
height: 50,
|
||||
marginBottom: 18,
|
||||
},
|
||||
title: {
|
||||
color: colors.branco,
|
||||
fontSize: 36,
|
||||
fontFamily: fonts.bold,
|
||||
marginBottom: 6,
|
||||
},
|
||||
subtitle: {
|
||||
color: colors.branco,
|
||||
fontSize: 18,
|
||||
lineHeight: 29,
|
||||
textAlign: 'center',
|
||||
fontFamily: fonts.regular,
|
||||
},
|
||||
formCard: {
|
||||
marginHorizontal: 24,
|
||||
marginTop: -62,
|
||||
backgroundColor: colors.branco,
|
||||
borderRadius: 18,
|
||||
paddingHorizontal: 18,
|
||||
paddingVertical: 20,
|
||||
shadowColor: '#000',
|
||||
shadowOpacity: 0.08,
|
||||
shadowRadius: 18,
|
||||
shadowOffset: { width: 0, height: 5 },
|
||||
elevation: 4,
|
||||
},
|
||||
label: {
|
||||
color: colors.azul_text,
|
||||
fontSize: 15,
|
||||
marginBottom: 8,
|
||||
fontFamily: fonts.semiBold,
|
||||
},
|
||||
required: {
|
||||
color: colors.vermelho,
|
||||
},
|
||||
input: {
|
||||
height: 52,
|
||||
borderWidth: 1,
|
||||
borderColor: '#D1D5DB',
|
||||
borderRadius: 12,
|
||||
paddingHorizontal: 14,
|
||||
marginBottom: 16,
|
||||
fontFamily: fonts.regular,
|
||||
color: '#1F2937',
|
||||
},
|
||||
passwordWrapper: {
|
||||
height: 52,
|
||||
borderWidth: 1,
|
||||
borderColor: '#D1D5DB',
|
||||
borderRadius: 12,
|
||||
paddingHorizontal: 14,
|
||||
marginBottom: 14,
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
},
|
||||
passwordInput: {
|
||||
flex: 1,
|
||||
fontFamily: fonts.regular,
|
||||
color: '#1F2937',
|
||||
},
|
||||
eyeIcon: {
|
||||
color: '#9098A3',
|
||||
},
|
||||
forgot: {
|
||||
color: colors.vermelho,
|
||||
textAlign: 'center',
|
||||
fontSize: 13,
|
||||
textDecorationLine: 'underline',
|
||||
marginBottom: 20,
|
||||
fontFamily: fonts.medium,
|
||||
},
|
||||
errorText: {
|
||||
color: colors.vermelho,
|
||||
textAlign: 'center',
|
||||
fontSize: 13,
|
||||
marginBottom: 12,
|
||||
fontFamily: fonts.medium,
|
||||
},
|
||||
loginButton: {
|
||||
backgroundColor: colors.azul,
|
||||
height: 48,
|
||||
borderRadius: 10,
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
gap: 8,
|
||||
},
|
||||
loginButtonText: {
|
||||
color: colors.branco,
|
||||
fontFamily: fonts.medium,
|
||||
fontSize: 18,
|
||||
},
|
||||
loginButtonIcon: {
|
||||
width: 16,
|
||||
height: 16,
|
||||
},
|
||||
});
|
||||
169
styles/screens/auth/recover.styles.ts
Normal file
169
styles/screens/auth/recover.styles.ts
Normal file
@@ -0,0 +1,169 @@
|
||||
import { StyleSheet } from 'react-native';
|
||||
import { colors } from '@/assets/styles/colors';
|
||||
import { fonts } from '@/assets/styles/fonts';
|
||||
|
||||
export default StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
backgroundColor: colors.background_1,
|
||||
},
|
||||
scrollContent: {
|
||||
flexGrow: 1,
|
||||
paddingBottom: 40,
|
||||
},
|
||||
hero: {
|
||||
height: 380,
|
||||
justifyContent: 'flex-end',
|
||||
},
|
||||
heroImage: {
|
||||
width: '100%',
|
||||
},
|
||||
overlay: {
|
||||
...StyleSheet.absoluteFillObject,
|
||||
backgroundColor: colors.azul_escuro,
|
||||
opacity: 0.9,
|
||||
},
|
||||
heroContent: {
|
||||
zIndex: 1,
|
||||
alignItems: 'center',
|
||||
paddingHorizontal: 18,
|
||||
paddingBottom: 100,
|
||||
},
|
||||
logo: {
|
||||
width: 250,
|
||||
height: 50,
|
||||
marginBottom: 18,
|
||||
},
|
||||
title: {
|
||||
color: colors.branco,
|
||||
fontSize: 36,
|
||||
fontFamily: fonts.bold,
|
||||
marginBottom: 6,
|
||||
},
|
||||
subtitle: {
|
||||
color: colors.branco,
|
||||
fontSize: 18,
|
||||
lineHeight: 29,
|
||||
textAlign: 'center',
|
||||
fontFamily: fonts.regular,
|
||||
},
|
||||
formCard: {
|
||||
marginHorizontal: 24,
|
||||
marginTop: -62,
|
||||
backgroundColor: colors.branco,
|
||||
borderRadius: 18,
|
||||
paddingHorizontal: 18,
|
||||
paddingVertical: 20,
|
||||
shadowColor: '#000',
|
||||
shadowOpacity: 0.08,
|
||||
shadowRadius: 18,
|
||||
shadowOffset: { width: 0, height: 5 },
|
||||
elevation: 4,
|
||||
},
|
||||
label: {
|
||||
color: colors.azul_text,
|
||||
fontSize: 15,
|
||||
marginBottom: 8,
|
||||
fontFamily: fonts.semiBold,
|
||||
},
|
||||
required: {
|
||||
color: colors.vermelho,
|
||||
},
|
||||
input: {
|
||||
height: 52,
|
||||
borderWidth: 1,
|
||||
borderColor: '#D1D5DB',
|
||||
borderRadius: 12,
|
||||
paddingHorizontal: 14,
|
||||
marginBottom: 16,
|
||||
fontFamily: fonts.regular,
|
||||
color: '#1F2937',
|
||||
},
|
||||
errorText: {
|
||||
color: colors.vermelho,
|
||||
textAlign: 'center',
|
||||
fontSize: 13,
|
||||
marginBottom: 12,
|
||||
fontFamily: fonts.medium,
|
||||
},
|
||||
actionButton: {
|
||||
backgroundColor: colors.azul,
|
||||
height: 48,
|
||||
borderRadius: 10,
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
gap: 8,
|
||||
},
|
||||
actionButtonText: {
|
||||
color: colors.branco,
|
||||
fontFamily: fonts.medium,
|
||||
fontSize: 18,
|
||||
},
|
||||
actionButtonIcon: {
|
||||
width: 16,
|
||||
height: 16,
|
||||
},
|
||||
backLink: {
|
||||
color: colors.vermelho,
|
||||
textAlign: 'center',
|
||||
fontSize: 13,
|
||||
textDecorationLine: 'underline',
|
||||
marginTop: 16,
|
||||
fontFamily: fonts.medium,
|
||||
},
|
||||
modalOverlay: {
|
||||
flex: 1,
|
||||
backgroundColor: 'rgba(0, 9, 25, 0.55)',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
paddingHorizontal: 24,
|
||||
},
|
||||
modalCard: {
|
||||
width: '100%',
|
||||
maxWidth: 360,
|
||||
backgroundColor: colors.branco,
|
||||
borderRadius: 16,
|
||||
paddingVertical: 24,
|
||||
paddingHorizontal: 20,
|
||||
alignItems: 'center',
|
||||
},
|
||||
modalIconCircle: {
|
||||
width: 40,
|
||||
height: 40,
|
||||
borderRadius: 20,
|
||||
backgroundColor: colors.vermelho,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
marginBottom: 16,
|
||||
},
|
||||
modalIcon: {
|
||||
color: colors.branco,
|
||||
},
|
||||
modalTitle: {
|
||||
color: colors.azul_text,
|
||||
fontSize: 30,
|
||||
fontFamily: fonts.bold,
|
||||
marginBottom: 8,
|
||||
textAlign: 'center',
|
||||
},
|
||||
modalMessage: {
|
||||
color: colors.azul_text,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
lineHeight: 22,
|
||||
fontFamily: fonts.regular,
|
||||
marginBottom: 14,
|
||||
},
|
||||
modalCloseButton: {
|
||||
backgroundColor: colors.azul,
|
||||
borderRadius: 10,
|
||||
paddingHorizontal: 22,
|
||||
paddingVertical: 8,
|
||||
},
|
||||
modalCloseText: {
|
||||
color: colors.branco,
|
||||
fontFamily: fonts.medium,
|
||||
fontSize: 16,
|
||||
},
|
||||
});
|
||||
741
styles/screens/reserva/detail.styles.ts
Normal file
741
styles/screens/reserva/detail.styles.ts
Normal file
@@ -0,0 +1,741 @@
|
||||
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,
|
||||
},
|
||||
});
|
||||
9
styles/screens/root/index.styles.ts
Normal file
9
styles/screens/root/index.styles.ts
Normal file
@@ -0,0 +1,9 @@
|
||||
import { StyleSheet } from 'react-native';
|
||||
|
||||
export default StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
},
|
||||
});
|
||||
221
styles/screens/tabs/contactos.styles.ts
Normal file
221
styles/screens/tabs/contactos.styles.ts
Normal file
@@ -0,0 +1,221 @@
|
||||
import { colors } from '@/assets/styles/colors';
|
||||
import { fonts } from '@/assets/styles/fonts';
|
||||
import { StyleSheet, Platform } from 'react-native';
|
||||
|
||||
export default StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
backgroundColor: colors.background_1,
|
||||
},
|
||||
centered: {
|
||||
flex: 1,
|
||||
backgroundColor: colors.background_1,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
padding: 24,
|
||||
},
|
||||
content: {
|
||||
paddingHorizontal: 16,
|
||||
paddingTop: 18,
|
||||
paddingBottom: 120,
|
||||
},
|
||||
pageTitle: {
|
||||
fontFamily: fonts.bold,
|
||||
fontSize: 22,
|
||||
color: colors.azul,
|
||||
marginBottom: 18,
|
||||
},
|
||||
errorText: {
|
||||
fontFamily: fonts.medium,
|
||||
fontSize: 14,
|
||||
color: colors.vermelho,
|
||||
textAlign: 'center',
|
||||
},
|
||||
|
||||
// ── Ações rápidas ──────────────────────────────────────────────────────────
|
||||
actionsRow: {
|
||||
flexDirection: 'row',
|
||||
gap: 8,
|
||||
marginBottom: 14,
|
||||
},
|
||||
actionBtn: {
|
||||
flex: 1,
|
||||
backgroundColor: colors.azul,
|
||||
borderRadius: 14,
|
||||
alignItems: 'center',
|
||||
paddingVertical: 14,
|
||||
paddingHorizontal: 6,
|
||||
gap: 4,
|
||||
},
|
||||
actionIconWrap: {
|
||||
width: 36,
|
||||
height: 36,
|
||||
borderRadius: 18,
|
||||
backgroundColor: colors.background_1,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
marginBottom: 2,
|
||||
},
|
||||
actionIcon: {
|
||||
width: 20,
|
||||
height: 20,
|
||||
tintColor: colors.azul,
|
||||
resizeMode: 'contain',
|
||||
},
|
||||
actionLabel: {
|
||||
fontFamily: fonts.regular,
|
||||
fontSize: 14,
|
||||
color: colors.branco,
|
||||
textAlign: 'center',
|
||||
},
|
||||
actionSub: {
|
||||
fontFamily: fonts.regular,
|
||||
fontSize: 12,
|
||||
color: colors.branco,
|
||||
textAlign: 'center',
|
||||
},
|
||||
|
||||
// ── Card genérico ──────────────────────────────────────────────────────────
|
||||
card: {
|
||||
backgroundColor: colors.branco,
|
||||
borderRadius: 14,
|
||||
padding: 16,
|
||||
marginBottom: 14,
|
||||
shadowColor: '#000',
|
||||
shadowOpacity: 0.04,
|
||||
shadowRadius: 6,
|
||||
shadowOffset: { width: 0, height: 2 },
|
||||
elevation: 2,
|
||||
},
|
||||
cardTitle: {
|
||||
fontFamily: fonts.bold,
|
||||
fontSize: 15,
|
||||
color: colors.azul,
|
||||
marginBottom: 12,
|
||||
},
|
||||
|
||||
// ── Localização ───────────────────────────────────────────────────────────
|
||||
mapImageWrap: {
|
||||
width: '100%',
|
||||
height: 160,
|
||||
borderRadius: 10,
|
||||
overflow: 'hidden',
|
||||
marginBottom: 12,
|
||||
backgroundColor: colors.background_2,
|
||||
},
|
||||
mapImage: {
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
},
|
||||
mapOverlay: {
|
||||
...StyleSheet.absoluteFillObject,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
gap: 6,
|
||||
backgroundColor: colors.background_2,
|
||||
},
|
||||
mapErrorText: {
|
||||
fontFamily: fonts.medium,
|
||||
fontSize: 12,
|
||||
color: '#9AA8BE',
|
||||
},
|
||||
addressRow: {
|
||||
flexDirection: 'row',
|
||||
alignItems: 'flex-start',
|
||||
gap: 8,
|
||||
marginBottom: 14,
|
||||
},
|
||||
addressText: {
|
||||
flex: 1,
|
||||
fontFamily: fonts.regular,
|
||||
fontSize: 13,
|
||||
color: colors.azul,
|
||||
lineHeight: 20,
|
||||
},
|
||||
copyIcon: {
|
||||
marginTop: 2,
|
||||
paddingHorizontal: 4,
|
||||
},
|
||||
direcoeBtn: {
|
||||
backgroundColor: colors.azul,
|
||||
borderRadius: 10,
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
gap: 8,
|
||||
paddingVertical: 13,
|
||||
},
|
||||
direcoeBtnText: {
|
||||
fontFamily: fonts.regular,
|
||||
fontSize: 16,
|
||||
color: colors.branco,
|
||||
},
|
||||
saveButtonIcon: {
|
||||
width: 14,
|
||||
height: 14,
|
||||
},
|
||||
|
||||
// ── Horário ───────────────────────────────────────────────────────────────
|
||||
horarioRow: {
|
||||
flexDirection: 'row',
|
||||
justifyContent: 'space-between',
|
||||
alignItems: 'center',
|
||||
paddingVertical: 12,
|
||||
},
|
||||
horarioRowBorder: {
|
||||
borderBottomWidth: 1,
|
||||
borderBottomColor: colors.background_1,
|
||||
},
|
||||
horarioDia: {
|
||||
fontFamily: fonts.semiBold,
|
||||
fontSize: 13,
|
||||
color: colors.azul,
|
||||
},
|
||||
horarioHoras: {
|
||||
fontFamily: fonts.regular,
|
||||
fontSize: 13,
|
||||
color: colors.azul,
|
||||
},
|
||||
horarioFechado: {
|
||||
color: colors.vermelho,
|
||||
fontFamily: fonts.medium,
|
||||
},
|
||||
|
||||
// ── Emergência ────────────────────────────────────────────────────────────
|
||||
emergencyBtn: {
|
||||
backgroundColor: '#25D366',
|
||||
borderRadius: 10,
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
paddingVertical: 13,
|
||||
paddingHorizontal: 16,
|
||||
gap: 10,
|
||||
},
|
||||
emergencyIcon: {
|
||||
width: 22,
|
||||
height: 22,
|
||||
resizeMode: 'contain',
|
||||
tintColor: colors.branco,
|
||||
},
|
||||
emergencyText: {
|
||||
flex: 1,
|
||||
fontFamily: fonts.semiBold,
|
||||
fontSize: 14,
|
||||
color: colors.branco,
|
||||
},
|
||||
|
||||
// ── Redes Sociais ─────────────────────────────────────────────────────────
|
||||
socialsRow: {
|
||||
flexDirection: 'row',
|
||||
flexWrap: 'wrap',
|
||||
gap: 10,
|
||||
},
|
||||
socialBtn: {
|
||||
width: 44,
|
||||
height: 44,
|
||||
borderRadius: 22,
|
||||
backgroundColor: colors.background_1,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
},
|
||||
});
|
||||
226
styles/screens/tabs/home.styles.ts
Normal file
226
styles/screens/tabs/home.styles.ts
Normal file
@@ -0,0 +1,226 @@
|
||||
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,
|
||||
},
|
||||
centered: {
|
||||
flex: 1,
|
||||
backgroundColor: colors.background_1,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
},
|
||||
content: {
|
||||
paddingHorizontal: 16,
|
||||
paddingTop: 14,
|
||||
paddingBottom: 120,
|
||||
},
|
||||
logo: {
|
||||
width: 165,
|
||||
height: 36,
|
||||
alignSelf: 'center',
|
||||
marginBottom: 14,
|
||||
},
|
||||
statsRow: {
|
||||
flexDirection: 'row',
|
||||
gap: 8,
|
||||
marginBottom: 18,
|
||||
},
|
||||
statCard: {
|
||||
flex: 1,
|
||||
backgroundColor: colors.branco,
|
||||
borderRadius: 14,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
paddingVertical: 10,
|
||||
paddingHorizontal: 6,
|
||||
minHeight: 82,
|
||||
},
|
||||
statCardPrimary: {
|
||||
backgroundColor: colors.azul,
|
||||
},
|
||||
statIconEmViagemWrap: {
|
||||
width: 38,
|
||||
height: 38,
|
||||
backgroundColor: colors.branco,
|
||||
borderRadius: 19,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
marginBottom: 5,
|
||||
},
|
||||
statIcon: {
|
||||
width: 38,
|
||||
height: 38,
|
||||
marginBottom: 5,
|
||||
},
|
||||
statLabel: {
|
||||
fontSize: 14,
|
||||
color: colors.azul,
|
||||
fontFamily: fonts.regular,
|
||||
marginBottom: 2,
|
||||
textAlign: 'center',
|
||||
},
|
||||
statValue: {
|
||||
fontSize: 24,
|
||||
color: colors.azul,
|
||||
fontFamily: fonts.medium,
|
||||
lineHeight: 32,
|
||||
},
|
||||
statLabelPrimary: {
|
||||
fontSize: 14,
|
||||
color: colors.branco,
|
||||
fontFamily: fonts.regular,
|
||||
marginBottom: 2,
|
||||
textAlign: 'center',
|
||||
},
|
||||
statValuePrimary: {
|
||||
fontSize: 24,
|
||||
color: colors.branco,
|
||||
fontFamily: fonts.medium,
|
||||
lineHeight: 32,
|
||||
},
|
||||
sectionTitle: {
|
||||
fontSize: 24,
|
||||
color: colors.azul,
|
||||
fontFamily: fonts.bold,
|
||||
marginBottom: 12,
|
||||
},
|
||||
card: {
|
||||
backgroundColor: colors.branco,
|
||||
borderRadius: 16,
|
||||
padding: 10,
|
||||
flexDirection: 'row',
|
||||
gap: 10,
|
||||
marginBottom: 12,
|
||||
alignItems: 'stretch',
|
||||
},
|
||||
cardImage: {
|
||||
width: 100,
|
||||
height: 120,
|
||||
borderRadius: 14,
|
||||
backgroundColor: '#E7ECF4',
|
||||
},
|
||||
cardContent: {
|
||||
flex: 1,
|
||||
justifyContent: 'space-between',
|
||||
height: 100,
|
||||
},
|
||||
arrowWrap: {
|
||||
justifyContent: 'flex-end',
|
||||
alignItems: 'flex-end',
|
||||
paddingLeft: 2,
|
||||
},
|
||||
cardTopRow: {
|
||||
flexDirection: 'row',
|
||||
justifyContent: 'space-between',
|
||||
alignItems: 'center',
|
||||
gap: 8,
|
||||
},
|
||||
refText: {
|
||||
flex: 1,
|
||||
flexShrink: 1,
|
||||
fontSize: 12,
|
||||
color: '#4A6592',
|
||||
fontFamily: fonts.regular,
|
||||
marginRight: 4,
|
||||
},
|
||||
destination: {
|
||||
fontSize: 24,
|
||||
color: colors.azul,
|
||||
fontFamily: fonts.bold,
|
||||
lineHeight: 35,
|
||||
marginTop: 2,
|
||||
marginBottom: 2,
|
||||
},
|
||||
meta: {
|
||||
fontSize: 11,
|
||||
color: '#4A6592',
|
||||
fontFamily: fonts.regular,
|
||||
},
|
||||
dateRow: {
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
gap: 5,
|
||||
marginTop: 2,
|
||||
},
|
||||
dateIcon: {
|
||||
width: 12,
|
||||
height: 12,
|
||||
tintColor: '#4A6592',
|
||||
},
|
||||
statusBadge: {
|
||||
flexShrink: 1,
|
||||
maxWidth: '60%',
|
||||
borderRadius: 12,
|
||||
paddingVertical: 4,
|
||||
paddingHorizontal: 6,
|
||||
backgroundColor: '#E9EDF4',
|
||||
},
|
||||
statusBadgeContent: {
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
gap: 4,
|
||||
flexShrink: 1,
|
||||
},
|
||||
statusText: {
|
||||
flexShrink: 1,
|
||||
fontSize: 12,
|
||||
fontFamily: fonts.medium,
|
||||
textAlign: 'center',
|
||||
},
|
||||
statusSuccess: {
|
||||
backgroundColor: '#D8FFE3', // verde
|
||||
},
|
||||
statusDanger: {
|
||||
backgroundColor: '#FFE2E0', // vermelho
|
||||
},
|
||||
statusInfo: {
|
||||
backgroundColor: '#F3DBFF', // roxo
|
||||
},
|
||||
statusPendente: {
|
||||
backgroundColor: '#FFF6D9',
|
||||
},
|
||||
statusTextSuccess: {
|
||||
color: '#13AE45',
|
||||
},
|
||||
statusTextDanger: {
|
||||
color: '#E6463B',
|
||||
},
|
||||
statusTextInfo: {
|
||||
color: '#B138E6',
|
||||
},
|
||||
statusTextPendente: {
|
||||
color: '#C99700',
|
||||
},
|
||||
offlineBanner: {
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
gap: 8,
|
||||
backgroundColor: '#4A6592',
|
||||
borderRadius: 10,
|
||||
paddingVertical: 8,
|
||||
paddingHorizontal: 12,
|
||||
marginBottom: 12,
|
||||
},
|
||||
offlineBannerText: {
|
||||
color: colors.branco,
|
||||
fontFamily: fonts.medium,
|
||||
fontSize: 12,
|
||||
flex: 1,
|
||||
},
|
||||
errorText: {
|
||||
fontSize: 14,
|
||||
color: colors.vermelho,
|
||||
fontFamily: fonts.medium,
|
||||
marginBottom: 10,
|
||||
},
|
||||
emptyText: {
|
||||
fontSize: 14,
|
||||
color: '#4A6592',
|
||||
fontFamily: fonts.medium,
|
||||
},
|
||||
});
|
||||
9
styles/screens/tabs/index.styles.ts
Normal file
9
styles/screens/tabs/index.styles.ts
Normal file
@@ -0,0 +1,9 @@
|
||||
import { StyleSheet } from 'react-native';
|
||||
|
||||
export default StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
},
|
||||
});
|
||||
231
styles/screens/tabs/perfil.styles.ts
Normal file
231
styles/screens/tabs/perfil.styles.ts
Normal file
@@ -0,0 +1,231 @@
|
||||
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,
|
||||
},
|
||||
content: {
|
||||
paddingHorizontal: 16,
|
||||
paddingTop: 16,
|
||||
paddingBottom: 200,
|
||||
},
|
||||
header: {
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
gap: 12,
|
||||
marginBottom: 18,
|
||||
},
|
||||
backButton: {
|
||||
width: 40,
|
||||
height: 40,
|
||||
borderRadius: 20,
|
||||
backgroundColor: '#EEF0F5',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
},
|
||||
logo: {
|
||||
width: 160,
|
||||
height: 34,
|
||||
},
|
||||
title: {
|
||||
fontSize: 24,
|
||||
color: colors.azul,
|
||||
fontFamily: fonts.bold,
|
||||
marginBottom: 12,
|
||||
},
|
||||
userCard: {
|
||||
backgroundColor: colors.branco,
|
||||
borderRadius: 16,
|
||||
paddingHorizontal: 18,
|
||||
paddingVertical: 16,
|
||||
marginBottom: 14,
|
||||
},
|
||||
userName: {
|
||||
fontSize: 24,
|
||||
color: colors.azul,
|
||||
fontFamily: fonts.bold,
|
||||
},
|
||||
userEmail: {
|
||||
fontSize: 12,
|
||||
color: '#4A6592',
|
||||
fontFamily: fonts.regular,
|
||||
},
|
||||
menuCard: {
|
||||
backgroundColor: colors.branco,
|
||||
borderRadius: 16,
|
||||
overflow: 'hidden',
|
||||
},
|
||||
menuRow: {
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'space-between',
|
||||
paddingHorizontal: 18,
|
||||
paddingVertical: 16,
|
||||
},
|
||||
menuLeft: {
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
gap: 12,
|
||||
},
|
||||
menuText: {
|
||||
fontSize: 18,
|
||||
color: colors.azul,
|
||||
fontFamily: fonts.regular,
|
||||
|
||||
},
|
||||
divider: {
|
||||
height: 1,
|
||||
backgroundColor: '#EEF0F5',
|
||||
marginHorizontal: 16,
|
||||
},
|
||||
editBodyWrap: {
|
||||
overflow: 'hidden',
|
||||
},
|
||||
editBodyMeasure: {
|
||||
position: 'absolute',
|
||||
left: 0,
|
||||
right: 0,
|
||||
top: 0,
|
||||
},
|
||||
accordionContent: {
|
||||
paddingHorizontal: 16,
|
||||
paddingBottom: 16,
|
||||
gap: 10,
|
||||
},
|
||||
rowInputs: {
|
||||
flexDirection: 'row',
|
||||
gap: 8,
|
||||
},
|
||||
inputBlock: {
|
||||
flex: 1,
|
||||
},
|
||||
inputBlockFull: {},
|
||||
inputLabel: {
|
||||
color: colors.azul,
|
||||
fontFamily: fonts.bold,
|
||||
fontSize: 16,
|
||||
marginBottom: 6,
|
||||
},
|
||||
required: {
|
||||
color: colors.vermelho,
|
||||
},
|
||||
input: {
|
||||
height: 48,
|
||||
borderWidth: 1,
|
||||
borderColor: '#C7CEDB',
|
||||
borderRadius: 12,
|
||||
paddingHorizontal: 12,
|
||||
color: '#1F2937',
|
||||
fontFamily: fonts.regular,
|
||||
fontSize: 16,
|
||||
backgroundColor: '#FAFBFD',
|
||||
},
|
||||
saveButton: {
|
||||
marginTop: 8,
|
||||
height: 48,
|
||||
borderRadius: 10,
|
||||
backgroundColor: colors.azul,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
flexDirection: 'row',
|
||||
gap: 6,
|
||||
},
|
||||
saveButtonText: {
|
||||
color: colors.branco,
|
||||
fontFamily: fonts.medium,
|
||||
fontSize: 18,
|
||||
},
|
||||
saveButtonIcon: {
|
||||
width: 14,
|
||||
height: 14,
|
||||
},
|
||||
deleteProfileButtonIcon: {
|
||||
width: 22,
|
||||
height: 18,
|
||||
},
|
||||
arrowUpButtonIcon: {
|
||||
width: 14,
|
||||
height: 14,
|
||||
color: colors.azul
|
||||
},
|
||||
modalOverlay: {
|
||||
flex: 1,
|
||||
backgroundColor: 'rgba(30, 41, 59, 0.45)',
|
||||
justifyContent: 'center',
|
||||
paddingHorizontal: 16,
|
||||
},
|
||||
modalCard: {
|
||||
backgroundColor: colors.branco,
|
||||
borderRadius: 16,
|
||||
paddingHorizontal: 18,
|
||||
paddingTop: 22,
|
||||
paddingBottom: 16,
|
||||
alignItems: 'center',
|
||||
},
|
||||
modalIconWrap: {
|
||||
width: 42,
|
||||
height: 42,
|
||||
borderRadius: 21,
|
||||
backgroundColor: colors.vermelho,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
marginBottom: 12,
|
||||
},
|
||||
modalTitle: {
|
||||
fontSize: 24,
|
||||
color: colors.azul,
|
||||
fontFamily: fonts.bold,
|
||||
marginBottom: 8,
|
||||
textAlign: 'center',
|
||||
},
|
||||
modalSubtitle: {
|
||||
fontSize: 16,
|
||||
color: colors.azul,
|
||||
fontFamily: fonts.regular,
|
||||
textAlign: 'center',
|
||||
marginBottom: 16,
|
||||
lineHeight: 22,
|
||||
},
|
||||
modalButtons: {
|
||||
width: '100%',
|
||||
flexDirection: 'row',
|
||||
gap: 8,
|
||||
},
|
||||
modalButton: {
|
||||
flex: 1,
|
||||
height: 44,
|
||||
borderRadius: 10,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
flexDirection: 'row',
|
||||
gap: 6,
|
||||
},
|
||||
modalPrimaryButton: {
|
||||
backgroundColor: colors.azul,
|
||||
},
|
||||
modalSecondaryButton: {
|
||||
backgroundColor: colors.branco,
|
||||
borderWidth: 1,
|
||||
borderColor: colors.azul,
|
||||
},
|
||||
modalPrimaryText: {
|
||||
color: colors.branco,
|
||||
fontSize: 18,
|
||||
fontFamily: fonts.medium,
|
||||
},
|
||||
modalSecondaryText: {
|
||||
color: colors.azul,
|
||||
fontSize: 18,
|
||||
fontFamily: fonts.medium,
|
||||
},
|
||||
modalButtonIcon: {
|
||||
transform: [{ rotate: '45deg' }],
|
||||
},
|
||||
perfilIcon: {
|
||||
width: 16,
|
||||
height: 19,
|
||||
},
|
||||
});
|
||||
9
styles/screens/tabs/reservas.styles.ts
Normal file
9
styles/screens/tabs/reservas.styles.ts
Normal file
@@ -0,0 +1,9 @@
|
||||
import { StyleSheet } from 'react-native';
|
||||
|
||||
export default StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
},
|
||||
});
|
||||
Reference in New Issue
Block a user