Skip to content

Commit

Permalink
format
Browse files Browse the repository at this point in the history
  • Loading branch information
Rich-Harris committed Dec 19, 2024
1 parent 4eeac8e commit 972fa5c
Show file tree
Hide file tree
Showing 3 changed files with 34 additions and 33 deletions.
50 changes: 25 additions & 25 deletions packages/site-kit/src/lib/nav/MobileMenu.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -66,41 +66,41 @@
class="clip"
style:--height-difference="{menu_height - universal_menu_inner_height}px"
ontransitionstart={(e) => {
const target = e.target as HTMLElement;
const target = e.target as HTMLElement;

if (!target?.classList.contains('viewport')) return;
if (e.propertyName !== 'transform') return;
if (!target?.classList.contains('viewport')) return;
if (e.propertyName !== 'transform') return;

// we need to apply a clip-path during the transition so that the contents
// are constrained to the menu background, but only while the transition
// is running, otherwise it prevents the contents from being scrolled
const a = 'calc(var(--height-difference) + 1px)';
const b = '1px';
// we need to apply a clip-path during the transition so that the contents
// are constrained to the menu background, but only while the transition
// is running, otherwise it prevents the contents from being scrolled
const a = 'calc(var(--height-difference) + 1px)';
const b = '1px';

const start = show_context_menu ? a : b;
const end = show_context_menu ? b : a;
const start = show_context_menu ? a : b;
const end = show_context_menu ? b : a;

const container = e.currentTarget;
const container = e.currentTarget;

container.style.clipPath = `polygon(0% ${start}, 100% ${start}, 100% 100%, 0% 100%)`;
container.style.clipPath = `polygon(0% ${start}, 100% ${start}, 100% 100%, 0% 100%)`;

setTimeout(() => {
container.style.clipPath = `polygon(0% ${end}, 100% ${end}, 100% 100%, 0% 100%)`;
}, 0);
}}
setTimeout(() => {
container.style.clipPath = `polygon(0% ${end}, 100% ${end}, 100% 100%, 0% 100%)`;
}, 0);
}}
ontransitionend={(e) => {
const target = e.target as HTMLElement;
const target = e.target as HTMLElement;

if (!target?.classList.contains('viewport')) return;
if (e.propertyName !== 'transform') return;
if (!target?.classList.contains('viewport')) return;
if (e.propertyName !== 'transform') return;

e.currentTarget.style.clipPath = '';
e.currentTarget.style.clipPath = '';

// whenever we transition from one menu to the other, we need to move focus to the first item in the new menu
if (!show_context_menu) {
universal_menu?.querySelector('a')?.focus();
}
}}
// whenever we transition from one menu to the other, we need to move focus to the first item in the new menu
if (!show_context_menu) {
universal_menu?.querySelector('a')?.focus();
}
}}
>
<div
class="viewport"
Expand Down
7 changes: 4 additions & 3 deletions packages/site-kit/src/lib/nav/Nav.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -98,9 +98,10 @@ Top navigation bar for the application. It provides a slot for the left side, th
<a
class="secondary"
href={section.path}
aria-current={$page.url.pathname === section.path || $page.url.pathname.startsWith(section.path!)
? 'page'
: undefined}
aria-current={$page.url.pathname === section.path ||
$page.url.pathname.startsWith(section.path!)
? 'page'
: undefined}
>
{section.title}
</a>
Expand Down
10 changes: 5 additions & 5 deletions packages/site-kit/src/lib/search/SearchBox.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -172,11 +172,11 @@ It appears when the user clicks on the `Search` component or presses the corresp
<input
use:forcefocus
onkeydown={(e) => {
if (e.key === 'Enter' && !e.isComposing) {
const element = modal.querySelector('a[data-has-node]') as HTMLElement | undefined;
element?.click();
}
}}
if (e.key === 'Enter' && !e.isComposing) {
const element = modal.querySelector('a[data-has-node]') as HTMLElement | undefined;
element?.click();
}
}}
oninput={(e) => {
$search_query = e.currentTarget.value;
}}
Expand Down

0 comments on commit 972fa5c

Please sign in to comment.