From 9a4e3f836cfc432204e8c30bf2bea6c8a349a436 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Sat, 28 Sep 2024 21:43:07 -0400 Subject: [PATCH] indicate interactivity with subtle hover effect --- .../src/routes/docs/[...path]/OnThisPage.svelte | 8 ++++++-- packages/site-kit/src/lib/styles/text.css | 4 ++++ 2 files changed, 10 insertions(+), 2 deletions(-) diff --git a/apps/svelte.dev/src/routes/docs/[...path]/OnThisPage.svelte b/apps/svelte.dev/src/routes/docs/[...path]/OnThisPage.svelte index d3c25d8d79..9a2914d038 100644 --- a/apps/svelte.dev/src/routes/docs/[...path]/OnThisPage.svelte +++ b/apps/svelte.dev/src/routes/docs/[...path]/OnThisPage.svelte @@ -102,13 +102,17 @@ text-transform: uppercase; color: var(--sk-text-4); + &:hover { + color: var(--sk-text-3); + } + &::before { content: ''; position: absolute; right: 0; top: calc(50% - 0.5em); - width: 1em; - height: 1em; + width: 2rem; + height: 2rem; background: url($lib/icons/chevron.svg); background-size: contain; rotate: -90deg; diff --git a/packages/site-kit/src/lib/styles/text.css b/packages/site-kit/src/lib/styles/text.css index 0df325e646..b8369d182a 100644 --- a/packages/site-kit/src/lib/styles/text.css +++ b/packages/site-kit/src/lib/styles/text.css @@ -374,6 +374,10 @@ details.legacy { font-size: var(--sk-text-xs); user-select: none; + &:hover { + color: var(--sk-text-3); + } + &::after { position: absolute; display: flex;