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

[HOLD for payment 2024-02-19] [Wave8] [Ideal Nav] Page header design follow up #35571

Closed
mountiny opened this issue Feb 1, 2024 · 30 comments
Closed
Assignees
Labels
Awaiting Payment Auto-added when associated PR is deployed to production Daily KSv2 NewFeature Something to build that is a new item.

Comments

@mountiny
Copy link
Contributor

mountiny commented Feb 1, 2024

Coming from here

Here's the plan:

  • Leave the normal page header component as it currently is in production
    • 👉 This will require some follow-up work after ideal nav is merged to revert RHP and "normal" page headers from 80px (introduced in the PR) to what it was before (73px I believe)
  • Introduce a new style of page header that includes an illustration
    • These are 80px tall and use h2s for the font style
    • These are the "center pane" headers we see in the Account Settings pages, for example
  • Don't worry about the difference of page header heights in the desktop account settings pages (and all pages that have a nav on the left hand side—which uses standard page headers—and a center pane—which use the new illustration + h2 style headers)
Issue OwnerCurrent Issue Owner: @stephanieelliott
@mountiny mountiny added Daily KSv2 NewFeature Something to build that is a new item. labels Feb 1, 2024
Copy link

melvin-bot bot commented Feb 1, 2024

@melvin-bot melvin-bot bot added Weekly KSv2 and removed Daily KSv2 labels Feb 1, 2024
@mountiny
Copy link
Contributor Author

mountiny commented Feb 1, 2024

@dannymcclain @kosmydel @filip-solecki

@mountiny mountiny self-assigned this Feb 1, 2024
@kosmydel
Copy link
Contributor

kosmydel commented Feb 2, 2024

Hey, thanks for creating this issue. I will work on this!

@mountiny
Copy link
Contributor Author

mountiny commented Feb 2, 2024

@kosmydel Thank you! Are you able to address this one today?

@kosmydel
Copy link
Contributor

kosmydel commented Feb 2, 2024

Sure. I can switch my priorities.

@shubham1206agra
Copy link
Contributor

I believe it should be 72px as every size is a multiple of 4.

@kosmydel
Copy link
Contributor

kosmydel commented Feb 2, 2024

This value is taken from the designs. But I also was a bit surprised with this value.

Screenshot 2024-02-02 at 13 37 03

@shubham1206agra
Copy link
Contributor

@Expensify/design Can you please confirm the value here?

@melvin-bot melvin-bot bot added Reviewing Has a PR in review Weekly KSv2 and removed Weekly KSv2 labels Feb 2, 2024
@shawnborton
Copy link
Contributor

