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

Design System - Full page extension views #4371

Closed
pete-watters opened this issue Oct 18, 2023 · 23 comments · Fixed by #4655
Closed

Design System - Full page extension views #4371

pete-watters opened this issue Oct 18, 2023 · 23 comments · Fixed by #4655
Assignees
@pete-watters
Labels
area:ui UI engineering specific tasks. effort:large Expected to take over 1 week of integration work enhancement
Milestone
Establish UI library

Comments

@pete-watters
Copy link
Contributor

pete-watters commented Oct 18, 2023 •
edited by mica000
Loading

When working on #4165 it became apparent that more changes would be needed to support the new design.

It's desired that for most screens:

  • when in extension view we should fill the screen
  • a lot of screens we use are modals
  • these need to
    • be a modal when in full screen mode
    • change to be a page when in extension view
    • have context specific headers when in extension view
272258431-c40a35d3-a825-42a1-b2a6-5483bbb90492

This task relates to #4370 and builds upon #4165

Add resource in designs
Screenshot 2023-11-21 at 17 35 20
@pete-watters pete-watters self-assigned this Oct 18, 2023
@pete-watters pete-watters added Enhancement 💡 area:ui UI engineering specific tasks. labels Oct 18, 2023
@pete-watters pete-watters mentioned this issue Oct 18, 2023
Closed
@pete-watters
Copy link
Contributor Author

@markmhendrickson : we had a call yesterday to clear up the scope of #4165 . We have split up the work into two issues #4370 and #4371

CC @mica000 @kyranjamie @fabric-8

This was referenced Oct 18, 2023
Closed
Merged
@mica000 mica000 mentioned this issue Oct 24, 2023
Open
@pete-watters pete-watters mentioned this issue Oct 25, 2023
Closed
@pete-watters
Copy link
Contributor Author

This issue needs to also fix this: #4477

@pete-watters pete-watters mentioned this issue Nov 6, 2023
Closed
@pete-watters pete-watters mentioned this issue Nov 21, 2023
Closed
@pete-watters
Copy link
Contributor Author

pete-watters commented Nov 21, 2023 •
edited
Loading

Related to issue #4477 this issue also needs to resolve #4549

When working on this we can also add our own custom scroll bars and fix the other issues listed in
#3488

@pete-watters pete-watters mentioned this issue Nov 21, 2023
Closed
@pete-watters
Copy link
Contributor Author

We had another report of issues with the account select list we need to solve here #4568

@markmhendrickson
Copy link
Collaborator

I presume the Ledger-specific modals will also be covered by this general update?

Image

@pete-watters
Copy link
Contributor Author

I presume the Ledger-specific modals will also be covered by this general update?

Image

We will have to do it for all modals so they look OK in pop-up mode so we will include Ledger also.

In your screenshot, that's actually in pop-up mode, so I guess we should also include it there too

@DeeList DeeList mentioned this issue Nov 30, 2023
Closed
@314159265359879 314159265359879 mentioned this issue Dec 11, 2023
Closed
@pete-watters pete-watters linked a pull request Dec 15, 2023 that will close this issue
Full page extension views, containers, shared headers + footers #4655
Merged
21 tasks
@pete-watters
Copy link
Contributor Author

I've been working on this as part of this PR. In order to create containers, it first makes sense to fix this issue of modals / full page views

@pete-watters pete-watters mentioned this issue Dec 15, 2023
Merged
21 tasks
@pete-watters
Copy link
Contributor Author

@markmhendrickson : I've opened a PR with this work done. I added a demo video you can see here

pete-watters added a commit that referenced this issue Dec 19, 2023
@pete-watters
chore: migrate base drawer to radix dialog for full page responsivene…
3e1ec6f 
…ss, ref #4371
@pete-watters
Copy link
Contributor Author

I've made some good progress with this but there are still some bugs I need to fix in the PR.

I'll fix those and then get to work creating re-usable headers / footers

pete-watters added a commit that referenced this issue Dec 20, 2023
@pete-watters
chore: migrate base drawer to radix dialog for full page responsivene…
ec3333c 
…ss, ref #4371
@pete-watters
Copy link
Contributor Author

Another fix to be included here is #4714

We had an external contributor open this PR which adds a workaround but the issue is more to do with the screen height not responding properly so I will take it into consideration for containers and fix it properly.

