-
Notifications
You must be signed in to change notification settings - Fork 5.4k
fix: snap confirmation footer cp-13.13.0 #38601
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
base: main
Are you sure you want to change the base?
Conversation
|
CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes. |
✨ Files requiring CODEOWNER review ✨✅ @MetaMask/confirmations (1 files, +2 -2)
🫰 @MetaMask/core-platform (12 files, +40 -108)
🧪 @MetaMask/qa (1 files, +12 -0)
|
| &__content { | ||
| .snap-ui-renderer__footer { | ||
| @include design-system.screen-sm-min { | ||
| max-width: calc($width-screen-sm-min - 2px); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- Use container width instead
| backgroundColor={backgroundColor} | ||
| style={{ | ||
| overflowY: 'auto', | ||
| marginBottom: useFooter && hasFooter ? '80px' : '0', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Let footer position itself within
1d71d46 to
6f150ce
Compare
75a8919 to
7250880
Compare
7250880 to
3d511fc
Compare
Builds ready [3d511fc]
UI Startup Metrics (1230 ± 97 ms)
📊 Page Load Benchmark ResultsCurrent Commit: 📄 Localhost MetaMask Test DappSamples: 100 Summary
📈 Detailed Results
Bundle size diffs [🚨 Warning! Bundle size has increased!]
|
FrederikBolding
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This PR breaks sticky footers for Snaps confirmations.
- Go to https://metamask.github.io/snaps/test-snaps/3.0.0/
- Install the interactive UI Snap
- Click create dialog
774ff0d to
daf1c18
Compare
Builds ready [daf1c18]
UI Startup Metrics (1230 ± 87 ms)
📊 Page Load Benchmark ResultsCurrent Commit: 📄 Localhost MetaMask Test DappSamples: 100 Summary
📈 Detailed Results
Bundle size diffs [🚨 Warning! Bundle size has increased!]
|
Builds ready [60ecf9b]
UI Startup Metrics (1271 ± 90 ms)
📊 Page Load Benchmark ResultsCurrent Commit: 📄 Localhost MetaMask Test DappSamples: 100 Summary
📈 Detailed Results
Bundle size diffs [🚨 Warning! Bundle size has increased!]
|
Builds ready [6bf3dde]
UI Startup Metrics (1268 ± 85 ms)
📊 Page Load Benchmark ResultsCurrent Commit: 📄 Localhost MetaMask Test DappSamples: 100 Summary
📈 Detailed Results
Bundle size diffs [🚨 Warning! Bundle size has increased!]
|
Builds ready [3e83bd8]
UI Startup Metrics (1279 ± 98 ms)
📊 Page Load Benchmark ResultsCurrent Commit: 📄 Localhost MetaMask Test DappSamples: 100 Summary
📈 Detailed Results
Bundle size diffs [🚨 Warning! Bundle size has increased!]
|
| &__container > &__panel:first-child { | ||
| overflow-y: auto; | ||
| margin: 0; | ||
| padding: 16px; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This replaces margin with padding for the content, which we don't want to do: See CSS rule above
Description
Fix the confirmation screen footer layout issue in sidepanel
Changelog
CHANGELOG entry: fix: confirmation footer in sidepanel
Related issues
Fixes:
Manual testing steps
Initiate a Tron or Solana Send transaction
Screenshots/Recordings
Before
After
Pre-merge author checklist
Pre-merge reviewer checklist
Note
Refactors Snap UI renderer layout to fix footer and scrolling in sidepanel, updates Snaps routes to RootLayout, and stabilizes E2E pickers by scrolling before interaction.
snap-ui-rendererlayout: make__containerfull-height; move scrolling/padding to first__panel; remove inlinemarginBottomhack and fixed footer positioning inindex.scssandsnap-ui-renderer.js.snapsandsnap-viewstyles to full-height and simplify responsive width logic.margin-bottominline style onsnap-ui-renderer__content.SNAPS_ROUTEandSNAPS_VIEW_ROUTEto useRootLayoutinui/pages/routes/routes.component.tsx.test/e2e/.../snap-interactive-dialog.ts.Written by Cursor Bugbot for commit 3e83bd8. This will update automatically on new commits. Configure here.