copilot/frosty
1
0
Fork 0
Code Issues Pull requests Projects Releases 11 Packages Wiki Activity Actions

Update web header styles

Browse source
This commit is contained in:
Tommy Chow 2024-09-19 23:44:30 -07:00
parent 5f4e830e3a
commit f5ef9bfe24
3 changed files with 10 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

2
web/src/app/page.tsx
View file

@ -207,7 +207,7 @@ export default function Home() {
<div className='w-full divide-y divide-neutral-300 border-y border-neutral-300 dark:divide-neutral-900 dark:border-neutral-900'>
{faqs.map((faq, index) => (
<details key={index}>
<summary className='p-8 font-medium transition hover:cursor-pointer hover:bg-neutral-200 dark:hover:bg-neutral-950'>
<summary className='p-8 font-medium transition hover:cursor-pointer hover:bg-neutral-200 dark:hover:bg-neutral-900'>
{faq.question}
</summary>
<p className='border-t border-neutral-300 px-12 py-8 text-neutral-600 dark:border-neutral-900 dark:text-neutral-300'>

15
web/src/components/Header.tsx
View file

@ -6,18 +6,19 @@ import { ThemeToggle } from './ThemeToggle';
export function Header() {
return (
<header className='sticky top-0 z-50 flex w-full max-w-screen-lg items-center justify-between gap-4 border-b border-inherit bg-inherit p-4 dark:from-black'>
<Link className='flex items-center gap-2' href='/'>
<header className='sticky top-0 z-50 flex w-full max-w-screen-lg justify-between gap-4 divide-x divide-neutral-300 border-b border-inherit bg-inherit dark:divide-neutral-900 dark:from-black'>
<Link
className='flex items-center gap-2 border-r border-inherit px-4 transition hover:bg-neutral-200 dark:hover:bg-neutral-900'
href='/'
>
<div className='relative size-8'>
<Image alt='Logo' src={`/logo.svg`} layout='fill' priority />
</div>
<h1 className='text-xl font-semibold'>Frosty</h1>
</Link>
<div className='flex items-center gap-4'>
<div className='flex items-center divide-x divide-inherit'>
<a
className='transition-opacity hover:opacity-50'
className='p-4 transition hover:bg-neutral-200 dark:hover:bg-neutral-900'
href={donateLink}
target='_blank'
rel='noreferrer'
@ -26,7 +27,7 @@ export function Header() {
</a>
<a
className='transition-opacity hover:opacity-50'
className='p-4 transition hover:bg-neutral-200 dark:hover:bg-neutral-900'
href={githubLink}
target='_blank'
rel='noreferrer'

2
web/src/components/ThemeToggle.tsx
View file

@ -19,7 +19,7 @@ export function ThemeToggle() {
return (
<button
className='transition-opacity hover:opacity-50'
className='p-4 transition hover:bg-neutral-200 dark:hover:bg-neutral-900'
aria-label={`Toggle ${isDarkMode ? 'light mode' : 'dark mode'}`}
onClick={() => setTheme(isDarkMode ? 'light' : 'dark')}
>