pete-watters added a commit that referenced this issue Dec 22, 2023
@pete-watters
chore: migrate base drawer to radix dialog for full page responsivene…
97b765f 
…ss, ref #4371
@pete-watters
Copy link
Contributor Author

There's some changes to make to the onboarding screens that affect the headers so I will tackle those also and do everything together.

@markmhendrickson markmhendrickson added this to the Establish UI library milestone Jan 2, 2024
pete-watters added a commit that referenced this issue Mar 5, 2024
@pete-watters
chore: replace drawer with dialog, add containers and global header f…
169d2ec 
…ooters, refactor onboarding, ref #4371
pete-watters added a commit that referenced this issue Mar 6, 2024
@pete-watters
chore: replace drawer with dialog, add containers and global header f…
6885c34 
…ooters, refactor onboarding, ref #4371
pete-watters added a commit that referenced this issue Mar 7, 2024
@pete-watters
chore: replace drawer with dialog, add containers and global header f…
be98542 
…ooters, refactor onboarding, ref #4371
pete-watters added a commit that referenced this issue Mar 7, 2024
@pete-watters
chore: replace drawer with dialog, add containers and global header f…
23ca6c3 
…ooters, refactor onboarding, ref #4371
pete-watters added a commit that referenced this issue Mar 8, 2024
@pete-watters
chore: replace drawer with dialog, add containers and global header f…
4c7e57a 
…ooters, refactor onboarding, ref #4371
pete-watters added a commit that referenced this issue Mar 11, 2024
@pete-watters
chore: replace drawer with dialog, add containers and global header f…
19161d5 
…ooters, refactor onboarding, ref #4371
pete-watters added a commit that referenced this issue Mar 11, 2024
@pete-watters
chore: replace drawer with dialog, add containers and global header f…
3b9c736 
…ooters, refactor onboarding, ref #4371
pete-watters added a commit that referenced this issue Mar 11, 2024
@pete-watters
chore: replace drawer with dialog, add containers and global header f…
e6660c1 
…ooters, refactor onboarding, ref #4371
pete-watters added a commit that referenced this issue Mar 11, 2024
@pete-watters
chore: replace drawer with dialog, add containers and global header f…
ba8892e 
…ooters, refactor onboarding, ref #4371
pete-watters added a commit that referenced this issue Mar 11, 2024
@pete-watters
chore: replace drawer dialog, containers and global header footers, o…
feaf8c4 
…nboarding, settings, ref #4371
pete-watters added a commit that referenced this issue Mar 11, 2024
@pete-watters
chore: replace drawer dialog, containers and global header footers, o…
6cf8f31 
…nboarding, settings, ref #4371
pete-watters added a commit that referenced this issue Mar 11, 2024
@pete-watters
chore: replace drawer dialog, containers and global header footers, o…
36ddca1 
…nboarding, settings, ref #4371
pete-watters added a commit that referenced this issue Mar 13, 2024
@pete-watters
chore: replace drawer dialog, containers and global header footers, o…
1fea6cf 
…nboarding, settings, ref #4371
pete-watters added a commit that referenced this issue Mar 13, 2024
@pete-watters
chore: replace drawer dialog, containers and global header footers, o…
ca9c77d 
…nboarding, settings, ref #4371
pete-watters added a commit that referenced this issue Mar 14, 2024
@pete-watters
chore: replace drawer dialog, containers and global header footers, o…
0fb3282 
…nboarding, settings, ref #4371
pete-watters added a commit that referenced this issue Mar 15, 2024
@pete-watters
chore: replace drawer dialog, containers and global header footers, o…
2cee55a 
…nboarding, settings, ref #4371
pete-watters added a commit that referenced this issue Mar 15, 2024
@pete-watters
chore: replace drawer dialog, containers and global header footers, o…
2953be5 
…nboarding, settings, ref #4371
pete-watters added a commit that referenced this issue Mar 15, 2024
@pete-watters
chore: replace drawer dialog, containers and global header footers, o…
fa83b63 
…nboarding, settings, ref #4371
fbwoolf pushed a commit that referenced this issue Mar 18, 2024
@pete-watters @fbwoolf
chore: replace drawer dialog, containers and global header footers, o…
66a68b6 
…nboarding, settings, ref #4371
pete-watters added a commit that referenced this issue Mar 19, 2024
@pete-watters
chore: replace drawer dialog, containers and global header footers, o…
224f3b2 
…nboarding, settings, ref #4371
pete-watters added a commit that referenced this issue Mar 21, 2024
@pete-watters
chore: replace drawer dialog, containers and global header footers, o…
7949664 
…nboarding, settings, ref #4371
pete-watters added a commit that referenced this issue Mar 22, 2024
@pete-watters
chore: replace drawer dialog, containers and global header footers, o…
c2f1ec3 
…nboarding, settings, ref #4371
pete-watters added a commit that referenced this issue Mar 22, 2024
@pete-watters
chore: replace drawer dialog, containers and global header footers, o…
429c842 
…nboarding, settings, ref #4371
pete-watters added a commit that referenced this issue Mar 28, 2024
@pete-watters
chore: replace drawer dialog, containers and global header footers, o…
0f33d98 
…nboarding, settings, ref #4371
github-merge-queue bot pushed a commit that referenced this issue Mar 28, 2024
@pete-watters
chore: replace drawer dialog, containers and global header footers, o…
6262267 
…nboarding, settings, ref #4371
@pete-watters pete-watters mentioned this issue Apr 8, 2024
Merged
kyranjamie pushed a commit that referenced this issue Apr 10, 2024
@semantic-release-bot
chore(release): 6.33.0
7b78c24 
## [6.33.0](v6.32.1...v6.33.0) (2024-04-10)

