Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Blocked #1815] Migrate away from material bridge theme & fully integrate with material #4895

Open
BenHenning opened this issue Mar 10, 2023 · 0 comments
Labels
enhancement End user-perceivable enhancements. Impact: Medium Moderate perceived user impact (non-blocking bugs and general improvements). Issue: Needs Break-down Indicates that an issue is too large and should be broken into smaller chunks. Work: Medium The means to find the solution is clear, but it isn't at good-first-issue level yet.

Comments

@BenHenning
Copy link
Member

Is your feature request related to a problem? Please describe.
The codebase currently uses Material's bridge themes for both day & night modes as Oppia's base themes. This causes an unintentional side-effect: it defaults the app's animations & styles to be AppCompat's rather than Material's where we can selectively inherit from Material for specific components (which we do for a few). This leads to requiring more styling & investigative work when trying to get good UIs in the app (a recent example was me trying to introduce a CircularProgressIndicator and not being able to figure out why it wasn't animating by default).

Describe the solution you'd like
We can actually get a much better "base UI" by using Material's theme by switching over using Material's base themes instead of the bridge themes. However, this isn't as simple as just updating the base themes; all themes & styles in the app will need to be audited & updated to correctly integrate with Material's. We probably also need to make a pass on layout & UI code to ensure only Material classes are used (e.g. MaterialButton instead of Button), and add regex checks to enforce this long-term.

Describe alternatives you've considered
The only alternative would be to continue the current approach of integrating with material in select ways, but this doesn't seem sustainable as the app becomes more complex since:

  1. This problem becomes harder to solve as the app gets larger (whereas the long-term maintenance should be easier than the current approach).
  2. The current wiring is pretty complicated and leads to extra time being lost implementing UIs due to needing to investigate specific aesthetic issues, like animations not working. I expect this will worsen if the team decides to prioritize improving animations & transitions throughout the app (as these will come much more easily with default Material component behaviors).

Additional context
I think this should reasonably be blocked on #1815 since, without screenshot testing, changing core styles that may affect niche UI components anywhere in the app will be very error-prone and challenging to verify.

For historical context, I think we originally went with the bridge theme because the early app was being designed lightly based on Material design, and we had some design deviations. These might actually need to be resolved as part of a consolidation effort when moving over to the Material base themes, however I think that effort should result in a more consistent UI across the entire app (and allow developers to benefit a bit more from the developer-focus of Material design).

@adhiamboperes adhiamboperes added Impact: Medium Moderate perceived user impact (non-blocking bugs and general improvements). Issue: Needs Break-down Indicates that an issue is too large and should be broken into smaller chunks. Work: Medium The means to find the solution is clear, but it isn't at good-first-issue level yet. labels Jun 15, 2023
@seanlip seanlip added enhancement End user-perceivable enhancements. and removed Type: Improvement labels Jun 16, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement End user-perceivable enhancements. Impact: Medium Moderate perceived user impact (non-blocking bugs and general improvements). Issue: Needs Break-down Indicates that an issue is too large and should be broken into smaller chunks. Work: Medium The means to find the solution is clear, but it isn't at good-first-issue level yet.
Development

No branches or pull requests

3 participants