diff --git a/package-lock.json b/package-lock.json index 9364d72..41624eb 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16,6 +16,7 @@ "@radix-ui/react-navigation-menu": "^1.2.13", "@radix-ui/react-slot": "^1.2.3", "@radix-ui/react-switch": "^1.2.5", + "@radix-ui/react-tooltip": "^1.2.7", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "lucide-react": "^0.525.0", @@ -2508,6 +2509,40 @@ } } }, + "node_modules/@radix-ui/react-tooltip": { + "version": "1.2.7", + "resolved": "https://registry.npmjs.org/@radix-ui/react-tooltip/-/react-tooltip-1.2.7.tgz", + "integrity": "sha512-Ap+fNYwKTYJ9pzqW+Xe2HtMRbQ/EeWkj2qykZ6SuEV4iS/o1bZI5ssJbk4D2r8XuDuOBVz/tIx2JObtuqU+5Zw==", + "license": "MIT", + "dependencies": { + "@radix-ui/primitive": "1.1.2", + "@radix-ui/react-compose-refs": "1.1.2", + "@radix-ui/react-context": "1.1.2", + "@radix-ui/react-dismissable-layer": "1.1.10", + "@radix-ui/react-id": "1.1.1", + "@radix-ui/react-popper": "1.2.7", + "@radix-ui/react-portal": "1.1.9", + "@radix-ui/react-presence": "1.1.4", + "@radix-ui/react-primitive": "2.1.3", + "@radix-ui/react-slot": "1.2.3", + "@radix-ui/react-use-controllable-state": "1.2.2", + "@radix-ui/react-visually-hidden": "1.2.3" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, "node_modules/@radix-ui/react-use-callback-ref": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.1.1.tgz", diff --git a/package.json b/package.json index 375f3cc..2505a0f 100644 --- a/package.json +++ b/package.json @@ -17,6 +17,7 @@ "@radix-ui/react-navigation-menu": "^1.2.13", "@radix-ui/react-slot": "^1.2.3", "@radix-ui/react-switch": "^1.2.5", + "@radix-ui/react-tooltip": "^1.2.7", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "lucide-react": "^0.525.0", diff --git a/src/components/albums/ImageList.tsx b/src/components/_albums/_ImageList.tsx similarity index 100% rename from src/components/albums/ImageList.tsx rename to src/components/_albums/_ImageList.tsx diff --git a/src/components/artists/ArtistImageGrid.tsx b/src/components/artists/_ArtistImageGrid.tsx similarity index 100% rename from src/components/artists/ArtistImageGrid.tsx rename to src/components/artists/_ArtistImageGrid.tsx diff --git a/src/components/artists/ImageCard.tsx b/src/components/artists/_ImageCard.tsx similarity index 100% rename from src/components/artists/ImageCard.tsx rename to src/components/artists/_ImageCard.tsx diff --git a/src/components/cards/AlbumCard.tsx b/src/components/cards/_AlbumCard.tsx similarity index 100% rename from src/components/cards/AlbumCard.tsx rename to src/components/cards/_AlbumCard.tsx diff --git a/src/components/categories/CategoryImageList.tsx b/src/components/categories/_CategoryImageList.tsx similarity index 100% rename from src/components/categories/CategoryImageList.tsx rename to src/components/categories/_CategoryImageList.tsx diff --git a/src/components/galleries/AlbumList.tsx b/src/components/galleries/_AlbumList.tsx similarity index 100% rename from src/components/galleries/AlbumList.tsx rename to src/components/galleries/_AlbumList.tsx diff --git a/src/components/global/Header.tsx b/src/components/global/Header.tsx index 91395db..3b9ceac 100644 --- a/src/components/global/Header.tsx +++ b/src/components/global/Header.tsx @@ -1,3 +1,4 @@ +import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "../ui/tooltip"; import AnimateToggle from "./AnimateToggle"; import Breadcrumbs from "./Breadcrumbs"; import ModeToggle from "./ModeToggle"; @@ -6,16 +7,54 @@ import TopNav from "./TopNav"; export default function Header() { return ( -
-
- -
- - - - + +
+
+ +
+ + +
+ +
+
+ +

Navigate to the about page

+
+
+ + +
+ +
+
+ +

Toggle glowing animated borders on image cards

+
+
+ + +
+ +
+
+ +

Show or hide NSFW (blurred) images

+
+
+ + +
+ +
+
+ +

Switch between light and dark mode

+
+
+
-
+ ); } \ No newline at end of file diff --git a/src/components/global/TopNav.tsx b/src/components/global/TopNav.tsx index 5d866a4..13ce029 100644 --- a/src/components/global/TopNav.tsx +++ b/src/components/global/TopNav.tsx @@ -1,23 +1,20 @@ "use client" -import { NavigationMenu, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, navigationMenuTriggerStyle } from "@/components/ui/navigation-menu"; +import { InfoIcon } from "lucide-react"; import Link from "next/link"; +import { Button } from "../ui/button"; export default function TopNav() { return ( - - - {/* - - Home - - */} - - - About - - - - + + + ); } \ No newline at end of file diff --git a/src/components/images/GlowingImageBorder.tsx b/src/components/images/_GlowingImageBorder.tsx similarity index 100% rename from src/components/images/GlowingImageBorder.tsx rename to src/components/images/_GlowingImageBorder.tsx diff --git a/src/components/images/GlowingImageWithToggle.tsx b/src/components/images/_GlowingImageWithToggle.tsx similarity index 100% rename from src/components/images/GlowingImageWithToggle.tsx rename to src/components/images/_GlowingImageWithToggle.tsx diff --git a/src/components/images/ImageInfoPanel.tsx b/src/components/images/_ImageInfoPanel.tsx similarity index 100% rename from src/components/images/ImageInfoPanel.tsx rename to src/components/images/_ImageInfoPanel.tsx diff --git a/src/components/ui/tooltip.tsx b/src/components/ui/tooltip.tsx new file mode 100644 index 0000000..4ee26b3 --- /dev/null +++ b/src/components/ui/tooltip.tsx @@ -0,0 +1,61 @@ +"use client" + +import * as React from "react" +import * as TooltipPrimitive from "@radix-ui/react-tooltip" + +import { cn } from "@/lib/utils" + +function TooltipProvider({ + delayDuration = 0, + ...props +}: React.ComponentProps) { + return ( + + ) +} + +function Tooltip({ + ...props +}: React.ComponentProps) { + return ( + + + + ) +} + +function TooltipTrigger({ + ...props +}: React.ComponentProps) { + return +} + +function TooltipContent({ + className, + sideOffset = 0, + children, + ...props +}: React.ComponentProps) { + return ( + + + {children} + + + + ) +} + +export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }