jblu/jonbio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

upstream #1

Merged
jblu merged 1007 commits from upstream into main 2024-11-04 22:35:57 -06:00
Conversation 0 Commits 1007 Files Changed 24 +54 -28
4 changed files with 54 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 3c53f5851c - Show all commits

3
components/Header.tsx
View File

@@ -32,7 +32,8 @@ const Header = () => {
<Link
key={link.title}
href={link.href}
className="hidden font-medium text-gray-900 dark:text-gray-100 sm:block"
className="hidden font-medium text-gray-900 hover:text-primary-500 dark:text-gray-100 dark:hover:text-primary-400
sm:block"
>
{link.title}
</Link>

9
components/MobileNav.tsx
View File

@@ -26,7 +26,8 @@ const MobileNav = () => {
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
className="h-8 w-8 text-gray-900 dark:text-gray-100"
className="h-8 w-8 text-gray-900 hover:text-primary-500 dark:text-gray-100
dark:hover:text-primary-400"
>
<path
fillRule="evenodd"
@@ -46,7 +47,8 @@ const MobileNav = () => {
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
className="text-gray-900 dark:text-gray-100"
className="text-gray-900 hover:text-primary-500 dark:text-gray-100
dark:hover:text-primary-400"
>
<path
fillRule="evenodd"
@@ -61,7 +63,8 @@ const MobileNav = () => {
<div key={link.title} className="px-12 py-4">
<Link
href={link.href}
className="text-2xl font-bold tracking-widest text-gray-900 dark:text-gray-100"
className="text-2xl font-bold tracking-widest text-gray-900 hover:text-primary-500 dark:text-gray-100
dark:hover:text-primary-400"
onClick={onToggleNav}
>
{link.title}

3
components/SearchButton.tsx
View File

@@ -18,7 +18,8 @@ const SearchButton = () => {
viewBox="0 0 24 24"
strokeWidth={1.5}
stroke="currentColor"
className="h-6 w-6 text-gray-900 dark:text-gray-100"
className="h-6 w-6 text-gray-900 hover:text-primary-500 dark:text-gray-100
dark:hover:text-primary-400"
>
<path
strokeLinecap="round"

67
components/ThemeSwitch.tsx
View File

@@ -9,7 +9,7 @@ const Sun = () => (
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
className="h-6 w-6 text-gray-900 dark:text-gray-100"
className="group:hover:text-gray-100 h-6 w-6"
>
<path
fillRule="evenodd"
@@ -23,7 +23,7 @@ const Moon = () => (
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
className="h-6 w-6 text-gray-900 dark:text-gray-100"
className="group:hover:text-gray-100 h-6 w-6"
>
<path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z" />
</svg>
@@ -37,13 +37,14 @@ const Monitor = () => (
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
className="h-6 w-6 text-gray-900 dark:text-gray-100"
className="group:hover:text-gray-100 h-6 w-6"
>
<rect x="3" y="3" width="14" height="10" rx="2" ry="2"></rect>
<line x1="7" y1="17" x2="13" y2="17"></line>
<line x1="10" y1="13" x2="10" y2="17"></line>
</svg>
)
const Blank = () => <svg className="h-6 w-6" />
const ThemeSwitch = () => {
const [mounted, setMounted] = useState(false)
@@ -55,8 +56,10 @@ const ThemeSwitch = () => {
return (
<div className="mr-5">
<Menu as="div" className="relative inline-block text-left">
<div>
<Menu.Button>{resolvedTheme === 'dark' ? <Moon /> : <Sun />}</Menu.Button>
<div className="hover:text-primary-500 dark:hover:text-primary-400">
<Menu.Button>
{mounted ? resolvedTheme === 'dark' ? <Moon /> : <Sun /> : <Blank />}
</Menu.Button>
</div>
<Transition
as={Fragment}
@@ -72,32 +75,50 @@ const ThemeSwitch = () => {
<div className="p-1">
<RadioGroup.Option value="light">
<Menu.Item>
<button className="group flex w-full items-center rounded-md px-2 py-2 text-sm">
<div className="mr-2">
<Sun />
</div>
Light
</button>
{({ active }) => (
<button
className={`${
active ? 'bg-primary-600 text-white' : ''
} group flex w-full items-center rounded-md px-2 py-2 text-sm`}
>
<div className="mr-2">
<Sun />
</div>
Light
</button>
)}
</Menu.Item>
</RadioGroup.Option>
<RadioGroup.Option value="dark">
<Menu.Item>
<button className="group flex w-full items-center rounded-md px-2 py-2 text-sm">
<div className="mr-2">
<Moon />
</div>
Dark
</button>
{({ active }) => (
<button
className={`${
active ? 'bg-primary-600 text-white' : ''
} group flex w-full items-center rounded-md px-2 py-2 text-sm`}
>
<div className="mr-2">
<Moon />
</div>
Dark
</button>
)}
</Menu.Item>
</RadioGroup.Option>
<RadioGroup.Option value="system">
<Menu.Item>
<button className="group flex w-full items-center rounded-md px-2 py-2 text-sm">
<div className="mr-2">
<Monitor />
</div>
System
</button>
{({ active }) => (
<button
className={`${
active ? 'bg-primary-600 text-white' : ''
} group flex w-full items-center rounded-md px-2 py-2 text-sm`}
>
<div className="mr-2">
<Monitor />
</div>
System
</button>
)}
</Menu.Item>
</RadioGroup.Option>
</div>