Standardize UI components and styling with Material Design 3

[Copilot]

This PR addresses the inconsistent UI styling throughout the SuiviCommandes application by implementing a comprehensive standardization using Material Design 3 principles.

Problem

The application suffered from inconsistent UI components and styling issues:

• Mixed use of hardcoded colors (@color/cream, @color/lighter) with theme colors
• Inconsistent button styles across different activities
• Text styling variations with hardcoded sizes and colors
• Card layouts using different corner radii and styling approaches
• Navigation components with inconsistent sizing and appearance
• No proper dark theme support

Solution

Implemented a complete UI standardization system:

🎨 Material Design 3 Color System

• Created semantic color tokens for primary, secondary, surface, and error colors
• Added proper light/dark theme support with md_theme_light_* and md_theme_dark_* colors
• Replaced hardcoded colors with theme-aware references

📐 Standardized Spacing & Typography

• Introduced consistent spacing scale (spacing_xs to spacing_xxl)
• Standardized typography using Material Design 3 text appearances
• Created dimension resources for buttons, cards, icons, and layout components

🧩 Component Standardization

• Buttons: Unified all button styles using Widget.App.Button variants (filled, outlined, text, icon)
• Cards: Migrated from CardView to MaterialCardView with consistent styling
• Text Components: Applied Material Design typography scale across all text elements
• Navigation: Standardized icon buttons and navigation components

🔧 Code Quality Improvements

• Removed hardcoded styling from Java code (ItemAdapter)
• Updated button drawables to use theme colors instead of fixed values
• Centralized all styling through the theme system

Key Changes

Layout Files Updated:

• activity_home.xml - Modernized header with Material buttons and proper spacing
• activity_cart.xml - Added toolbar and standardized button styling
• activity_item_details.xml - Complete redesign with proper Material components
• activity_order_confirmation.xml - Enhanced with cards and consistent typography
• item_card.xml - Migrated to MaterialCardView with proper text hierarchy
• item_cart.xml - Standardized with Material buttons and consistent spacing

Resource Files:

• colors.xml - Complete Material Design 3 color palette
• themes.xml / themes-night.xml - Full theme implementation with light/dark support
• styles.xml - Comprehensive component style library
• dimens.xml - Standardized spacing and sizing system

Result

The application now provides a consistent, modern user experience that:

• Follows Material Design 3 guidelines
• Supports proper light/dark theming
• Maintains visual consistency across all screens
• Is easily maintainable with centralized styling
• Provides better accessibility and usability

All UI components are now standardized and the codebase is significantly more maintainable for future updates.

Warning

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

• dl.google.com
  • Triggering command: /usr/lib/jvm/temurin-17-jdk-amd64/bin/java --add-opens=java.base/java.util=ALL-UNNAMED --add-opens=java.base/java.lang=ALL-UNNAMED --add-opens=java.base/java.lang.invoke=ALL-UNNAMED --add-opens=java.prefs/java.util.prefs=ALL-UNNAMED --add-exports=jdk.compiler/com.sun.tools.javac.api=ALL-UNNAMED --add-exports=jdk.compiler/com.sun.tools.javac.util=ALL-UNNAMED --add-opens=java.base/java.nio.charset=ALL-UNNAMED --add-opens=java.base/java.net=ALL-UNNAMED --add-opens=java.base/java.util.concurrent.atomic=ALL-UNNAMED -Xmx2048m -Dfile.encoding=UTF-8 -Duser.country -Duser.language=en -Duser.variant -cp /home/REDACTED/.gradle/wrapper/dists/gradle-8.10.2-bin/a04bxjujx95o3nb99gddekhwo/gradle-8.10.2/lib/gradle-daemon-main-8.10.2.jar -javaagent:/home/REDACTED/.gradle/wrapper/dists/gradle-8.10.2-bin/a04bxjujx95o3nb99gddekhwo/gradle-8.10.2/lib/agents/gradle-instrumentation-agent-8.10.2.jar org.gradle.launcher.daemon.bootstrap.GradleDaemon 8.10.2 (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.