Fix mobile vault external link

## Why

The primary external vault CTA was hidden on mobile vault detail pages. On the YieldNest Max Vaults page this meant the Euler link was present on desktop, but unavailable in the mobile header.

## Lessons learnt

Vault detail header CTAs need explicit mobile coverage because the Technical Details fallback link can hide a header visibility regression.

## Summary

- Keep the external vault CTA visible in the vault detail header on mobile.
- Add an integration test covering mobile visibility for an external vault link.

Author: miohtama

src/routes/trading-view/vaults/[vault=slug]/VaultPageHeader.svelte

@@ -27,11 +27,9 @@
 	{#snippet cta()}
 		<span class="cta-actions">
 			{#if vault.link}
-				<span class="external-link">
-					<Button href={vault.link} target="_blank" rel="noreferrer">
-						View on {externalSiteName}
-					</Button>
-				</span>
+				<Button href={vault.link} target="_blank" rel="noreferrer">
+					View on {externalSiteName}
+				</Button>
 			{/if}
 			<UpdateInfoButton size="md" />
 		</span>
@@ -50,12 +48,6 @@
 		gap: 0.75rem;
 	}
 
-	.external-link {
-		@media (--viewport-sm-down) {
-			display: none;
-		}
-	}
-
 	.vault-description {
 		margin: 0;
 		font: var(--f-ui-lg-roman);

tests/integration/trading-view/vaults/index.test.ts

@@ -339,6 +339,18 @@ test.describe('vault index page', () => {
 		await expect(page.locator('.notes')).toHaveCount(0);
 	});
 
+	test('shows the external vault link in the mobile detail header', async ({ page }) => {
+		await page.setViewportSize({ width: 390, height: 844 });
+		await page.goto('/trading-view/vaults/morpho-flagged-blacklisted-vault');
+
+		const externalVaultLink = page.getByRole('link', { name: 'View on Morpho' });
+		await expect(externalVaultLink).toBeVisible();
+		await expect(externalVaultLink).toHaveAttribute(
+			'href',
+			'https://app.euler.finance/earn/0xc3415c9231dad88f8146107372143f6dae042967?network=arbitrum'
+		);
+	});
+
 	test('warns when deposits may be disabled on a vault detail page', async ({ page }) => {
 		await page.goto('/trading-view/vaults/deposit-disabled-vault');
 

tests/mocks/top-vaults/list.mock.ts

@@ -315,6 +315,7 @@ const morphoFlaggedBlacklistedVault = createTestVault('Morpho flagged blackliste
 	address: '0xc3415c9231dad88f8146107372143f6dae042967',
 	chain: 'arbitrum',
 	protocol: 'Morpho',
+	link: 'https://app.euler.finance/earn/0xc3415c9231dad88f8146107372143f6dae042967?network=arbitrum',
 	current_nav: 20_000,
 	peak_nav: 30_000,
 	risk: 'Blacklisted',