usite-sas-bic/prosappweb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: modo dia/noche y campana de notificaciones

Browse Source 
- ThemeProvider con persistencia en SharedPreferences
- Toggle animado en sidebar (sol/luna con switch visual)
- Temas light y dark completos en MaterialApp
- Campana en navbar con badge rojo y panel inferior de notificaciones

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Lizandro Guarnizo
2026-06-27 08:36:53 -05:00
co-authored by Claude Sonnet 4.6
parent 76c05a5820
commit 842a67cdea
4 changed files with 323 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/ui/shared/sidebar.dart
+75
View File
@@ -3,6 +3,7 @@ import 'package:prosapp_web_app/providers/auth_provider.dart';
import 'package:prosapp_web_app/providers/professional_provider.dart';
import 'package:prosapp_web_app/providers/services_provider.dart';
import 'package:prosapp_web_app/providers/sidemenu_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/navigation_service.dart';
import 'package:prosapp_web_app/services/notifications_service.dart';
@@ -25,6 +26,7 @@ class Sidebar extends StatelessWidget {
final sideMenuProvider = Provider.of<SideMenuProvider>(context);
final authProvider = Provider.of<AuthProvider>(context, listen: false);
final professionalProvider = Provider.of<ProfessionalProvider>(context);
final themeProvider = Provider.of<ThemeProvider>(context);
return Container(
width: 220,
@@ -188,6 +190,79 @@ class Sidebar extends StatelessWidget {
onPressed: () => authProvider.logout(),
),
const SizedBox(height: 20),
// ── Toggle día / noche ──
Padding(
padding: const EdgeInsets.fromLTRB(16, 0, 16, 24),
child: GestureDetector(
onTap: themeProvider.toggle,
child: AnimatedContainer(
duration: const Duration(milliseconds: 250),
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 10),
decoration: BoxDecoration(
color: themeProvider.isDark
? const Color(0xFF1E293B)
: Colors.white.withOpacity(0.08),
borderRadius: BorderRadius.circular(10),
border: Border.all(
color: Colors.white.withOpacity(0.12),
),
),
child: Row(
children: [
AnimatedSwitcher(
duration: const Duration(milliseconds: 300),
child: Icon(
themeProvider.isDark
? Icons.light_mode_outlined
: Icons.dark_mode_outlined,
key: ValueKey(themeProvider.isDark),
color: themeProvider.isDark
? Colors.amber
: const Color(0xFF8BAFD4),
size: 18,
),
),
const SizedBox(width: 10),
Text(
themeProvider.isDark ? 'Modo día' : 'Modo noche',
style: const TextStyle(
color: Color(0xFF8BAFD4),
fontSize: 13,
),
),
const Spacer(),
AnimatedContainer(
duration: const Duration(milliseconds: 250),
width: 36,
height: 20,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: themeProvider.isDark
? const Color(0xFF42A4EF)
: Colors.white.withOpacity(0.2),
),
child: AnimatedAlign(
duration: const Duration(milliseconds: 250),
alignment: themeProvider.isDark
? Alignment.centerRight
: Alignment.centerLeft,
child: Container(
margin: const EdgeInsets.all(3),
width: 14,
height: 14,
decoration: const BoxDecoration(
color: Colors.white,
shape: BoxShape.circle,
),
),
),
),
],
),
),
),
),
],
),
);