style(frontend): polish student workspace

This commit is contained in:
SaidSoighiri94
2026-07-23 10:27:27 +02:00
parent 1c8ed77ebf
commit 695b0d3965
12 changed files with 1162 additions and 484 deletions
@@ -3,7 +3,7 @@ import "package:google_fonts/google_fonts.dart";
import "../theme/ensup_colors.dart";
/// Option d'identification de l'écran de connexion (QR ou mail ENSUP).
class IdentificationOption extends StatelessWidget {
class IdentificationOption extends StatefulWidget {
const IdentificationOption({
super.key,
required this.icon,
@@ -19,56 +19,102 @@ class IdentificationOption extends StatelessWidget {
final String description;
final VoidCallback? onTap;
@override
State<IdentificationOption> createState() => _IdentificationOptionState();
}
class _IdentificationOptionState extends State<IdentificationOption> {
bool _hovered = false;
@override
Widget build(BuildContext context) {
return InkWell(
onTap: onTap,
borderRadius: BorderRadius.circular(12),
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 18),
return MouseRegion(
onEnter: (_) => setState(() => _hovered = true),
onExit: (_) => setState(() => _hovered = false),
cursor: SystemMouseCursors.click,
child: AnimatedContainer(
duration: const Duration(milliseconds: 160),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
border: Border.all(color: EnsupColors.line, width: 2),
),
child: Row(
children: [
Container(
width: 48,
height: 48,
decoration: BoxDecoration(
color: iconColor.withValues(alpha: 0.1),
borderRadius: BorderRadius.circular(12),
border: Border.all(
color: _hovered ? widget.iconColor : EnsupColors.line,
width: 1.5,
),
boxShadow: [
BoxShadow(
color: widget.iconColor.withValues(
alpha: _hovered ? 0.12 : 0.035,
),
child: Icon(icon, color: iconColor, size: 24),
blurRadius: _hovered ? 16 : 8,
offset: const Offset(0, 4),
),
const SizedBox(width: 16),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
],
),
child: Material(
color: Colors.transparent,
child: InkWell(
onTap: widget.onTap,
borderRadius: BorderRadius.circular(12),
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 18, vertical: 17),
child: Row(
children: [
Text(
label,
style: GoogleFonts.darkerGrotesque(
fontWeight: FontWeight.w700,
fontSize: 18,
color: EnsupColors.text,
Container(
width: 48,
height: 48,
decoration: BoxDecoration(
color: widget.iconColor.withValues(alpha: 0.1),
borderRadius: BorderRadius.circular(12),
),
child: Icon(widget.icon, color: widget.iconColor, size: 24),
),
const SizedBox(width: 14),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
widget.label,
style: GoogleFonts.darkerGrotesque(
fontWeight: FontWeight.w800,
fontSize: 18,
height: 1.05,
color: EnsupColors.text,
),
),
const SizedBox(height: 4),
Text(
widget.description,
maxLines: 2,
overflow: TextOverflow.ellipsis,
style: GoogleFonts.titilliumWeb(
fontSize: 12,
color: EnsupColors.muted,
height: 1.35,
),
),
],
),
),
const SizedBox(height: 3),
Text(
description,
style: GoogleFonts.titilliumWeb(
fontSize: 12,
color: EnsupColors.muted,
height: 1.4,
const SizedBox(width: 8),
Container(
width: 28,
height: 28,
decoration: BoxDecoration(
color: widget.iconColor.withValues(alpha: 0.08),
shape: BoxShape.circle,
),
child: Icon(
Icons.chevron_right_rounded,
color: widget.iconColor,
size: 19,
),
),
],
),
),
const Icon(Icons.chevron_right, color: EnsupColors.muted, size: 20),
],
),
),
),
);