I have a feeling it was 73px to account for a potential 1px border that happens. That being said, happy to use 72px since we rarely have the border here (and typically it's only on a chat header).

That being said, can we confirm what this value was before the ideal nav PR? I think we should just revert it to what it was previously.

@shubham1206agra
Copy link
Contributor

I am seeing 65px on staging.

@shawnborton
Copy link
Contributor

Can you share a screenshot of that please?

@shubham1206agra
Copy link
Contributor

Screenshot 2024-02-02 at 7 10 03 PM

Here you go

@shawnborton
Copy link
Contributor

Interesting... could have sworn that would have been 72/73.

@dannymcclain
Copy link
Contributor

Yeah I was thinking that the "correct" height was 72px but we made it 73px in Figma to account for the border.

But since we're not really using borders on headers anymore (until scroll—is that still a thing?) I think we should just pick a number and standardize.

My vote would be for either 64px if we want to keep it super close to what it is in staging or 72px if we want to give it a teeny tiny bit extra room (this will match Figma more closely). Both are nice base-4 numbers that feel good.

Once we decide, I think the @Expensify/design team should make sure this component is updated in Figma (it could probably use a little love anyways since a lot has changed with these headers since the component was first created).

@shawnborton
Copy link
Contributor

I think we should do 72px personally, it does feel like it gives it a teeny more breathing room.

@dannymcclain
Copy link
Contributor

That sounds perfectly great to me. Can it be decided? :gavel:?

@shawnborton
Copy link
Contributor

Decided! 72 it is.

@shubham1206agra
Copy link
Contributor

@kosmydel Please update the height as stated above.

@hayata-suenaga
Copy link
Contributor

@kosmydel do you think you can handle this issue together?

@kosmydel
Copy link
Contributor

kosmydel commented Feb 5, 2024

@kosmydel Please update the height as stated above.

I'm OOO, I will fix it tomorrow.

@kosmydel do you think you can handle this issue together?

Sure, I can have a look at this tomorrow.

@melvin-bot melvin-bot bot added Weekly KSv2 and removed Weekly KSv2 labels Feb 8, 2024
@stephanieelliott
Copy link
Contributor

Looks like the PR was updated and is on staging now!

Copy link

melvin-bot bot commented Feb 9, 2024

⚠️ Looks like this issue was linked to a Deploy Blocker here

If you are the assigned CME please investigate whether the linked PR caused a regression and leave a comment with the results.

If a regression has occurred and you are the assigned CM follow the instructions here.

If this regression could have been avoided please consider also proposing a recommendation to the PR checklist so that we can avoid it in the future.

@melvin-bot melvin-bot bot added Weekly KSv2 Awaiting Payment Auto-added when associated PR is deployed to production and removed Weekly KSv2 labels Feb 12, 2024
@melvin-bot melvin-bot bot changed the title [Wave8] [Ideal Nav] Page header design follow up [HOLD for payment 2024-02-19] [Wave8] [Ideal Nav] Page header design follow up Feb 12, 2024
@melvin-bot melvin-bot bot removed the Reviewing Has a PR in review label Feb 12, 2024
Copy link

melvin-bot bot commented Feb 12, 2024

Reviewing label has been removed, please complete the "BugZero Checklist".

Copy link

melvin-bot bot commented Feb 12, 2024

The solution for this issue has been 🚀 deployed to production 🚀 in version 1.4.39-8 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

If no regressions arise, payment will be issued on 2024-02-19. 🎊

For reference, here are some details about the assignees on this issue:

  • @kosmydel does not require payment (Contractor)

Copy link

melvin-bot bot commented Feb 12, 2024

BugZero Checklist: The PR adding this new feature has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

  • [@kosmydel] Please propose regression test steps to ensure the new feature will work correctly on production in further releases.
  • [@stephanieelliott] Link the GH issue for creating/updating the regression test once above steps have been agreed upon.

@mountiny
Copy link
Contributor Author

$500 to @shubham1206agra for testing and review

No regression test required for this I think

@melvin-bot melvin-bot bot added Daily KSv2 and removed Weekly KSv2 labels Feb 18, 2024
Copy link

melvin-bot bot commented Feb 19, 2024

Payment Summary

Upwork Job

BugZero Checklist (@stephanieelliott)

  • I have verified the correct assignees and roles are listed above and updated the neccesary manual offers
  • I have verified that there are no duplicate or incorrect contracts on Upwork for this job (https://www.upwork.com/ab/applicants//hired)
  • I have paid out the Upwork contracts or cancelled the ones that are incorrect
  • I have verified the payment summary above is correct

@melvin-bot melvin-bot bot added the Overdue label Feb 20, 2024
@stephanieelliott
Copy link
Contributor

@shubham1206agra I extended the offer to you in Upwork, please accept when you get a chance: https://www.upwork.com/jobs/~018b9bc79836e2ae70

@melvin-bot melvin-bot bot removed the Overdue label Feb 21, 2024
@shubham1206agra
Copy link
Contributor

@stephanieelliott Accepted

@stephanieelliott
Copy link
Contributor

Thanks @shubham1206agra, all paid!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Awaiting Payment Auto-added when associated PR is deployed to production Daily KSv2 NewFeature Something to build that is a new item.
Projects
Status: Done
Development

No branches or pull requests

7 participants