Goal of this workshop
The goal of this workshop is to learn how to style some MUI components using the McMaster Digital Branding Guidelines. You will not be an expert on MUI by the end of the class and this is okay. We want to cover the basics of MUI styling, but as with any skill, mastering it takes practice. You will also learn the basics of mobile user interface design as well as how to use the WAVE tool to evaluate your website for AODA compliance.
Learning Objectives
At the end of this workshop, attendees will be able to:
- Style a Next.js application with MUI components
- Use custom typography fonts and styles
- Style common interactive UI elements like buttons, speed dials and file input widgets
- Modify web application components to scale properly on small screen devices
- Evaluate your website for AODA compliance using the WAVE tool and fix common accessibility errors
- Design and implement accessible focus indicators for common MUI components