mirror of
https://github.com/formbricks/formbricks.git
synced 2026-04-18 03:20:35 -05:00
feat: updated docs layout wrt side navigation
This commit is contained in:
@@ -3,7 +3,6 @@
|
||||
import { navigation } from "@/lib/navigation";
|
||||
import Link from "next/link";
|
||||
import { usePathname } from "next/navigation";
|
||||
|
||||
import { Button } from "./Button";
|
||||
import { DiscordIcon } from "./icons/DiscordIcon";
|
||||
import { GithubIcon } from "./icons/GithubIcon";
|
||||
@@ -116,7 +115,7 @@ const SmallPrint = () => {
|
||||
|
||||
export const Footer = () => {
|
||||
return (
|
||||
<footer className="mx-auto w-full max-w-2xl space-y-10 pb-16 lg:max-w-5xl">
|
||||
<footer className="mx-auto max-w-2xl space-y-10 pb-16 lg:w-[calc(100%-20rem)]">
|
||||
<PageNavigation />
|
||||
<SmallPrint />
|
||||
</footer>
|
||||
|
||||
@@ -6,7 +6,6 @@ import SideNavigation from "@/components/SideNavigation";
|
||||
import { motion } from "framer-motion";
|
||||
import Link from "next/link";
|
||||
import { usePathname } from "next/navigation";
|
||||
|
||||
import { Footer } from "./Footer";
|
||||
import { Header } from "./Header";
|
||||
import { type Section, SectionProvider } from "./SectionProvider";
|
||||
@@ -18,7 +17,7 @@ export const Layout = ({
|
||||
children: React.ReactNode;
|
||||
allSections: Record<string, Array<Section>>;
|
||||
}) => {
|
||||
let pathname = usePathname();
|
||||
const pathname = usePathname();
|
||||
|
||||
return (
|
||||
<SectionProvider sections={allSections[pathname || ""] ?? []}>
|
||||
|
||||
@@ -9,7 +9,7 @@ type Heading = {
|
||||
|
||||
const SideNavigation = ({ pathname }) => {
|
||||
const [headings, setHeadings] = useState<Heading[]>([]);
|
||||
const [activeId, setActiveId] = useState<string | null>(null);
|
||||
const [selectedId, setSelectedId] = useState<string | null>(null);
|
||||
|
||||
useEffect(() => {
|
||||
const getHeadings = () => {
|
||||
@@ -41,9 +41,9 @@ const SideNavigation = ({ pathname }) => {
|
||||
className={`mb-4 ml-4 text-slate-900 dark:text-white ml-${heading.level === 2 ? 0 : heading.level === 3 ? 4 : 6}`}>
|
||||
<Link
|
||||
href={`#${heading.id}`}
|
||||
onClick={() => setActiveId(heading.id)}
|
||||
onClick={() => setSelectedId(heading.id)}
|
||||
className={`${
|
||||
heading.id === activeId
|
||||
heading.id === selectedId
|
||||
? "font-semibold text-blue-800 dark:text-amber-300"
|
||||
: "font-normal text-slate-900 dark:text-white"
|
||||
}`}>
|
||||
@@ -60,7 +60,7 @@ const SideNavigation = ({ pathname }) => {
|
||||
|
||||
if (headings.length) {
|
||||
return (
|
||||
<aside className="fixed right-0 top-0 hidden h-[calc(100%-2.5rem)] w-80 overflow-hidden overflow-y-auto pt-16 lg:mt-10 lg:block">
|
||||
<aside className="fixed right-0 top-0 hidden h-[calc(100%-2.5rem)] w-80 overflow-hidden overflow-y-auto pt-16 [scrollbar-width:none] lg:mt-10 lg:block">
|
||||
<div className="border-l-2 border-gray-700">
|
||||
<h3 className="ml-2 mt-1">On this page</h3>
|
||||
{renderHeading(headings, 2)}
|
||||
|
||||
Reference in New Issue
Block a user