### Features

* add balances shimmer loader, closes [#5119](#5119) ([5c1c284](5c1c284))
* add src-20 token balances, closes [#3751](#3751) ([fb859b6](fb859b6))
* add stacks balance loader ([20418ab](20418ab))
* change query persister to chrome storage, closes [#5153](#5153) ([1cd2625](1cd2625))
* compliance checks ([6df0869](6df0869))
* stacks ft fiat values from alex-sdk, closes [#4653](#4653) ([0f7e44e](0f7e44e))
* support multiple recipients in rpc send transfer method, closes [#5174](#5174) ([a470a57](a470a57))

### Bug Fixes

* add border to onboarding form ([a6bda2d](a6bda2d))
* container when resized ([909fa0c](909fa0c))
* dependabot ([d927ec0](d927ec0))
* deprecate InfoCard to add border correctly ([b6864cd](b6864cd))
* fix routing issues with send flow ([f32151d](f32151d))
* only show messages on homepage ([8228c11](8228c11))
* refetch brc20 tokens on window focus ([a985e0f](a985e0f))
* shimmer styles import ([868ee71](868ee71))
* swap test ([85eb975](85eb975))
* swap toggle with new routing ([f179f3e](f179f3e))
* use signed stacks account in transaction [#4923](#4923) ([6dca269](6dca269))

### Internal

* Add wallet user survey, adjust styling ([3c242cf](3c242cf))
* disable compliance check ([b4b1d11](b4b1d11))
* fmt ([a937795](a937795))
* implement fix to limit amount of accounts rendered ([629ef97](629ef97))
* post-release merge back ([3c9c0f8](3c9c0f8))
* replace drawer dialog, containers and global header footers, onboarding, settings, ref [#4371](#4371) ([6262267](6262267))
* swaps routes, closes [#4317](#4317) ([70c51a1](70c51a1))
* ugprade dev packages ([4ed8326](4ed8326))
* update express, ref [#5130](#5130) ([264bf8d](264bf8d))
* update prettier package ([e75990f](e75990f))
* update stx avatar ([03fe093](03fe093))
* update undici, ref [#4956](#4956) ([8019e0d](8019e0d))
* update webpack + axios, ref [#5090](#5090) ([77803f5](77803f5))
* upgrade redux toolkit, redux ([2eb8090](2eb8090))
@pete-watters pete-watters mentioned this issue Apr 11, 2024
Closed
@pete-watters pete-watters mentioned this issue Jul 10, 2024
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@pete-watters pete-watters

Labels
area:ui UI engineering specific tasks. effort:large Expected to take over 1 week of integration work enhancement
Projects
None yet
Milestone
Establish UI library
Development

Successfully merging a pull request may close this issue.

Full page extension views, containers, shared headers + footers leather-io/extension
6 participants
@markmhendrickson @kyranjamie @pete-watters @fabric-8 @fbwoolf @mica000