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

feat: redesign sidebar with corporate branding and ProsApp logo

Browse Source 
- Logo: network image in white card + tagline
- Sidebar: deep navy gradient (#0D1B3E) with blue accent active states
- MenuItem: left accent bar indicator, cleaner hover, better contrast
- Mode toggle: gradient button matching brand colors
- TextSeparator: uppercase label with divider line

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Lizandro Guarnizo
2026-06-27 07:40:08 -05:00
co-authored by Claude Sonnet 4.6
parent c8e5d481ed
commit 77f44ac43a
4 changed files with 200 additions and 162 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/ui/shared/widgets/logo.dart
+28 -12
View File
@@ -1,5 +1,4 @@
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
class Logo extends StatelessWidget {
const Logo({super.key});
@@ -7,21 +6,38 @@ class Logo extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.only(top: 30),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
padding: const EdgeInsets.symmetric(vertical: 28, horizontal: 20),
child: Column(
children: [
Image.asset('logo.png', width: 50, height: 50),
SizedBox(width: 8),
Text(
'Prosapp',
style: GoogleFonts.montserratAlternates(
fontSize: 20,
fontWeight: FontWeight.w200,
Container(
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 10),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
),
child: Image.network(
'https://www.prosapp.co/img/logo_prosapp.png',
height: 32,
fit: BoxFit.contain,
errorBuilder: (_, __, ___) => const Text(
'ProsApp',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Color(0xFF42A4EF),
),
),
),
),
const SizedBox(height: 8),
const Text(
'Conecta con profesionales',
style: TextStyle(
color: Color(0xFF8BAFD4),
fontSize: 10,
letterSpacing: 0.3,
),
),
SizedBox(width: 10),
],
),
);
lib/ui/shared/widgets/menu_item.dart
+52 -38
View File
@@ -1,5 +1,10 @@
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
const _kAccent = Color(0xFF42A4EF);
const _kTextActive = Colors.white;
const _kTextInactive = Color(0xFF8BAFD4);
const _kIconActive = _kAccent;
const _kIconInactive = Color(0xFF5A7A9B);
class MenuItem extends StatefulWidget {
final String text;
@@ -24,45 +29,54 @@ class _MenuItemState extends State<MenuItem> {
@override
Widget build(BuildContext context) {
return AnimatedContainer(
duration: const Duration(milliseconds: 300),
color: isHovered
? Colors.white.withOpacity(0.1)
: widget.isActive
? Colors.white.withOpacity(0.1)
: Colors.transparent,
child: Material(
color: Colors.transparent,
child: InkWell(
onTap: widget.isActive ? null : () => widget.onPressed(),
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 30,
vertical: 10,
),
child: MouseRegion(
cursor: widget.isActive
? SystemMouseCursors.basic
: SystemMouseCursors.click,
onEnter: (_) => setState(() => isHovered = true),
onExit: (_) => setState(() => isHovered = false),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Icon(
widget.icon,
color: Colors.white.withOpacity(0.3),
final active = widget.isActive;
final highlight = active || isHovered;
return MouseRegion(
cursor: active ? SystemMouseCursors.basic : SystemMouseCursors.click,
onEnter: (_) => setState(() => isHovered = true),
onExit: (_) => setState(() => isHovered = false),
child: GestureDetector(
onTap: active ? null : () => widget.onPressed(),
child: AnimatedContainer(
duration: const Duration(milliseconds: 200),
margin: const EdgeInsets.symmetric(horizontal: 12, vertical: 2),
decoration: BoxDecoration(
color: highlight
? const Color(0xFF42A4EF).withOpacity(0.12)
: Colors.transparent,
borderRadius: BorderRadius.circular(10),
),
child: Row(
children: [
AnimatedContainer(
duration: const Duration(milliseconds: 200),
width: 3,
height: 36,
decoration: BoxDecoration(
color: active ? _kAccent : Colors.transparent,
borderRadius: const BorderRadius.only(
topRight: Radius.circular(3),
bottomRight: Radius.circular(3),
),
const SizedBox(width: 10),
Text(
widget.text,
style: GoogleFonts.roboto(
color: Colors.white.withOpacity(0.8),
),
),
],
),
),
),
const SizedBox(width: 12),
Icon(
widget.icon,
color: active ? _kIconActive : _kIconInactive,
size: 20,
),
const SizedBox(width: 10),
Text(
widget.text,
style: TextStyle(
color: active ? _kTextActive : _kTextInactive,
fontSize: 13,
fontWeight: active ? FontWeight.w600 : FontWeight.w400,
),
),
],
),
),
),
lib/ui/shared/widgets/text_separator.dart
+18 -9
View File
@@ -1,20 +1,29 @@
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
class TextSeparator extends StatelessWidget {
final String text;
const TextSeparator({super.key, required this.text});
@override
Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.symmetric(horizontal: 20),
margin: EdgeInsets.only(bottom: 5),
child: Text(
text,
style: GoogleFonts.roboto(
color: Colors.white.withOpacity(0.3), fontSize: 12),
return Padding(
padding: const EdgeInsets.fromLTRB(20, 16, 20, 4),
child: Row(
children: [
Text(
text.toUpperCase(),
style: const TextStyle(
color: Color(0xFF4A6F8A),
fontSize: 10,
fontWeight: FontWeight.w600,
letterSpacing: 1.2,
),
),
const SizedBox(width: 8),
const Expanded(
child: Divider(color: Color(0xFF1E3A52), thickness: 1, height: 1),
),
],
),
);
}