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

Login page #214

Merged
merged 22 commits into from
Oct 10, 2024
Merged

Login page #214

merged 22 commits into from
Oct 10, 2024

Conversation

MRita443
Copy link
Collaborator

Closes #140

Initial implementation of member login page

Screenshots

image

Review checklist

  • Contains enough appropriate tests
  • Behavior is as expected
  • Clean, well-structured code

Copy link
Member

@LuisDuarte1 LuisDuarte1 left a comment

Choose a reason for hiding this comment

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

Good progress overall 🚀, besides responsiveness and the color issue in tailwind which you are working on, the scaling looks weird on a display with lower vertical resolution (which is the first image in this case, and the case with my laptop 😄 ) maybe the login should scale down accordingly to make the experience more consistent

@codecov
Copy link

codecov bot commented Jul 14, 2023

Codecov Report

Attention: Patch coverage is 0% with 146 lines in your changes missing coverage. Please review.

Project coverage is 0.86%. Comparing base (2fb1530) to head (0af8cb5).
Report is 11 commits behind head on develop.

Files Patch % Lines
...n/_components/variable-visibility-input.stories.ts 0.00% 47 Missing and 1 partial ⚠️
src/routes/(app)/login/+page.svelte 0.00% 36 Missing ⚠️
...login/_components/variable-visibility-input.svelte 0.00% 23 Missing and 1 partial ⚠️
src/routes/(app)/login/page.stories.ts 0.00% 14 Missing and 1 partial ⚠️
src/lib/components/icons/icon.svelte 0.00% 4 Missing ⚠️
src/lib/components/icons/icons.ts 0.00% 4 Missing ⚠️
src/routes/(app)/_components/layout/sidebar.svelte 0.00% 4 Missing ⚠️
src/routes/(app)/(home)/page.stories.ts 0.00% 2 Missing ⚠️
src/routes/(app)/+layout.svelte 0.00% 2 Missing ⚠️
src/routes/(app)/layout.stories.ts 0.00% 2 Missing ⚠️
... and 4 more
Additional details and impacted files
@@            Coverage Diff             @@
##           develop    #214      +/-   ##
==========================================
- Coverage     1.01%   0.86%   -0.15%     
==========================================
  Files           49      51       +2     
  Lines         1584    1857     +273     
  Branches        51      53       +2     
==========================================
  Hits            16      16              
- Misses        1521    1792     +271     
- Partials        47      49       +2     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

Copy link
Member

@LuisDuarte1 LuisDuarte1 left a comment

Choose a reason for hiding this comment

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

Good job making this work on all desktops 🥳 but I have some concerns about the colors that we talked about in the retrospective

tailwind.config.cjs Outdated Show resolved Hide resolved
@BrunoRosendo BrunoRosendo requested a review from a team July 26, 2023 01:28
Copy link
Member

@BrunoRosendo BrunoRosendo left a comment

Choose a reason for hiding this comment

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

I'm not sure why but the small icon my password manager adds really screws up the password container. This is a bit concerning since I've never seen this before and password managers are pretty popular. Can you investigate?

image

src/lib/component/Icon.svelte Outdated Show resolved Hide resolved
src/lib/component/VariableVisibilityInput.svelte Outdated Show resolved Hide resolved
@BrunoRosendo
Copy link
Member

Also, it'd be nice to have this in storybook too

@MRita443
Copy link
Collaborator Author

MRita443 commented Aug 8, 2023

I'm not sure why but the small icon my password manager adds really screws up the password container. This is a bit concerning since I've never seen this before and password managers are pretty popular. Can you investigate?

image

I tried replicating this placing small icons on top of the input but I couldn't. Could you maybe inspect the page and share the code, or let me know the extension name?

src/routes/login/page.stories.ts Outdated Show resolved Hide resolved
Copy link
Member

@LuisDuarte1 LuisDuarte1 left a comment

Choose a reason for hiding this comment

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

Nice progress, it's not 100% responsive yet though, as you can see on my phone, the login is not properly centered and overlapping the hamburger menu:

Also it seems that you have an issue with importing layout from login/page.stories.ts that causes storybook to fail 😅

@MRita443
Copy link
Collaborator Author

@BrunoRosendo @LuisDuarte1 pls re-review :)

Copy link
Member

@BrunoRosendo BrunoRosendo left a comment

Choose a reason for hiding this comment

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

really minor stuff

The page looks good IMO and the PR is pretty much ready for merge

src/routes/(app)/_components/layout/sidebar.svelte Outdated Show resolved Hide resolved
<br />
<button><a href="/profile">Profile</a></button>
</form>
<!-- Colocar a página toda scrollable incluindo footer, ver container queries -->
Copy link
Member

Choose a reason for hiding this comment

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

Suggested change
<!-- Colocar a página toda scrollable incluindo footer, ver container queries -->

Copy link
Member

Choose a reason for hiding this comment

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

is this still a problem? I don't think so

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

It seems like it is a problem on really short screens, but a general one at that because it happens not only on this page.
image
Do you think this is worth concerning about? I might open a new issue on it

Copy link
Member

Choose a reason for hiding this comment

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

Ah I see! Open an issue, we can think about a fix later on

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

I think this is fixed by #278, I thought this was a problem just with the mobile sidebar and didn't notice this case but it's fixed too

src/routes/api/[...endpoint]/proxy.ts Show resolved Hide resolved
@MRita443
Copy link
Collaborator Author

@LuisDuarte1 pls re-review

@MRita443 MRita443 dismissed LuisDuarte1’s stale review October 10, 2024 18:00

Left the project, issue fixed

@MRita443 MRita443 merged commit dfca5cc into develop Oct 10, 2024
5 checks passed
@MRita443 MRita443 deleted the feature/login-page branch October 10, 2024 18:00
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.

auth: implement login page
3 participants