Refactor theme colors and styles across the application
- Introduced AppColors class to centralize color definitions for better maintainability and consistency. - Updated various screens (Settings, Vault Access, Note Card, etc.) to use AppColors for styling instead of hardcoded colors. - Enhanced UI elements with improved color contrast and accessibility. - Replaced gradient backgrounds with defined color schemes for a cohesive look. - Refactored button styles and text colors to align with the new theme structure.
This commit is contained in:
@@ -1,5 +1,6 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:notas/data/local_vault_service.dart';
|
||||
import 'package:notas/theme/app_colors.dart';
|
||||
import 'package:notas/widgets/search_app_bar.dart';
|
||||
import 'package:notas/data/api_client.dart';
|
||||
|
||||
@@ -29,30 +30,35 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
bool _isServerDeleting = false;
|
||||
bool _isThemeSaving = false;
|
||||
final TextEditingController _endpointController = TextEditingController();
|
||||
final TextEditingController _encryptionKeyController = TextEditingController();
|
||||
final TextEditingController _encryptionKeyController =
|
||||
TextEditingController();
|
||||
bool _endpointLoading = true;
|
||||
bool _encryptionKeyLoading = false;
|
||||
bool _encryptionKeyVisible = false;
|
||||
late Color _selectedSeedColor;
|
||||
|
||||
static const List<Color> _themeColorOptions = <Color>[
|
||||
Colors.amber,
|
||||
Colors.blue,
|
||||
Colors.teal,
|
||||
Colors.green,
|
||||
Colors.pink,
|
||||
Colors.purple,
|
||||
];
|
||||
static const List<Color> _themeColorOptions = AppColors.themeSeedColors;
|
||||
|
||||
Future<void> _confirmAndDeleteAll() async {
|
||||
final bool? confirmed = await showDialog<bool>(
|
||||
context: context,
|
||||
builder: (context) => AlertDialog(
|
||||
title: const Text('Borrar todos los datos'),
|
||||
content: const Text('¿Estás seguro? Esta acción eliminará la base de datos local y la clave de cifrado. Asegúrate de tener una copia de seguridad si es necesario o cuenta sincronizada.'),
|
||||
content: const Text(
|
||||
'¿Estás seguro? Esta acción eliminará la base de datos local y la clave de cifrado. Asegúrate de tener una copia de seguridad si es necesario o cuenta sincronizada.',
|
||||
),
|
||||
actions: [
|
||||
TextButton(onPressed: () => Navigator.of(context).pop(false), child: const Text('Cancelar')),
|
||||
TextButton(onPressed: () => Navigator.of(context).pop(true), child: const Text('Borrar', style: TextStyle(color: Colors.red))),
|
||||
TextButton(
|
||||
onPressed: () => Navigator.of(context).pop(false),
|
||||
child: const Text('Cancelar'),
|
||||
),
|
||||
TextButton(
|
||||
onPressed: () => Navigator.of(context).pop(true),
|
||||
child: const Text(
|
||||
'Borrar',
|
||||
style: TextStyle(color: AppColors.destructive),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
@@ -69,7 +75,9 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
if (!mounted) return;
|
||||
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(content: Text('Todos los datos locales han sido eliminados.')),
|
||||
const SnackBar(
|
||||
content: Text('Todos los datos locales han sido eliminados.'),
|
||||
),
|
||||
);
|
||||
} catch (error) {
|
||||
if (!mounted) return;
|
||||
@@ -101,7 +109,7 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
onPressed: () => Navigator.of(context).pop(true),
|
||||
child: const Text(
|
||||
'Borrar',
|
||||
style: TextStyle(color: Colors.red),
|
||||
style: TextStyle(color: AppColors.destructive),
|
||||
),
|
||||
),
|
||||
],
|
||||
@@ -115,11 +123,13 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
});
|
||||
|
||||
try {
|
||||
final Map<String, dynamic> response =
|
||||
await AuthApi.instance.deleteAllServerData();
|
||||
final Map<String, dynamic> response = await AuthApi.instance
|
||||
.deleteAllServerData();
|
||||
|
||||
if (response['error'] == true) {
|
||||
throw Exception(response['body'] ?? response['message'] ?? 'Error desconocido');
|
||||
throw Exception(
|
||||
response['body'] ?? response['message'] ?? 'Error desconocido',
|
||||
);
|
||||
}
|
||||
|
||||
await AuthApi.instance.clearTokens();
|
||||
@@ -127,7 +137,9 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
if (!mounted) return;
|
||||
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(content: Text('Toda la información del servidor ha sido eliminada.')),
|
||||
const SnackBar(
|
||||
content: Text('Toda la información del servidor ha sido eliminada.'),
|
||||
),
|
||||
);
|
||||
} catch (error) {
|
||||
if (!mounted) return;
|
||||
@@ -239,7 +251,8 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
});
|
||||
|
||||
try {
|
||||
final String? encryptionKey = await LocalVaultService.instance.readEncryptionKey();
|
||||
final String? encryptionKey = await LocalVaultService.instance
|
||||
.readEncryptionKey();
|
||||
|
||||
if (!mounted) return;
|
||||
|
||||
@@ -286,8 +299,8 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
}) {
|
||||
return ElevatedButton.icon(
|
||||
style: ElevatedButton.styleFrom(
|
||||
backgroundColor: Colors.redAccent,
|
||||
foregroundColor: Colors.white,
|
||||
backgroundColor: AppColors.destructiveAccent,
|
||||
foregroundColor: AppColors.textPrimary,
|
||||
textStyle: const TextStyle(fontWeight: FontWeight.w600),
|
||||
),
|
||||
onPressed: onPressed,
|
||||
@@ -306,8 +319,8 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
final bool isSelected = _selectedSeedColor.value == color.value;
|
||||
final Color foregroundColor =
|
||||
ThemeData.estimateBrightnessForColor(color) == Brightness.dark
|
||||
? Colors.white
|
||||
: Colors.black;
|
||||
? AppColors.textPrimary
|
||||
: AppColors.textOnAccent;
|
||||
|
||||
return Semantics(
|
||||
button: true,
|
||||
@@ -326,12 +339,14 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
color: color,
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
border: Border.all(
|
||||
color: isSelected ? Colors.white : Colors.white24,
|
||||
color: isSelected
|
||||
? AppColors.textPrimary
|
||||
: AppColors.textDisabled,
|
||||
width: isSelected ? 2.5 : 1.2,
|
||||
),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black.withValues(alpha: 0.25),
|
||||
color: AppColors.shadowSoft,
|
||||
blurRadius: 8,
|
||||
offset: const Offset(0, 3),
|
||||
),
|
||||
@@ -341,11 +356,7 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
alignment: Alignment.center,
|
||||
children: [
|
||||
if (isSelected)
|
||||
Icon(
|
||||
Icons.check,
|
||||
size: 22,
|
||||
color: foregroundColor,
|
||||
),
|
||||
Icon(Icons.check, size: 22, color: foregroundColor),
|
||||
],
|
||||
),
|
||||
),
|
||||
@@ -366,10 +377,14 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
try {
|
||||
await ApiConfig.setEndpoint(value);
|
||||
if (!mounted) return;
|
||||
ScaffoldMessenger.of(context).showSnackBar(const SnackBar(content: Text('Endpoint guardado')));
|
||||
ScaffoldMessenger.of(
|
||||
context,
|
||||
).showSnackBar(const SnackBar(content: Text('Endpoint guardado')));
|
||||
} catch (e) {
|
||||
if (!mounted) return;
|
||||
ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('Error guardando endpoint: $e')));
|
||||
ScaffoldMessenger.of(
|
||||
context,
|
||||
).showSnackBar(SnackBar(content: Text('Error guardando endpoint: $e')));
|
||||
}
|
||||
}
|
||||
|
||||
@@ -378,7 +393,9 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
final String endpoint = await ApiConfig.getEndpoint();
|
||||
if (!mounted) return;
|
||||
_endpointController.text = endpoint;
|
||||
ScaffoldMessenger.of(context).showSnackBar(const SnackBar(content: Text('Endpoint restaurado al valor por defecto')));
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(content: Text('Endpoint restaurado al valor por defecto')),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildResponsiveInputActionsRow({
|
||||
@@ -433,17 +450,7 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
body: Container(
|
||||
decoration: const BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
colors: [
|
||||
Color(0xFF191A1D),
|
||||
Color(0xFF222326),
|
||||
Color(0xFF101114),
|
||||
],
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
),
|
||||
),
|
||||
decoration: const BoxDecoration(gradient: AppColors.backdropGradient),
|
||||
child: SafeArea(
|
||||
child: Column(
|
||||
children: [
|
||||
@@ -462,9 +469,7 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
const Expanded(
|
||||
child: Text('Borrar datos locales:'),
|
||||
),
|
||||
const Expanded(child: Text('Borrar datos locales:')),
|
||||
_buildDestructiveButton(
|
||||
label: 'Borrar',
|
||||
onPressed: (_isBusy || _isServerDeleting)
|
||||
@@ -483,7 +488,8 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
),
|
||||
_buildDestructiveButton(
|
||||
label: 'Borrar',
|
||||
onPressed: (_isBusy || _isSyncing || _isServerDeleting)
|
||||
onPressed:
|
||||
(_isBusy || _isSyncing || _isServerDeleting)
|
||||
? null
|
||||
: _confirmAndDeleteServerData,
|
||||
isLoading: _isServerDeleting,
|
||||
@@ -498,14 +504,17 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
child: Text('Forzar sincronizacion total:'),
|
||||
),
|
||||
ElevatedButton.icon(
|
||||
onPressed: (_isBusy || _isSyncing || _isServerDeleting)
|
||||
onPressed:
|
||||
(_isBusy || _isSyncing || _isServerDeleting)
|
||||
? null
|
||||
: _forceSync,
|
||||
icon: _isSyncing
|
||||
? const SizedBox(
|
||||
width: 16,
|
||||
height: 16,
|
||||
child: CircularProgressIndicator(strokeWidth: 2),
|
||||
child: CircularProgressIndicator(
|
||||
strokeWidth: 2,
|
||||
),
|
||||
)
|
||||
: const Icon(Icons.sync),
|
||||
label: const Text('Sincronizar'),
|
||||
@@ -524,31 +533,49 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
const Text('API endpoint (ej: https://notas-api.lpncnd.es/api)'),
|
||||
const Text(
|
||||
'API endpoint (ej: https://notas-api.lpncnd.es/api)',
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
_buildResponsiveInputActionsRow(
|
||||
input: _endpointLoading
|
||||
? const SizedBox(height: 48, child: Center(child: CircularProgressIndicator()))
|
||||
? const SizedBox(
|
||||
height: 48,
|
||||
child: Center(
|
||||
child: CircularProgressIndicator(),
|
||||
),
|
||||
)
|
||||
: TextField(
|
||||
controller: _endpointController,
|
||||
style: const TextStyle(color: Colors.white),
|
||||
style: const TextStyle(
|
||||
color: AppColors.textPrimary,
|
||||
),
|
||||
keyboardType: TextInputType.url,
|
||||
decoration: InputDecoration(
|
||||
labelText: 'API endpoint',
|
||||
labelStyle: TextStyle(color: Colors.white.withValues(alpha: 0.7)),
|
||||
labelStyle: const TextStyle(
|
||||
color: AppColors.textSecondary,
|
||||
),
|
||||
filled: true,
|
||||
fillColor: Colors.white.withValues(alpha: 0.05),
|
||||
fillColor: AppColors.fill,
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
borderSide: BorderSide(color: Colors.white.withValues(alpha: 0.12)),
|
||||
borderSide: const BorderSide(
|
||||
color: AppColors.border,
|
||||
),
|
||||
),
|
||||
enabledBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
borderSide: BorderSide(color: Colors.white.withValues(alpha: 0.12)),
|
||||
borderSide: const BorderSide(
|
||||
color: AppColors.border,
|
||||
),
|
||||
),
|
||||
focusedBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
borderSide: const BorderSide(color: Colors.amber, width: 1.2),
|
||||
borderSide: const BorderSide(
|
||||
color: AppColors.accent,
|
||||
width: 1.2,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
@@ -573,39 +600,56 @@ class _SettingsScreenState extends State<SettingsScreen> {
|
||||
obscureText: !_encryptionKeyVisible,
|
||||
enableSuggestions: false,
|
||||
autocorrect: false,
|
||||
style: const TextStyle(color: Colors.white),
|
||||
style: const TextStyle(color: AppColors.textPrimary),
|
||||
decoration: InputDecoration(
|
||||
labelText: _encryptionKeyVisible ? 'Clave de cifrado' : 'Oculta hasta pulsar mostrar',
|
||||
labelStyle: TextStyle(color: Colors.white.withValues(alpha: 0.7)),
|
||||
labelText: _encryptionKeyVisible
|
||||
? 'Clave de cifrado'
|
||||
: 'Oculta hasta pulsar mostrar',
|
||||
labelStyle: const TextStyle(
|
||||
color: AppColors.textSecondary,
|
||||
),
|
||||
filled: true,
|
||||
fillColor: Colors.white.withValues(alpha: 0.05),
|
||||
fillColor: AppColors.fill,
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
borderSide: BorderSide(color: Colors.white.withValues(alpha: 0.12)),
|
||||
borderSide: const BorderSide(
|
||||
color: AppColors.border,
|
||||
),
|
||||
),
|
||||
enabledBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
borderSide: BorderSide(color: Colors.white.withValues(alpha: 0.12)),
|
||||
borderSide: const BorderSide(
|
||||
color: AppColors.border,
|
||||
),
|
||||
),
|
||||
focusedBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
borderSide: const BorderSide(color: Colors.amber, width: 1.2),
|
||||
borderSide: const BorderSide(
|
||||
color: AppColors.accent,
|
||||
width: 1.2,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
actions: [
|
||||
ElevatedButton(
|
||||
onPressed: _encryptionKeyLoading ? null : _loadEncryptionKey,
|
||||
onPressed: _encryptionKeyLoading
|
||||
? null
|
||||
: _loadEncryptionKey,
|
||||
child: _encryptionKeyLoading
|
||||
? const SizedBox(
|
||||
width: 16,
|
||||
height: 16,
|
||||
child: CircularProgressIndicator(strokeWidth: 2),
|
||||
child: CircularProgressIndicator(
|
||||
strokeWidth: 2,
|
||||
),
|
||||
)
|
||||
: const Text('Mostrar'),
|
||||
),
|
||||
OutlinedButton(
|
||||
onPressed: _encryptionKeyVisible ? _hideEncryptionKey : null,
|
||||
onPressed: _encryptionKeyVisible
|
||||
? _hideEncryptionKey
|
||||
: null,
|
||||
child: const Text('Ocultar'),
|
||||
),
|
||||
],
|
||||
|
||||
Reference in New Issue
Block a user