diff --git a/public/media/discord.svg b/public/media/discord.svg index 64571aa..c5ae39d 100644 --- a/public/media/discord.svg +++ b/public/media/discord.svg @@ -1,4 +1,4 @@ - \ No newline at end of file diff --git a/public/media/github.svg b/public/media/github.svg index ac671ba..79b5696 100644 --- a/public/media/github.svg +++ b/public/media/github.svg @@ -1,5 +1,50 @@ - - + + Github Octocat Streamline Icon: https://streamlinehq.com + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/app/styles/globals.css b/src/app/styles/globals.css index 4b77fc2..e98940f 100644 --- a/src/app/styles/globals.css +++ b/src/app/styles/globals.css @@ -20,13 +20,13 @@ body { --card-foreground: 240 10% 3.9%; --popover: 0 0% 100%; --popover-foreground: 240 10% 3.9%; - --primary: 240 5.9% 10%; + --primary: 271 91% 65%; --primary-foreground: 0 0% 98%; --secondary: 240 4.8% 95.9%; --secondary-foreground: 240 5.9% 10%; --muted: 240 4.8% 95.9%; --muted-foreground: 240 3.8% 46.1%; - --accent: 240 4.8% 95.9%; + --accent: 0 0% 90%; --accent-foreground: 240 5.9% 10%; --destructive: 0 84.2% 60.2%; --destructive-foreground: 0 0% 98%; diff --git a/src/components/docs-footer.tsx b/src/components/docs-footer.tsx index b20c47a..d4bf00e 100644 --- a/src/components/docs-footer.tsx +++ b/src/components/docs-footer.tsx @@ -54,7 +54,7 @@ const DocsFooter = ({ {/* Pages */} {previous || next ? ( - + ) : undefined}
{/* Previous */} diff --git a/src/components/footer.tsx b/src/components/footer.tsx index 0899ddc..8c69b16 100644 --- a/src/components/footer.tsx +++ b/src/components/footer.tsx @@ -6,6 +6,7 @@ import Link from "next/link"; import Image from "next/image"; import { cn } from "@/lib/utils"; import { ExternalLink, Mail } from "lucide-react"; +import SocialLink from "@/components/social-link"; const links = { Resources: [ @@ -55,18 +56,24 @@ const Footer = (): ReactElement => ( {/* Socials */}
} + tooltip="Email us" + logo={} href="mailto:support@pulseapp.cc" />
@@ -119,35 +126,6 @@ const Branding = () => ( ); -const SocialLink = ({ - name, - logo, - href, -}: { - name: string; - logo: string | ReactElement; - href: string; -}) => ( - - {typeof logo === "string" ? ( - {`${name}'s - ) : ( - logo - )} - -); - const LinkCategory = ({ title, children, diff --git a/src/components/navbar/navbar.tsx b/src/components/navbar/navbar.tsx index f8bb9e8..4323844 100644 --- a/src/components/navbar/navbar.tsx +++ b/src/components/navbar/navbar.tsx @@ -5,9 +5,10 @@ import Link from "next/link"; import Image from "next/image"; import QuickSearchDialog from "@/components/navbar/search-dialog"; import Sidebar from "@/components/sidebar/sidebar"; +import SocialLink from "@/components/social-link"; const Navbar = ({ pages }: { pages: DocsContentMetadata[] }): ReactElement => ( -
diff --git a/src/components/simple-tooltip.tsx b/src/components/simple-tooltip.tsx index 1f33a10..91b3f1d 100644 --- a/src/components/simple-tooltip.tsx +++ b/src/components/simple-tooltip.tsx @@ -39,7 +39,10 @@ const SimpleTooltip = ({ }: SimpleTooltipProps): ReactElement => ( {children} - + {content} diff --git a/src/components/social-link.tsx b/src/components/social-link.tsx new file mode 100644 index 0000000..c3ce476 --- /dev/null +++ b/src/components/social-link.tsx @@ -0,0 +1,45 @@ +import { ReactElement } from "react"; +import SimpleTooltip from "@/components/simple-tooltip"; +import Link from "next/link"; +import Image from "next/image"; +import { cn } from "@/lib/utils"; + +type SocialLinkProps = { + className?: string | undefined; + name: string; + tooltip: string; + logo: string | ReactElement; + href: string; +}; + +const SocialLink = ({ + className, + name, + tooltip, + logo, + href, +}: SocialLinkProps) => ( + + + {typeof logo === "string" ? ( + {`${name}'s + ) : ( + logo + )} + + +); +export default SocialLink; diff --git a/src/components/theme-switcher.tsx b/src/components/theme-switcher.tsx index 03619c9..2fc4252 100644 --- a/src/components/theme-switcher.tsx +++ b/src/components/theme-switcher.tsx @@ -29,7 +29,7 @@ const ThemeSwitcher = (): ReactElement => { }, []); return ( -
+
{Object.entries(themes).map(([theme, icon]) => { const active: boolean = mounted && theme === activeTheme; return ( @@ -41,7 +41,7 @@ const ThemeSwitcher = (): ReactElement => { className={cn( "p-1 h-6 opacity-80 rounded-full", active && - "ring-1 bg-zinc-900 ring-white/15 opacity-100" + "ring-1 bg-white dark:bg-zinc-900 ring-gray-900/10 dark:ring-white/15 hover:bg-white hover:dark:bg-zinc-900 opacity-100" )} variant="ghost" onClick={() => setTheme(theme)}