chore: format codebase and move SectionAccordion to entities/Section
This commit is contained in:
@@ -1,32 +1,32 @@
|
||||
'use client'
|
||||
'use client';
|
||||
|
||||
import { useState } from 'react'
|
||||
import { cn } from '$shared/lib'
|
||||
import type { NavItem } from '../model/types'
|
||||
import { useState } from 'react';
|
||||
import { cn } from '$shared/lib';
|
||||
import type { NavItem } from '../model/types';
|
||||
|
||||
interface Props {
|
||||
/**
|
||||
* Navigation items to render
|
||||
*/
|
||||
items: NavItem[]
|
||||
items: NavItem[];
|
||||
}
|
||||
|
||||
/**
|
||||
* Mobile navigation overlay, hidden on lg+ screens.
|
||||
*/
|
||||
export function MobileNav({ items }: Props) {
|
||||
const [isOpen, setIsOpen] = useState(false)
|
||||
const [isOpen, setIsOpen] = useState(false);
|
||||
|
||||
/**
|
||||
* Scrolls to the section by id with a 100px offset, then closes the menu.
|
||||
*/
|
||||
function scrollToSection(id: string) {
|
||||
const el = document.getElementById(id)
|
||||
const el = document.getElementById(id);
|
||||
if (el) {
|
||||
const top = el.getBoundingClientRect().top + window.scrollY - 100
|
||||
window.scrollTo({ top, behavior: 'smooth' })
|
||||
const top = el.getBoundingClientRect().top + window.scrollY - 100;
|
||||
window.scrollTo({ top, behavior: 'smooth' });
|
||||
}
|
||||
setIsOpen(false)
|
||||
setIsOpen(false);
|
||||
}
|
||||
|
||||
return (
|
||||
@@ -34,7 +34,7 @@ export function MobileNav({ items }: Props) {
|
||||
<div className="px-6 py-4 flex items-center justify-between">
|
||||
<h4>allmy.work</h4>
|
||||
<button
|
||||
onClick={() => setIsOpen(prev => !prev)}
|
||||
onClick={() => setIsOpen((prev) => !prev)}
|
||||
className="brutal-border px-4 py-2 bg-carbon-black text-ochre-clay"
|
||||
>
|
||||
{isOpen ? 'Close' : 'Menu'}
|
||||
@@ -42,7 +42,7 @@ export function MobileNav({ items }: Props) {
|
||||
</div>
|
||||
{isOpen && (
|
||||
<div className="px-6 py-6 brutal-border-top space-y-2 max-h-[80vh] overflow-y-auto">
|
||||
{items.map(item => (
|
||||
{items.map((item) => (
|
||||
<button
|
||||
key={item.id}
|
||||
onClick={() => scrollToSection(item.id)}
|
||||
@@ -62,5 +62,5 @@ export function MobileNav({ items }: Props) {
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user