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: adjust grid for mobile #231

Open
wants to merge 3 commits into
base: dev
Choose a base branch
from
Open

feat: adjust grid for mobile #231

wants to merge 3 commits into from

Conversation

sofiiadan
Copy link
Contributor

Adjust space for mobile (not sure if this is all that is needed)

Copy link

vercel bot commented Apr 9, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated (UTC)
space ❌ Failed (Inspect) Jun 20, 2024 0:44am

@sofiiadan sofiiadan marked this pull request as draft April 9, 2024 22:28
@sofiiadan sofiiadan self-assigned this Apr 9, 2024
@sofiiadan sofiiadan requested a review from simon-hng April 9, 2024 22:29
@sofiiadan sofiiadan added the chore label Apr 9, 2024
@Cyro292
Copy link
Contributor

Cyro292 commented Apr 15, 2024

Looks Nice.
Regarding Keys and Opportunities:
There is a responsive layout issue observed when accessing the profile on devices with screens smaller than 500px in width. When the profile dropdown is activated, the size of the Table fluctuates, enlarging and shrinking dynamically. This behavior causes certain UI elements to be displaced, with some elements extending beyond the boundaries of the container.

image image

@Cyro292
Copy link
Contributor

Cyro292 commented Apr 15, 2024

If you have time left a few minor things:

In opportunities when having a screen <440px.

  1. The gap between the frame and card increases excessively as the screen size decreases. The spacing should remain consistent regardless of screen size (red)
  2. Additional spacing is needed between the Button and the Header to improve layout clarity (blue).

image

When additing questionaires:

  1. Increase the spacing between the 'Save' and 'Remove' buttons to prevent accidental clicks. Consider relocating the 'Remove' button or adding a confirmation dialog to enhance user experience and prevent unintended actions.

image

@simon-hng simon-hng changed the title Draft: adjust grid for mobile Feat: adjust grid for mobile Apr 18, 2024
@simon-hng simon-hng changed the title Feat: adjust grid for mobile feat: adjust grid for mobile Apr 18, 2024
@Max-vS Max-vS marked this pull request as ready for review June 20, 2024 12:48
Copy link
Collaborator

@BehsadRiemer BehsadRiemer left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Overall, the changes are great and look good. Just some more fixes to make the UI more smooth. I will be commenting a summary.

@@ -11,7 +11,7 @@ interface Props {
export default function RootLayout({ children }: Props) {
return (
<html lang="en">
<body>
<body className="">
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this is a redundant change, can be taken out.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

These are the default breakpoint widths, not needed.

@BehsadRiemer
Copy link
Collaborator

Screenshot 2024-06-21 at 11 22 41 The delete button seems to overflow, maybe consider putting this under "Review a candidate"

@BehsadRiemer
Copy link
Collaborator

Screenshot 2024-06-21 at 11 22 10

The questionnaire seems to be overflowing. Please consider making the size scale properly for mobile views.

@BehsadRiemer
Copy link
Collaborator

Screenshot 2024-06-21 at 11 45 12

The save and delete button can also be placed below the "Configure an existing opportunity"

@BehsadRiemer
Copy link
Collaborator

Screenshot 2024-06-21 at 11 22 25

"Start new review" is overflowing here and can be placed below "see and edit your reviews" for mobile views.

@BehsadRiemer
Copy link
Collaborator

Screenshot 2024-06-21 at 11 21 52

The webhook URL can be bigger.

@BehsadRiemer
Copy link
Collaborator

BehsadRiemer commented Jun 21, 2024

Screenshot 2024-06-21 at 11 20 15

Export data can be placed below " applications for {opportunity name}"

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

Successfully merging this pull request may close these issues.

None yet

4 participants