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.

Sign up for GitHub

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

Jump to bottom

New Layout #3880

Merged
merged 40 commits into from
Aug 7, 2023
Merged

New Layout #3880

merged 40 commits into from
Aug 7, 2023

Conversation

BiswaViraj
Copy link
Member

@BiswaViraj BiswaViraj commented Jul 31, 2023 •
edited
Loading

What change does this PR introduce?

This is the base PR for the other stacked PRs of new layout updates:

  • New layout design with the content section taking 100% height of the screen
  • New header and sidebar UI
  • new design for the table pages(subscriber list, workflow list, etc)
  • new design for the branding page
  • new design for the settings page
  • new design for the workflow editor
  • new design for the Get started page
  • new Novu logo
  • updated functionality and position for the Intercom. moved to the header.
  • updated the discord invite link

Why was this change needed?

Other information (Screenshots)

image image image image image image

@linear
Copy link

linear bot commented Jul 31, 2023

NV-2442 💅🏽 [Layout] Update the layout of all the pages

What?

General Layout

Reduce redundant visual elements, simplify layout

Why? (Context)

  • Reduce visual noise that leads to low UX, low product credibility, and visual inaccuracy
  • Update the layout canvas so we could fit more elements on the page

Definition of Done

  • All pages have 3 sections on the screen
    • Top section: theme switcher, notification icon, users avatar
    • Header section: Name of the page + controls on the right (relevant to some of the pages, see mocks)
    • Content section: Page content
  • All lists have no pagination – infinite scroll instead
  • Hints are displayed while hovering over an action or a step on the right panel of the workflow editor

Example of the workflow page:

Workflows / New workflow - Visual updates (Figma)

All pages in the mocks:

Workflows / New workflow / Trigger - Visual updates (Figma)

Workflows / New workflow - Visual updates (Figma)

@BiswaViraj BiswaViraj force-pushed the nv-2442-layout-update-the-layout-of-all-the-pages branch from e9207f6 to 7a810f2 Compare July 31, 2023 11:13
@BiswaViraj BiswaViraj changed the title feat: base layout updated NEW LAYOUTS Aug 6, 2023
@BiswaViraj BiswaViraj force-pushed the nv-2442-layout-update-the-layout-of-all-the-pages branch from c51225d to f89f929 Compare August 6, 2023 11:11
@BiswaViraj BiswaViraj marked this pull request as ready for review August 6, 2023 11:12
@scopsy scopsy changed the title NEW LAYOUTS New Layout Aug 6, 2023
@ainouzgali
Copy link
Contributor

@BiswaViraj could you please take a look at the editor of email + in app ? Something looks off there.
Also, shouldn't these be gradient icons?
Screen Shot 2023-08-06 at 15 53 10

@BiswaViraj BiswaViraj force-pushed the nv-2442-layout-update-the-layout-of-all-the-pages branch from f89f929 to 2f51927 Compare August 6, 2023 15:37
@BiswaViraj
Copy link
Member Author

@ainouzgali
Node icons:
image

inApp:
image

email:
image

LetItRock and others added 18 commits August 7, 2023 19:58
@LetItRock @BiswaViraj
chore(web): reusable plus button
7f1ea6b
@BiswaViraj
fix: table alignment
2063db3
@BiswaViraj
feat: removed data column, changed the date format
291f156
@BiswaViraj
feat: make table take nearly full screen height
931ab71
@BiswaViraj
refactor: added data column
2b29595
@BiswaViraj
revert: date format and pagination margins
3111995
@BiswaViraj
feat: updated the get started layout page
61d2199
@BiswaViraj
fix: overflow scrolling issue
886a77c
@BiswaViraj
fix: updated titles
25afb13
@BiswaViraj
feat: workflow add button to use reusable plusbutton
18a24cc
@BiswaViraj
fix: email and inapp layouts
80e07f7
@BiswaViraj
fix: node icon and sidebar icon shared icon states
0906d9e
@BiswaViraj
fix: email screen
fcb048e
@BiswaViraj
refactor: editor sidebar
2467783
@BiswaViraj
fix: add scroll to the providers tab o editor ui
75483b9
@BiswaViraj
fix: add scroll to providers tab
f5fe42f
@BiswaViraj
fix: workflow table edit icon padding, active icon sizes, and changes…
9d8efbd 
… table padding
@BiswaViraj
fix: increase editor height
a7fc76c
@BiswaViraj BiswaViraj force-pushed the nv-2442-layout-update-the-layout-of-all-the-pages branch from 74c7340 to a7fc76c Compare August 7, 2023 14:28
@BiswaViraj BiswaViraj added this pull request to the merge queue Aug 7, 2023
Merged via the queue into next with commit f2fc5e9 Aug 7, 2023
21 of 23 checks passed
@BiswaViraj BiswaViraj deleted the nv-2442-layout-update-the-layout-of-all-the-pages branch August 7, 2023 14:54
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@ainouzgali ainouzgali ainouzgali approved these changes

Assignees
No one assigned
Labels
@novu/web
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@BiswaViraj @ainouzgali @LetItRock