Overview

Sources:

title: Contents 
style: nestedList # TOC style (nestedList|inlineFirstLevel)
minLevel: 1 # Include headings from the specified level
maxLevel: 4 # Include headings up to the specified level
includeLinks: true # Make headings clickable
debugInConsole: false # Print debug info in Obsidian console

Code

References:

  • src/pages/legal/index.tsx
import Footer from '@/components/Footer';
 
export default function LegalLayout() {
  return (
    <div className="bg-interior bg-no-repeat">
      <div className="page-grid min-h-screen">
        <aside className="p-page md:p-8 md:fixed col-span-12">
          <a href="/">
            <img src="/images/logo.svg" alt="No Clocks, LLC" />
          </a>
        </aside>
        <main className="col-span-12 md:col-start-5 md:col-span-6 md:pt-[130px] px-page md:px-0">
          <div className="content legal-content">
            <Outlet />
          </div>
        </main>
      </div>
      <Footer />
    </div>
  );
}

where src/components/Footer.tsx:

const Footer = () => {
  
  const currentYear = () => new Date().getFullYear();
  
  return (
    <footer className="p-5 text-sm md:p-page text-neutral-500 flex xl:justify-between flex-col xl:flex-row gap-4">
      <div>
        Copyright &copy;{currentYear()}{" "}
        <a href="https://noclocks.dev" target="_blank" rel="noreferrer">
          No Clocks, LLC.
        </a>{" "}
        All Rights Reserved.
      </div>
      <div>
        <a href="/disclaimer">Disclaimer</a> .{" "}
        <a href="/privacy">Privacy Policy</a> .{" "}
        <a href="/terms">Terms of Service</a>
      </div>
    </footer>
  );
};
 
export default Footer;
}

Privacy Policy

  • src/pages/legal/privacy.mdx

Terms of Service

  • src/pages/legal/terms.mdx

Disclaimers

  • src/pages/legal/disclaimer.mdx

Styles

  • src/styles/*.css
@tailwind base;
@tailwind components;
@tailwind utilities;
 
@layer base {
  ...
 
  footer a {
    @apply border-b-2 border-neutral-500 hover:text-springBud
  }
 
  .legal-content h1 {
    @apply text-springBud text-4xl md:text-6xl lg:text-8xl font-mono leading-none mb-8 -tracking-tight;
  }

Appendix

Note created on 2024-04-25 and last modified on 2024-04-25.

LIST FROM [[React - Legal Pages using MDX]] AND -"CHANGELOG" AND -"04-RESOURCES/Code/React/React - Legal Pages using MDX"

(c) No Clocks, LLC | 2024