fix: navbar StatefulWidget + dashboard colores dinamicos
- Navbar: convertir a StatefulWidget, un solo nivel de build, usa context.watch en lugar de Consumer anidados - Iconos sol/luna y campana siempre visibles con color explicito - Dashboard: barra busqueda, sugerencias y tarjeta inferior ahora respetan isDark (cardBg, textColor, etc.) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Lizandro Guarnizo
co-authored by
Claude Sonnet 4.6
Claude Sonnet 4.6
parent
8aa03f437c
commit
fac4135835
@@ -13,6 +13,7 @@ import 'package:prosapp_web_app/models/usuario.dart';
|
||||
import 'package:prosapp_web_app/models/usuario_profesional.dart';
|
||||
import 'package:prosapp_web_app/providers/auth_provider.dart';
|
||||
import 'package:prosapp_web_app/providers/cities_provider.dart';
|
||||
import 'package:prosapp_web_app/providers/theme_provider.dart';
|
||||
import 'package:prosapp_web_app/router/router.dart';
|
||||
import 'package:prosapp_web_app/services/api_service.dart';
|
||||
import 'package:prosapp_web_app/services/maps_service.dart';
|
||||
@@ -292,6 +293,14 @@ class _DashboardViewState extends State<DashboardView> {
|
||||
return const Center(child: CircularProgressIndicator());
|
||||
}
|
||||
|
||||
final isDark = context.watch<ThemeProvider>().isDark;
|
||||
final cardBg = isDark ? const Color(0xFF1E293B) : Colors.white;
|
||||
final cardBorder = isDark ? const Color(0xFF334155) : const Color(0xFFE0E0E0);
|
||||
final textColor = isDark ? Colors.white : Colors.black87;
|
||||
final subtextColor = isDark ? Colors.white54 : Colors.black54;
|
||||
final hintColor = isDark ? Colors.white38 : Colors.grey;
|
||||
final inputFill = isDark ? const Color(0xFF0F172A) : Colors.white;
|
||||
|
||||
return GestureDetector(
|
||||
onTap: () {
|
||||
_searchFocus.unfocus();
|
||||
@@ -355,11 +364,11 @@ class _DashboardViewState extends State<DashboardView> {
|
||||
children: [
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
color: cardBg,
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black.withOpacity(0.15),
|
||||
color: Colors.black.withOpacity(isDark ? 0.4 : 0.15),
|
||||
blurRadius: 14,
|
||||
offset: const Offset(0, 4),
|
||||
),
|
||||
@@ -369,10 +378,10 @@ class _DashboardViewState extends State<DashboardView> {
|
||||
controller: _searchController,
|
||||
focusNode: _searchFocus,
|
||||
onChanged: _onSearchChanged,
|
||||
style: const TextStyle(fontSize: 14),
|
||||
style: TextStyle(fontSize: 14, color: textColor),
|
||||
decoration: InputDecoration(
|
||||
hintText: 'Busca o mueve el mapa para fijar tu dirección',
|
||||
hintStyle: const TextStyle(color: Colors.grey, fontSize: 13),
|
||||
hintStyle: TextStyle(color: hintColor, fontSize: 13),
|
||||
prefixIcon: _geocoding
|
||||
? const Padding(
|
||||
padding: EdgeInsets.all(13),
|
||||
@@ -406,10 +415,10 @@ class _DashboardViewState extends State<DashboardView> {
|
||||
Container(
|
||||
margin: const EdgeInsets.only(top: 4),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
color: cardBg,
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
boxShadow: [
|
||||
BoxShadow(color: Colors.black.withOpacity(0.12), blurRadius: 10),
|
||||
BoxShadow(color: Colors.black.withOpacity(isDark ? 0.4 : 0.12), blurRadius: 10),
|
||||
],
|
||||
),
|
||||
child: Column(
|
||||
@@ -431,7 +440,7 @@ class _DashboardViewState extends State<DashboardView> {
|
||||
Expanded(
|
||||
child: Text(
|
||||
addr,
|
||||
style: const TextStyle(fontSize: 13),
|
||||
style: TextStyle(fontSize: 13, color: textColor),
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
@@ -440,7 +449,8 @@ class _DashboardViewState extends State<DashboardView> {
|
||||
),
|
||||
),
|
||||
),
|
||||
if (!isLast) Divider(height: 1, indent: 16, color: Colors.grey[100]),
|
||||
if (!isLast) Divider(height: 1, indent: 16,
|
||||
color: isDark ? Colors.white12 : Colors.grey[100]),
|
||||
],
|
||||
);
|
||||
}).toList(),
|
||||
@@ -471,11 +481,11 @@ class _DashboardViewState extends State<DashboardView> {
|
||||
bottom: 0,
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
color: cardBg,
|
||||
borderRadius: const BorderRadius.vertical(top: Radius.circular(20)),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black.withOpacity(0.13),
|
||||
color: Colors.black.withOpacity(isDark ? 0.4 : 0.13),
|
||||
blurRadius: 18,
|
||||
offset: const Offset(0, -4),
|
||||
),
|
||||
@@ -504,7 +514,9 @@ class _DashboardViewState extends State<DashboardView> {
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
|
||||
margin: const EdgeInsets.only(bottom: 10),
|
||||
decoration: BoxDecoration(
|
||||
color: const Color(0xFFF0F8FF),
|
||||
color: isDark
|
||||
? const Color(0xFF42A4EF).withOpacity(0.12)
|
||||
: const Color(0xFFF0F8FF),
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
border: Border.all(color: const Color(0xFF42A4EF).withOpacity(0.35)),
|
||||
),
|
||||
@@ -515,7 +527,7 @@ class _DashboardViewState extends State<DashboardView> {
|
||||
Expanded(
|
||||
child: Text(
|
||||
_currentAddress,
|
||||
style: const TextStyle(fontSize: 12, color: Colors.black87),
|
||||
style: TextStyle(fontSize: 12, color: textColor),
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
@@ -533,17 +545,21 @@ class _DashboardViewState extends State<DashboardView> {
|
||||
border: Border.all(
|
||||
color: _professional != null
|
||||
? const Color(0xFF42A4EF)
|
||||
: const Color(0xFFE0E0E0),
|
||||
: cardBorder,
|
||||
),
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
color: _professional != null ? const Color(0xFFF0F8FF) : Colors.grey[50],
|
||||
color: _professional != null
|
||||
? const Color(0xFF42A4EF).withOpacity(0.1)
|
||||
: (isDark ? const Color(0xFF0F172A) : Colors.grey[50]),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(
|
||||
Icons.person_outline,
|
||||
size: 20,
|
||||
color: _professional != null ? const Color(0xFF42A4EF) : Colors.grey,
|
||||
color: _professional != null
|
||||
? const Color(0xFF42A4EF)
|
||||
: subtextColor,
|
||||
),
|
||||
const SizedBox(width: 10),
|
||||
Expanded(
|
||||
@@ -551,11 +567,11 @@ class _DashboardViewState extends State<DashboardView> {
|
||||
_professional?.user.name ?? 'Seleccionar profesional',
|
||||
style: TextStyle(
|
||||
fontSize: 13,
|
||||
color: _professional != null ? Colors.black87 : Colors.grey,
|
||||
color: _professional != null ? textColor : subtextColor,
|
||||
),
|
||||
),
|
||||
),
|
||||
const Icon(Icons.chevron_right, color: Colors.grey, size: 18),
|
||||
Icon(Icons.chevron_right, color: subtextColor, size: 18),
|
||||
],
|
||||
),
|
||||
),
|
||||
@@ -567,9 +583,9 @@ class _DashboardViewState extends State<DashboardView> {
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 10),
|
||||
decoration: BoxDecoration(
|
||||
border: Border.all(color: const Color(0xFFE0E0E0)),
|
||||
border: Border.all(color: cardBorder),
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
color: Colors.grey[50],
|
||||
color: isDark ? const Color(0xFF0F172A) : Colors.grey[50],
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
@@ -577,14 +593,14 @@ class _DashboardViewState extends State<DashboardView> {
|
||||
const SizedBox(width: 8),
|
||||
Text(
|
||||
DateFormat('dd/MM/yyyy').format(_selectedDay!),
|
||||
style: const TextStyle(fontSize: 13),
|
||||
style: TextStyle(fontSize: 13, color: textColor),
|
||||
),
|
||||
const SizedBox(width: 14),
|
||||
const Icon(Icons.access_time, size: 17, color: Color(0xFF42A4EF)),
|
||||
const SizedBox(width: 6),
|
||||
Text(
|
||||
ScheduleEntity.getFormatTime(_selectedHour!) ?? '',
|
||||
style: const TextStyle(fontSize: 13),
|
||||
style: TextStyle(fontSize: 13, color: textColor),
|
||||
),
|
||||
const Spacer(),
|
||||
GestureDetector(
|
||||
@@ -593,7 +609,7 @@ class _DashboardViewState extends State<DashboardView> {
|
||||
_selectedHour = null;
|
||||
_professional = null;
|
||||
}),
|
||||
child: const Icon(Icons.close, size: 18, color: Colors.grey),
|
||||
child: Icon(Icons.close, size: 18, color: subtextColor),
|
||||
),
|
||||
],
|
||||
),
|
||||
|
||||
Reference in New Issue
Block a user