use-ink / contracts-ui

Web application for deploying wasm smart contracts on Substrate chains that include the FRAME contracts pallet
https://contracts-ui.substrate.io/
GNU General Public License v3.0
61 stars 44 forks source link

chore: ui polish 💅 #528

Closed peetzweg closed 7 months ago

peetzweg commented 7 months ago

Use RootLayout for /instantiate

Before we did not use the RootLayout on the /instatiate route, which caused the page to jump on navigation.

Before

https://github.com/paritytech/contracts-ui/assets/839848/44aec7ce-1f78-4e94-bef5-a01d80383e30

Instantiation Review

Before we used a lot of space and showed truncated values for code hash and extrinsic data. This truncated data was lossy, the user was not able to copy the whole value through the truncation.

Now it shows both values in full and each value on a dedicated row. Making it as transparent as possible what is going to happen.

Before

After

Dry Run Results

Uses newer css gap feature instead of multiple usages of mb/margin-bottom on individual elements.

Before

After

netlify[bot] commented 7 months ago

Deploy Preview for contracts-ui ready!

Name Link
Latest commit 156766806aac70a829fe5b2703c0a2c56d04ae4b
Latest deploy log https://app.netlify.com/sites/contracts-ui/deploys/655c8fc57ef8bf0007e00c1f
Deploy Preview https://deploy-preview-528--contracts-ui.netlify.app/
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

cypress[bot] commented 7 months ago

Passing run #278 ↗︎

0 61 0 0 Flakiness 0
⚠️ You've recorded test results over your free plan limit.
Upgrade your plan to view test results.

Details:

use newer `gap` css feature
Project: Contracts UI Commit: 156766806a
Status: Passed Duration: 02:00 💡
Started: Nov 21, 2023 11:11 AM Ended: Nov 21, 2023 11:13 AM

Review all test suite changes for PR #528 ↗︎