eletrotupi / tcc/ commit / e2301d0

frontend: draft new page components

Pedro Lucas Porcellis porcellis@eletrotupi.com 1 month ago e2301d059d0c15d0606c3be3e943191c0a2f620a
Parents: 11192d3
2 file(s) changed
  • frontend/app/(tabs)/new/index.tsx +52 -3
  • frontend/app/auth/login.tsx +1 -1
frontend/app/(tabs)/new/index.tsx
1 1 
import { useEffect, useState } from 'react';
2 2 
import {
3 3 
  StyleSheet,
4 4 
  View,
5 5 
  Text,
▸ 8 unchanged lines
14 14 
import { Card } from '@/components/ui/Cards';
15 15 
import { Badge } from '@/components/ui/Badge';
16 16 
import { Button } from '@/components/ui/Button';
17 17 
import { Section, SectionHeader } from '@/components/ui/Sections';
18 18 
import { MoodSelector } from '@/components/ui/EmojiSelectors';
19 - 
import { Typography, Spacing, Shadows, Colors } from '@/constants/theme';
19 + 
import { Typography, Spacing, Shadows, Colors, BorderRadius } from '@/constants/theme';
20 + 
import { Ionicons } from '@expo/vector-icons';
20 21 
import { router } from 'expo-router';
21 22 
import {
22 23 
  MoodDefinition, MOODS
23 24 
} from '@/constants/moods'
24 25
▸ 57 unchanged lines
82 83 
        </Section>
83 84
84 85 
        {/* TODO: Check whether we gonna have to generate these on demand */}
85 86 
        <Section>
86 87 
          <Grid gap={4}>
87 - 
            <Card style={{minHeight: 150, backgroundColor: 'powderblue'}}>
88 + 
            <Card style={{ padding: Spacing.cardGap }}>
89 + 
              <View style={{ flex: 1, flexDirection: 'row', flexGrow: 0, paddingVertical: 10 }}>
90 + 
                <Ionicons name="flash" size={20} color="#64748B" />
91 +
92 + 
                <Text style={{ ...Typography.headlineMd, marginBottom: 10 }}>
93 + 
                  Energia
94 + 
                </Text>
95 + 
              </View>
96 +
97 + 
              <Text style={{ ...Typography.headlineMd, marginBottom: 10 }}>
98 + 
                Média Alta
99 + 
              </Text>
100 +
101 + 
              <View style={styles.lineTrack}>
102 + 
                <View style={[styles.lineFill, { width: `35%` }]} />
103 + 
              </View>
88 104 
            </Card>
89 105
90 - 
            <Card style={{minHeight: 150, backgroundColor: 'tomato'}}>
106 + 
            <Card style={{ padding: Spacing.cardGap }}>
107 + 
              <View style={{ flex: 1, flexDirection: 'row', flexGrow: 0, paddingVertical: 10 }}>
108 + 
                <Ionicons name="moon-outline" size={20} color="#64748B" />
109 +
110 + 
                <Text style={{ ...Typography.headlineMd, marginBottom: 10 }}>
111 + 
                  Sono
112 + 
                </Text>
113 + 
              </View>
114 +
115 + 
              <Text style={{ ...Typography.headlineMd, marginBottom: 10 }}>
116 + 
                7h 30m
117 + 
              </Text>
118 +
119 + 
              <Text style={styles.indicatorGreen}>
120 + 
                +45min que ontem
121 + 
              </Text>
91 122 
            </Card>
92 123 
          </Grid>
93 124 
        </Section>
94 125
95 126 
        <Section>
▸ 30 unchanged lines
126 157 
  quickRegisterButton: {
127 158 
    marginLeft: 16,
128 159 
    marginRight: 16,
129 160 
    marginBottom: 16,
130 161 
    ...Shadows.lg
162 + 
  },
163 + 
  lineTrack: {
164 + 
    height: 6,
165 + 
    backgroundColor: Colors.light.divider,
166 + 
    borderRadius: BorderRadius.full,
167 + 
    marginBottom: 4,
168 + 
    overflow: 'hidden',
169 + 
  },
170 + 
  lineFill: {
171 + 
    height: '100%',
172 + 
    backgroundColor: Colors.light.tint,
173 + 
    borderRadius: BorderRadius.full,
174 + 
  },
175 + 
  indicatorGreen: {
176 + 
    color: Colors.light.tint,
177 + 
    fontSize: 11,
178 + 
    fontWeight: 600,
179 + 
    lineHeight: 16.5
131 180 
  }
132 181 
});
frontend/app/auth/login.tsx
1 1 
import React, { useState } from 'react';
2 2 
import {
3 3 
  View,
4 4 
  Text,
5 5 
  StyleSheet,
▸ 59 unchanged lines
65 65 
          showsVerticalScrollIndicator={false}
66 66 
        >
67 67 
          <View style={styles.header}>
68 68 
            <Text style={[styles.title, { color: textColor }]}>Bem vindo de volta</Text>
69 69 
            <Text style={[styles.subtitle, { color: textColor, opacity: 0.7 }]}>
70 - 
              Logue na sua conta
70 + 
              Logue na sua conta nexo
71 71 
            </Text>
72 72 
          </View>
73 73
74 74 
          <View style={styles.form}>
75 75 
            <Input
▸ 94 unchanged lines
170 170 
  },
171 171 
  footerText: {
172 172 
    fontSize: 14,
173 173 
  },
174 174 
});