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

feat: Responsive web frontend #429

Open
wants to merge 10 commits into
base: main
Choose a base branch
from

Conversation

JM-Rib
Copy link

@JM-Rib JM-Rib commented Jan 23, 2025

Responsive web frontend

This pull requests adapts the interface to a desktop sized screen in a responsive manner.

What's new?

  • Created a new Nav rail for desktop view
  • Unbound the max width that was set in SizedBox object of main.dart
  • Set a SizedBox with a maximum width around input fields

Why is it important?

How to Use?

  • Use a desktop platform to see the changes

Screenshots

Screenshot_20250123_124805


Screenshot_20250123_124833


Screenshot_20250123_124942


Screenshot_20250123_125004



@MDeLuise
Copy link
Owner

Hi @JM-Rib,
Thank you for the great work on this! I've been testing the changes, and everything seems smooth and is definitely a useful improvement.

I did notice one issue: the frontend tests are failing due to the following warning:

warning • Unused import: 'package:plant_it/commons.dart' • lib/main.dart:5:8 • unused_import

It should be sufficient to remove the import from the main.dart file:

import 'package:plant_it/commons.dart';

@JM-Rib
Copy link
Author

JM-Rib commented Jan 27, 2025

Hi ! Thanks for the feedback, it's fixed now!

@MDeLuise
Copy link
Owner

MDeLuise commented Feb 4, 2025

Thanks for the work on this.

I have a question to better understand the implementation effort involved. Would it be feasible to add an option in the app settings to enable/disable this new UI? Perhaps we could place it below the "Server" section in a new "App" section, with a setting called "Wide UI." This would allow users to choose between the mobile version and the new UI, depending on their preference.
It would be great if this setting could be saved in the local shared_preferences and only displayed on wider screens.

Looking forward to your thoughts on this!

@JM-Rib
Copy link
Author

JM-Rib commented Feb 6, 2025

Hi, that would be a great implementation idea!

I'll look into it and keep you up to date once I come up with something. I can definitely see the specifics of it and how this would work out.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Would it be feasible to make the web frontend responsive?
2 participants