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
+74 -24
View File
@@ -37,7 +37,11 @@ class EtatBox extends StatelessWidget {
case EtatChecklist.deteriore:
background = const Color(0xFFFFFBEB);
border = const Color(0xFFFDE68A);
contenu = const Icon(Icons.priority_high, size: 16, color: Color(0xFFD97706));
contenu = const Icon(
Icons.priority_high,
size: 16,
color: Color(0xFFD97706),
);
}
}
@@ -73,15 +77,36 @@ class ChecklistTableau extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Column(
children: [
_entete(),
for (var i = 0; i < accessoires.length; i++) _ligne(i),
],
return LayoutBuilder(
builder: (context, constraints) {
final columnWidth = constraints.maxWidth < 520 ? 58.0 : 72.0;
return Container(
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 6),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(10),
border: Border.all(color: EnsupColors.line, width: 1.5),
boxShadow: [
BoxShadow(
color: EnsupColors.text.withValues(alpha: 0.035),
blurRadius: 10,
offset: const Offset(0, 3),
),
],
),
child: Column(
children: [
_entete(columnWidth),
for (var i = 0; i < accessoires.length; i++)
_ligne(i, columnWidth),
],
),
);
},
);
}
Widget _entete() {
Widget _entete(double columnWidth) {
return Container(
padding: const EdgeInsets.symmetric(vertical: 10),
decoration: const BoxDecoration(
@@ -90,9 +115,9 @@ class ChecklistTableau extends StatelessWidget {
child: Row(
children: [
Expanded(child: _texteEntete("ÉLÉMENT")),
_colonneEntete("PRÉSENT"),
_colonneEntete("ABSENT"),
_colonneEntete("DÉTÉRIORÉ"),
_colonneEntete("PRÉSENT", columnWidth),
_colonneEntete("ABSENT", columnWidth),
_colonneEntete("DÉTÉRIORÉ", columnWidth),
],
),
);
@@ -110,11 +135,16 @@ class ChecklistTableau extends StatelessWidget {
);
}
Widget _colonneEntete(String label) {
return SizedBox(width: 72, child: Center(child: _texteEntete(label)));
Widget _colonneEntete(String label, double width) {
return SizedBox(
width: width,
child: Center(
child: FittedBox(fit: BoxFit.scaleDown, child: _texteEntete(label)),
),
);
}
Widget _ligne(int index) {
Widget _ligne(int index, double columnWidth) {
return Container(
padding: const EdgeInsets.symmetric(vertical: 10),
decoration: const BoxDecoration(
@@ -125,20 +155,23 @@ class ChecklistTableau extends StatelessWidget {
Expanded(
child: Text(
accessoires[index],
style: GoogleFonts.titilliumWeb(fontSize: 14, color: EnsupColors.text2),
style: GoogleFonts.titilliumWeb(
fontSize: 14,
color: EnsupColors.text2,
),
),
),
_case(index, EtatChecklist.present),
_case(index, EtatChecklist.absent),
_case(index, EtatChecklist.deteriore),
_case(index, EtatChecklist.present, columnWidth),
_case(index, EtatChecklist.absent, columnWidth),
_case(index, EtatChecklist.deteriore, columnWidth),
],
),
);
}
Widget _case(int index, EtatChecklist type) {
Widget _case(int index, EtatChecklist type, double width) {
return SizedBox(
width: 72,
width: width,
child: Center(
child: EtatBox(
type: type,
@@ -152,7 +185,11 @@ class ChecklistTableau extends StatelessWidget {
/// Encadré d'instructions / rappel à côté d'une checklist.
class ChecklistInstructions extends StatelessWidget {
const ChecklistInstructions({super.key, required this.titre, required this.texte});
const ChecklistInstructions({
super.key,
required this.titre,
required this.texte,
});
final String titre;
final String texte;
@@ -164,7 +201,10 @@ class ChecklistInstructions extends StatelessWidget {
decoration: BoxDecoration(
color: EnsupColors.blue2.withValues(alpha: 0.05),
borderRadius: BorderRadius.circular(10),
border: Border.all(color: EnsupColors.blue2.withValues(alpha: 0.15), width: 1.5),
border: Border.all(
color: EnsupColors.blue2.withValues(alpha: 0.15),
width: 1.5,
),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
@@ -181,7 +221,11 @@ class ChecklistInstructions extends StatelessWidget {
const SizedBox(height: 8),
Text(
texte,
style: GoogleFonts.titilliumWeb(fontSize: 13, color: EnsupColors.text2, height: 1.6),
style: GoogleFonts.titilliumWeb(
fontSize: 13,
color: EnsupColors.text2,
height: 1.6,
),
),
],
),
@@ -208,10 +252,16 @@ class ChecklistCommentaire extends StatelessWidget {
style: GoogleFonts.titilliumWeb(fontSize: 13, color: EnsupColors.text),
decoration: InputDecoration(
hintText: hint,
hintStyle: GoogleFonts.titilliumWeb(fontSize: 13, color: EnsupColors.muted),
hintStyle: GoogleFonts.titilliumWeb(
fontSize: 13,
color: EnsupColors.muted,
),
filled: true,
fillColor: Colors.white,
contentPadding: const EdgeInsets.symmetric(horizontal: 14, vertical: 12),
contentPadding: const EdgeInsets.symmetric(
horizontal: 14,
vertical: 12,
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(9),
borderSide: const BorderSide(color: EnsupColors.line, width: 1.5),