francelu commented 2 weeks ago

Responsive layout for `EditProfileScreen

Description

This PR introduces a responsive layout (typography, padding, layout, ...) for EditProfileScreen. It closes issue #174, subtask from #82.

Changes

Use LazyColumn (by default scrollable) instead of a Column component in EditProfileScreen's Scaffold.
New val iconButtonSize in Dimens.kt for the edit profile picture IconButton.
Adapted layout in EditProfileScreen.

Files

Added

None.

Modified

EditProfileScreen.kt: adapt layout to be responsive to all screen sizes.
Dimens.kt: add new val iconButtonSize which is 5/3 of iconSize.

Removed

None.

Dependencies Added

None.

Testing

Verified on multiple emulators to ensure consistent and responsive design across different screen sizes.

Screenshots

Screen	Before	After
Compact S
Compact M
Compact L
Medium (horizontal)
Medium
Extended

francelu commented 2 weeks ago

Suggestions

Add comments for some dimension variables such as cardElevation and cardRounded

@Harrish92
On the wiki, you'll find a padding and typography guidelines, as well as some examples.
That's why I didn't put comments on the file as it would be quite unreadable the more we add variables.

Do you still think it would be good to add in-line documentation ?

Harrish92 commented 2 weeks ago

@Harrish92 On the wiki, you'll find a padding and typography guidelines, as well as some examples. That's why I didn't put comments on the file as it would be quite unreadable the more we add variables.

Do you still think it would be good to add in-line documentation ?

@francelu You can precise that all the details are on the wiki in the code comments.

francelu commented 2 weeks ago

@Harrish92
Good idea ! I'll add that :)