From c0d0b254525659496bfbdb4365d3a19dbec39627 Mon Sep 17 00:00:00 2001 From: Youssef Date: Mon, 31 Aug 2026 18:12:21 +0100 Subject: [PATCH 1/2] docs(upgrades): emulate the chain.base.org upgrades page on the landing page MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Ports the Upgrades page from chain.base.org (base/ui, app/upgrades) onto the Upgrades tab landing page: a Grid/Timeline toggle over the same four Base upgrades, with per-network activation dates, derived status, change counts, and the upgrade illustrations. Status is computed from each upgrade's per-network lifecycle at render time — a confirmed timestamp resolves to live or scheduled, a bare estimate reads as planning — so the page does not go stale the way the previous hand-maintained status table did. The upstream OP Stack hardfork table and the configuration changelog pointer are unchanged. Generated with Claude Code Co-Authored-By: Claude --- docs/base-chain/specs/upgrades/overview.mdx | 18 +- docs/images/upgrades/azul-illo.svg | 23 + docs/images/upgrades/beryl-illo.svg | 10 + docs/images/upgrades/cobalt-illo.svg | 43 ++ docs/images/upgrades/denim-illo.svg | 31 ++ docs/llms-full.txt | 12 +- docs/llms.txt | 12 +- docs/snippets/UpgradesOverview.jsx | 479 ++++++++++++++++++++ 8 files changed, 606 insertions(+), 22 deletions(-) create mode 100644 docs/images/upgrades/azul-illo.svg create mode 100644 docs/images/upgrades/beryl-illo.svg create mode 100644 docs/images/upgrades/cobalt-illo.svg create mode 100644 docs/images/upgrades/denim-illo.svg create mode 100644 docs/snippets/UpgradesOverview.jsx diff --git a/docs/base-chain/specs/upgrades/overview.mdx b/docs/base-chain/specs/upgrades/overview.mdx index 2753edf05..be62e5f23 100644 --- a/docs/base-chain/specs/upgrades/overview.mdx +++ b/docs/base-chain/specs/upgrades/overview.mdx @@ -1,18 +1,16 @@ --- title: "Upgrades" -description: "Base evolves through named hardforks. Each hardfork introduces protocol changes, new features, or parameter updates that take effect at a specific activation block. This tab tracks what changed, when, and how to migrate." +description: "Track Base network upgrades and their activation status across Base Sepolia and Mainnet." +mode: "wide" --- -## Base Upgrades +import { UpgradesOverview } from "/snippets/UpgradesOverview.jsx"; -| Upgrade | Status | Activation | -|----------|--------|------------| -| [Denim](/base-chain/specs/upgrades/denim/200ms-blocks) | Planning | TBD | -| [Cobalt](/base-chain/specs/upgrades/cobalt/overview) | Upcoming | Sep 2026 | -| [Beryl](/base-chain/specs/upgrades/beryl/overview) | Live | Jun 25, 2026 | -| [Azul](/base-chain/specs/upgrades/azul/overview) | Live | May 28, 2026 | +Base evolves through named network upgrades. Each upgrade introduces protocol changes, new features, or parameter updates that take effect at a specific activation time. This tab tracks what changed, when, and how to migrate. -## Upstream (OP Stack) Hardforks + + +## Upstream OP Stack Hardforks Base inherits upstream OP Stack hardforks. Each entry documents the changes Base adopted. @@ -29,4 +27,4 @@ Base inherits upstream OP Stack hardforks. Each entry documents the changes Base ## Other Changes -The [configuration changelog](/base-chain/network-information/configuration-changelog) tracks network parameter changes that don't belong to a specific hardfork. +The [configuration changelog](/base-chain/network-information/configuration-changelog) tracks network parameter changes that don't belong to a specific upgrade. diff --git a/docs/images/upgrades/azul-illo.svg b/docs/images/upgrades/azul-illo.svg new file mode 100644 index 000000000..aa5960b2a --- /dev/null +++ b/docs/images/upgrades/azul-illo.svg @@ -0,0 +1,23 @@ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/images/upgrades/beryl-illo.svg b/docs/images/upgrades/beryl-illo.svg new file mode 100644 index 000000000..4c704ae35 --- /dev/null +++ b/docs/images/upgrades/beryl-illo.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/docs/images/upgrades/cobalt-illo.svg b/docs/images/upgrades/cobalt-illo.svg new file mode 100644 index 000000000..df62f51cd --- /dev/null +++ b/docs/images/upgrades/cobalt-illo.svg @@ -0,0 +1,43 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/images/upgrades/denim-illo.svg b/docs/images/upgrades/denim-illo.svg new file mode 100644 index 000000000..2513697cf --- /dev/null +++ b/docs/images/upgrades/denim-illo.svg @@ -0,0 +1,31 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/llms-full.txt b/docs/llms-full.txt index ef528684a..036430ac9 100644 --- a/docs/llms-full.txt +++ b/docs/llms-full.txt @@ -87,7 +87,7 @@ const client = createPublicClient({ chain: base, transport: http() }) - [SDKs & APIs](https://docs.base.org/get-started/sdks-and-apis): Choose the Base SDK, API, CLI, or MCP integration that matches what you are building. ## Base Chain -- [Overview](https://docs.base.org/base-chain/overview): Base protocol specifications, core primitives, and network systems. +- [Overview](https://docs.base.org/base-chain/overview): Base protocol specifications — tokens, bridging, transactions, consensus, execution, and proofs. - [Overview](https://docs.base.org/base-chain/specs/overview): Technical specification of the Base Chain protocol, covering block derivation, execution, transaction propagation, and state verification. - [Specification](https://docs.base.org/base-chain/specs/protocol/consensus/index): Specification of the Base rollup node, describing its components and role in L2 block derivation and consensus. - [L2 Execution Engine](https://docs.base.org/base-chain/specs/protocol/execution/index): Specification of the L2 execution engine, detailing EIP-1559 parameters, fee vaults, Engine API usage, and execution layer behavior. @@ -106,7 +106,7 @@ const client = createPublicClient({ chain: base, transport: http() }) - [Holocene](https://docs.base.org/base-chain/specs/upgrades/holocene/overview): Overview of the Holocene hardfork, introducing dynamic EIP-1559 parameters configurable via SystemConfig and stricter block derivation rules. - [Isthmus](https://docs.base.org/base-chain/specs/upgrades/isthmus/overview): Overview of the Isthmus hardfork, incorporating Ethereum Pectra EIPs and introducing the operator fee mechanism for sequencer revenue. - [Jovian](https://docs.base.org/base-chain/specs/upgrades/jovian/overview): Overview of the Jovian hardfork, introducing a configurable minimum base fee and a DA footprint gas scalar for improved fee market stability. -- [Upgrades](https://docs.base.org/base-chain/specs/upgrades/overview): Base evolves through named hardforks. Each hardfork introduces protocol changes, new features, or parameter updates that take effect at a specific activation block. This tab tracks what changed, when, and how to migrate. +- [Upgrades](https://docs.base.org/base-chain/specs/upgrades/overview): Track Base network upgrades and their activation status across Base Sepolia and Mainnet. - [debug_traceBlockByHash](https://docs.base.org/base-chain/api-reference/debug-api/debug_traceBlockByHash): Returns EVM execution traces for all transactions in a block by block hash. - [debug_traceBlockByNumber](https://docs.base.org/base-chain/api-reference/debug-api/debug_traceBlockByNumber): Returns EVM execution traces for all transactions in a block by block number. - [debug_traceTransaction](https://docs.base.org/base-chain/api-reference/debug-api/debug_traceTransaction): Returns the full EVM execution trace for a transaction. Requires a node with debug APIs enabled. @@ -168,10 +168,10 @@ const client = createPublicClient({ chain: base, transport: http() }) - [Security Council for Base](https://docs.base.org/base-chain/security/security-council): This page outlines the purpose, goals, structure, and responsibilities of the Security Council for Base. - [Native Account Abstraction](https://docs.base.org/base-chain/specs/native-account-abstraction): EIP-8130 reference for Base: vibenet chain details, client setup, transaction structure, account configuration, authenticators, and payers. - [Batcher](https://docs.base.org/base-chain/specs/protocol/batcher): Specification of the batcher (batch submitter), the component responsible for posting L2 sequencer data to L1 for data availability. -- [Standard Bridges](https://docs.base.org/base-chain/specs/protocol/bridging/bridges): Specification of the standard bridges enabling cross-domain ETH and ERC20 token transfers between L1 and L2 on Base. -- [Deposits](https://docs.base.org/base-chain/specs/protocol/bridging/deposits): Specification of the deposit mechanism for Base, detailing how L1 transactions are converted into L2 deposit transactions. +- [Standard Bridges](https://docs.base.org/base-chain/specs/protocol/bridging/bridges): Specification of the standard bridge contracts enabling cross-domain ETH and ERC-20 token transfers between L1 and L2 on Base. +- [Deposits](https://docs.base.org/base-chain/specs/protocol/bridging/deposits): How deposits work on Base — from user experience to the protocol-level deposit transaction type and guaranteed gas market. - [Cross Domain Messengers](https://docs.base.org/base-chain/specs/protocol/bridging/messengers): Specification of the cross-domain messenger contracts, providing a higher-level API for sending messages between L1 and L2 on Base. -- [Withdrawals](https://docs.base.org/base-chain/specs/protocol/bridging/withdrawals): Specification of the withdrawal mechanism for Base, describing how L2 state is proven on L1 and funds are released from the bridge. +- [Withdrawals](https://docs.base.org/base-chain/specs/protocol/bridging/withdrawals): How withdrawals work on Base — the standard 3-step flow, the 7-day challenge period, faster options, and the full protocol specification. - [Derivation](https://docs.base.org/base-chain/specs/protocol/consensus/derivation): Specification of the L2 chain derivation pipeline, describing how L2 blocks are deterministically derived from L1 data and sequencer batches. - [P2P](https://docs.base.org/base-chain/specs/protocol/consensus/p2p): Specification of the rollup node peer-to-peer network, covering node discovery, gossip protocol, and unsafe block propagation. - [RPC](https://docs.base.org/base-chain/specs/protocol/consensus/rpc): Specification of the rollup node RPC interface, including the optimism_outputAtBlock method for retrieving L2 output roots. @@ -314,7 +314,7 @@ const client = createPublicClient({ chain: base, transport: http() }) - [Dynamic Upgrades](https://docs.base.org/base-chain/specs/upgrades/cobalt/dynamic-upgrades): An Ethereum smart contract stores upgrade timestamps for Base nodes, allowing forks to activate at the scheduled time with no client restart. - [Native Account Abstraction](https://docs.base.org/base-chain/specs/upgrades/cobalt/eip-8130): Build with native account abstraction on Base. EIP-8130 smart accounts send ordinary transactions, with no bundlers or relays. - [Span-Batches](https://docs.base.org/base-chain/specs/upgrades/delta/span-batches): Specification of span batches introduced in Delta, a new batch format that compresses sequences of L2 blocks for more efficient L1 data posting. -- [200ms native blocks](https://docs.base.org/base-chain/specs/upgrades/denim/200ms-blocks): Specification for Denim's canonical 200ms blocks, including BaseTime, derivation, validation, and RPC behavior. +- [200ms Native Blocks](https://docs.base.org/base-chain/specs/upgrades/denim/200ms-blocks): Specification for Denim's canonical 200ms blocks, including BaseTime, derivation, validation, and RPC behavior. - [Derivation](https://docs.base.org/base-chain/specs/upgrades/ecotone/derivation): Derivation changes in the Ecotone upgrade, extending the retrieval stage to support EIP-4844 blobs as an additional data availability source. - [Ecotone L1 Attributes](https://docs.base.org/base-chain/specs/upgrades/ecotone/l1-attributes): L1 attributes transaction changes in the Ecotone upgrade, updating calldata format to support the new blob-based fee calculation model. - [Fjord L2 Chain Derivation Changes](https://docs.base.org/base-chain/specs/upgrades/fjord/derivation): Derivation changes in the Fjord upgrade, updating protocol parameters for max sequencer drift, channel bank size, and adding brotli compression support. diff --git a/docs/llms.txt b/docs/llms.txt index c242f7cf1..e6ab6a27b 100644 --- a/docs/llms.txt +++ b/docs/llms.txt @@ -21,7 +21,7 @@ - [SDKs & APIs](https://docs.base.org/get-started/sdks-and-apis): Choose the Base SDK, API, CLI, or MCP integration that matches what you are building. ## Base Chain -- [Overview](https://docs.base.org/base-chain/overview): Base protocol specifications, core primitives, and network systems. +- [Overview](https://docs.base.org/base-chain/overview): Base protocol specifications — tokens, bridging, transactions, consensus, execution, and proofs. - [Overview](https://docs.base.org/base-chain/specs/overview): Technical specification of the Base Chain protocol, covering block derivation, execution, transaction propagation, and state verification. - [Specification](https://docs.base.org/base-chain/specs/protocol/consensus/index): Specification of the Base rollup node, describing its components and role in L2 block derivation and consensus. - [L2 Execution Engine](https://docs.base.org/base-chain/specs/protocol/execution/index): Specification of the L2 execution engine, detailing EIP-1559 parameters, fee vaults, Engine API usage, and execution layer behavior. @@ -40,7 +40,7 @@ - [Holocene](https://docs.base.org/base-chain/specs/upgrades/holocene/overview): Overview of the Holocene hardfork, introducing dynamic EIP-1559 parameters configurable via SystemConfig and stricter block derivation rules. - [Isthmus](https://docs.base.org/base-chain/specs/upgrades/isthmus/overview): Overview of the Isthmus hardfork, incorporating Ethereum Pectra EIPs and introducing the operator fee mechanism for sequencer revenue. - [Jovian](https://docs.base.org/base-chain/specs/upgrades/jovian/overview): Overview of the Jovian hardfork, introducing a configurable minimum base fee and a DA footprint gas scalar for improved fee market stability. -- [Upgrades](https://docs.base.org/base-chain/specs/upgrades/overview): Base evolves through named hardforks. Each hardfork introduces protocol changes, new features, or parameter updates that take effect at a specific activation block. This tab tracks what changed, when, and how to migrate. +- [Upgrades](https://docs.base.org/base-chain/specs/upgrades/overview): Track Base network upgrades and their activation status across Base Sepolia and Mainnet. - [debug_traceBlockByHash](https://docs.base.org/base-chain/api-reference/debug-api/debug_traceBlockByHash): Returns EVM execution traces for all transactions in a block by block hash. - [debug_traceBlockByNumber](https://docs.base.org/base-chain/api-reference/debug-api/debug_traceBlockByNumber): Returns EVM execution traces for all transactions in a block by block number. - [debug_traceTransaction](https://docs.base.org/base-chain/api-reference/debug-api/debug_traceTransaction): Returns the full EVM execution trace for a transaction. Requires a node with debug APIs enabled. @@ -102,10 +102,10 @@ - [Security Council for Base](https://docs.base.org/base-chain/security/security-council): This page outlines the purpose, goals, structure, and responsibilities of the Security Council for Base. - [Native Account Abstraction](https://docs.base.org/base-chain/specs/native-account-abstraction): EIP-8130 reference for Base: vibenet chain details, client setup, transaction structure, account configuration, authenticators, and payers. - [Batcher](https://docs.base.org/base-chain/specs/protocol/batcher): Specification of the batcher (batch submitter), the component responsible for posting L2 sequencer data to L1 for data availability. -- [Standard Bridges](https://docs.base.org/base-chain/specs/protocol/bridging/bridges): Specification of the standard bridges enabling cross-domain ETH and ERC20 token transfers between L1 and L2 on Base. -- [Deposits](https://docs.base.org/base-chain/specs/protocol/bridging/deposits): Specification of the deposit mechanism for Base, detailing how L1 transactions are converted into L2 deposit transactions. +- [Standard Bridges](https://docs.base.org/base-chain/specs/protocol/bridging/bridges): Specification of the standard bridge contracts enabling cross-domain ETH and ERC-20 token transfers between L1 and L2 on Base. +- [Deposits](https://docs.base.org/base-chain/specs/protocol/bridging/deposits): How deposits work on Base — from user experience to the protocol-level deposit transaction type and guaranteed gas market. - [Cross Domain Messengers](https://docs.base.org/base-chain/specs/protocol/bridging/messengers): Specification of the cross-domain messenger contracts, providing a higher-level API for sending messages between L1 and L2 on Base. -- [Withdrawals](https://docs.base.org/base-chain/specs/protocol/bridging/withdrawals): Specification of the withdrawal mechanism for Base, describing how L2 state is proven on L1 and funds are released from the bridge. +- [Withdrawals](https://docs.base.org/base-chain/specs/protocol/bridging/withdrawals): How withdrawals work on Base — the standard 3-step flow, the 7-day challenge period, faster options, and the full protocol specification. - [Derivation](https://docs.base.org/base-chain/specs/protocol/consensus/derivation): Specification of the L2 chain derivation pipeline, describing how L2 blocks are deterministically derived from L1 data and sequencer batches. - [P2P](https://docs.base.org/base-chain/specs/protocol/consensus/p2p): Specification of the rollup node peer-to-peer network, covering node discovery, gossip protocol, and unsafe block propagation. - [RPC](https://docs.base.org/base-chain/specs/protocol/consensus/rpc): Specification of the rollup node RPC interface, including the optimism_outputAtBlock method for retrieving L2 output roots. @@ -248,7 +248,7 @@ - [Dynamic Upgrades](https://docs.base.org/base-chain/specs/upgrades/cobalt/dynamic-upgrades): An Ethereum smart contract stores upgrade timestamps for Base nodes, allowing forks to activate at the scheduled time with no client restart. - [Native Account Abstraction](https://docs.base.org/base-chain/specs/upgrades/cobalt/eip-8130): Build with native account abstraction on Base. EIP-8130 smart accounts send ordinary transactions, with no bundlers or relays. - [Span-Batches](https://docs.base.org/base-chain/specs/upgrades/delta/span-batches): Specification of span batches introduced in Delta, a new batch format that compresses sequences of L2 blocks for more efficient L1 data posting. -- [200ms native blocks](https://docs.base.org/base-chain/specs/upgrades/denim/200ms-blocks): Specification for Denim's canonical 200ms blocks, including BaseTime, derivation, validation, and RPC behavior. +- [200ms Native Blocks](https://docs.base.org/base-chain/specs/upgrades/denim/200ms-blocks): Specification for Denim's canonical 200ms blocks, including BaseTime, derivation, validation, and RPC behavior. - [Derivation](https://docs.base.org/base-chain/specs/upgrades/ecotone/derivation): Derivation changes in the Ecotone upgrade, extending the retrieval stage to support EIP-4844 blobs as an additional data availability source. - [Ecotone L1 Attributes](https://docs.base.org/base-chain/specs/upgrades/ecotone/l1-attributes): L1 attributes transaction changes in the Ecotone upgrade, updating calldata format to support the new blob-based fee calculation model. - [Fjord L2 Chain Derivation Changes](https://docs.base.org/base-chain/specs/upgrades/fjord/derivation): Derivation changes in the Fjord upgrade, updating protocol parameters for max sequencer drift, channel bank size, and adding brotli compression support. diff --git a/docs/snippets/UpgradesOverview.jsx b/docs/snippets/UpgradesOverview.jsx new file mode 100644 index 000000000..e995b9c72 --- /dev/null +++ b/docs/snippets/UpgradesOverview.jsx @@ -0,0 +1,479 @@ +// Docs port of the Upgrades page at https://chain.base.org/upgrades +// (source: github.com/base/ui, app/upgrades). Same data model — an upgrade +// carries a per-network lifecycle that is either a confirmed timestamp or a +// coarse estimate — so status is derived at render time and never goes stale. +// +// Two Mintlify constraints shape this file: +// 1. Only the imported export is in scope, so data and helpers shared by the +// two views live inside the component rather than at module level. +// 2. Tailwind classes are rewritten to a `mint-` prefixed subset, and any +// utility outside that subset silently no-ops (emerald and amber, for +// instance). Styling therefore goes through the token + + +
+
+ {tab('grid', 'Grid')} + {tab('timeline', 'Timeline')} +
+
+ + {view === 'grid' ? grid : timeline} + + ); +}; From a6614de50a80950271c63d3da16e04cb237e5dfe Mon Sep 17 00:00:00 2001 From: Youssef Date: Mon, 31 Aug 2026 19:12:19 +0100 Subject: [PATCH 2/2] =?UTF-8?q?fix(upgrades):=20match=20the=20source=20car?= =?UTF-8?q?d=20footer=20=E2=80=94=20filled=20pill,=20sentence-case=20label?= =?UTF-8?q?s?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The outlined View features button read as empty at the bottom: it is bottom-aligned with the date text, so its own vertical padding showed up as slack beneath the label. chain.base.org uses a filled pill there, where the same padding reads as the button's field rather than as a gap. Also brings the footer in line with the source: sentence-case network labels instead of small uppercase, and the title-case "View Features" label. Date type is sized so all four cards keep the pill on the dates row (Cobalt, with "September 2026" twice, is the tightest at 16px of slack); if it ever does wrap, margin-left:auto keeps the pill right-aligned. Generated with Claude Code Co-Authored-By: Claude --- docs/snippets/UpgradesOverview.jsx | 25 +++++++++++++++++++------ 1 file changed, 19 insertions(+), 6 deletions(-) diff --git a/docs/snippets/UpgradesOverview.jsx b/docs/snippets/UpgradesOverview.jsx index e995b9c72..a9c307fd9 100644 --- a/docs/snippets/UpgradesOverview.jsx +++ b/docs/snippets/UpgradesOverview.jsx @@ -152,7 +152,7 @@ export const UpgradesOverview = () => { - View features + View Features @@ -272,6 +272,8 @@ export const UpgradesOverview = () => { --upg-plan-br: #dee1e7; --upg-plan-dot: #9aa1ae; --upg-accent: #0000ff; + --upg-btn: #eef0f3; + --upg-btn-hover: #e3e6eb; } /* ---- Dark theme: system preference ---- */ @media (prefers-color-scheme: dark) { @@ -297,6 +299,8 @@ export const UpgradesOverview = () => { --upg-plan-br: #2b2f36; --upg-plan-dot: #6d7482; --upg-accent: #578bfa; + --upg-btn: rgba(255,255,255,.10); + --upg-btn-hover: rgba(255,255,255,.16); } } /* ---- Dark theme: docs explicit toggle wins over system ---- */ @@ -322,6 +326,8 @@ export const UpgradesOverview = () => { --upg-plan-br: #2b2f36; --upg-plan-dot: #6d7482; --upg-accent: #578bfa; + --upg-btn: rgba(255,255,255,.10); + --upg-btn-hover: rgba(255,255,255,.16); } /* ---- Light theme: docs explicit toggle wins over system dark ---- */ html.light .upg, :root[data-theme="light"] .upg, [data-theme="light"] .upg { @@ -346,6 +352,8 @@ export const UpgradesOverview = () => { --upg-plan-br: #dee1e7; --upg-plan-dot: #9aa1ae; --upg-accent: #0000ff; + --upg-btn: #eef0f3; + --upg-btn-hover: #e3e6eb; } .upg, .upg * { box-sizing: border-box; } @@ -398,16 +406,21 @@ export const UpgradesOverview = () => { gap: 12px; margin-top: auto; padding-top: 16px; border-top: 1px solid var(--upg-border); } - .upg-dates { display: flex; flex-wrap: wrap; gap: 4px 40px; } + .upg-dates { display: flex; flex-wrap: wrap; gap: 4px 24px; } .upg-date { display: flex; flex-direction: column; gap: 2px; } - .upg-date-label { font-size: 10px; letter-spacing: .04em; text-transform: uppercase; color: var(--upg-sub); } + .upg-date-label { font-size: 13px; color: var(--upg-sub); } .upg-date-value { font-size: 14px; white-space: nowrap; color: var(--upg-ink); } + /* A filled pill, as on chain.base.org. An outlined button reads as + empty at the bottom here: it is bottom-aligned with the date text, + so its own padding shows up as slack under the label. */ .upg-button { - padding: 8px 14px; border: 1px solid var(--upg-border); border-radius: 10px; - font-size: 14px; white-space: nowrap; color: var(--upg-ink); + padding: 7px 16px; border: 0; border-radius: 999px; + background: var(--upg-btn); color: var(--upg-ink); + font-size: 14px; line-height: 20px; white-space: nowrap; transition: background-color .15s ease; } - .upg-button:hover { background: var(--upg-panel); } + .upg-button { margin-left: auto; } + .upg-button:hover { background: var(--upg-btn-hover); } /* ---- Timeline view ---- */ /* The rail sits under the node centers: a 96px date column, a 12px gap,