Two panels slide in the mobile nav. The main one animates `transform`. Its sibling animated `left` — which relayouts the nav subtree every frame AND registers as layout shift, because moving an element's layout box is exactly what CLS measures. Measured under a 4x CPU throttle at 390x844: CLS 0.726 with `left`, 0 with `transform`. Google calls anything above 0.25 "poor", so the menu was scoring nearly 3x poor on a tap. The rewrite is pixel-identical, not an approximation. The element is absolute + w-full inside a containing block with no padding, so `left: 0` is its static position and translateX(100% + 24px) reproduces the old offset exactly. It now mirrors its sibling: same distance, same duration, same property. Motion also moves out of this repo. The local `skeleton-shimmer` keyframe is retired in favour of the design system's loading state — per-element background-position shimmer measures 33.6fps at 1460 concurrent skeletons and 13.8fps at 3000 under the same throttle, while skeletons that hold still measure 120fps at every count. Reasoning and full numbers are in section 6c of @luxfi/ui/tokens.css. Also wraps one 174-char className. It was already over the 160 limit; no staged change had made the linter look at this file until now. Co-authored-by: Hanzo Dev <[email protected]>
DEPRECATED — see ~/work/lux/explorer/
The standalone Next.js frontend in this repo is no longer deployed. Its build output is embedded directly into the Lux Explorer Go binary (
ghcr.io/luxfi/explorer:1.2.1) viago:embed. Run that single binary in production.This repo is preserved as the source of the embedded SPA assets. Updates to the UI ship via a rebuild of the explorer image, not by deploying this Next.js app separately.
Canonical deploy:
~/work/lux/explorer/(Go binary, single process, indexer + GraphQL + SPA, port 8090).
Lux Explore frontend (legacy)
Frontend application for Lux Network blockchain explorer
Running and configuring the app
App is distributed as a docker image. Here you can find information about the package and its recent releases.
You can configure your app by passing necessary environment variables when starting the container. See full list of ENVs and their description here.
docker run -p 3000:3000 --env-file <path-to-your-env-file> ghcr.io/blockscout/frontend:latest
Alternatively, you can build your own docker image and run your app from that. Please follow this guide.
For more information on migrating from the previous frontend, please see the frontend migration docs.
Contributing
See our Contribution guide for pull request protocol. We expect contributors to follow our code of conduct when submitting code or comments.
Resources
- App ENVs list
- Contribution guide
- Making a custom build
- Frontend migration guide
- Manual deployment guide with backend and microservices
License
This project is licensed under the GNU General Public License v3.0. See the LICENSE file for details.