const express = require("express")

/* eslint-disable no-undef */
module.exports = {
  title: "ConvertKit Design System",
  version: "1.0",
  pagePerSection: true,
  tocMode: "collapse",
  assetsDir: "static",
  sections: [
    {
      name: "Introduction",
      content: "docs/introduction.md",
    },
    {
      name: "Guidelines",
      sections: [
        {
          name: "SVG",
          content: "docs/guidelines/svg.md",
        },
        {
          name: "Grammar and Tone",
          content: "docs/guidelines/grammar.md",
        },
        {
          name: "Performance",
          content: "docs/guidelines/performance.md",
        },
        {
          name: "Responsiveness",
          content: "docs/guidelines/responsive.md",
        },
        {
          name: "Styling",
          content: "docs/guidelines/styling.md",
        },
      ],
      sectionDepth: 1,
    },
    {
      name: "Accessibility",
      sections: [
        {
          name: "Overview",
          content: "docs/accessibility/overview.md",
        },
        {
          name: "Auditing",
          content: "docs/accessibility/auditing.md",
        },
        {
          name: "Resources",
          content: "docs/accessibility/resources.md",
        },
      ],
    },
    {
      name: "Tokens",
      sections: [
        {
          name: "Color",
          content: "docs/tokens/color.md",
        },
        {
          name: "Spacing",
          content: "docs/tokens/spacing.md",
        },
        {
          name: "Typography",
          content: "docs/tokens/typography.md",
        },
        {
          name: "Icons",
          content: "docs/tokens/icons.md",
        },
        {
          name: "Motion & Animation",
          content: "docs/tokens/animation.md",
        },
        {
          name: "Shadows",
          content: "docs/tokens/shadows.md",
        },
      ],
      sectionDepth: 1,
    },
    {
      name: "Tools",
      sections: [
        {
          name: "Tailwind",
          content: "docs/tools/tailwind.md",
        },
        {
          name: "Figma",
          content: "docs/tools/figma.md",
        },
        {
          name: "Fort Awesome",
          content: "docs/tools/fortawesome.md",
        },
        {
          name: "Nextplease",
          content: "docs/tools/nextplease.md",
        },
        {
          name: "Fullstory",
          content: "docs/tools/fullstory.md",
        },
      ],
    },
    {
      name: "Components",
      content: "docs/ui.md",
      components: "src/components/*/index.js",
      exampleMode: "collapse",
      usageMode: "expand",
      sectionDepth: 1,
    },
    {
      name: "Forms",
      sections: [
        {
          name: "Inline Validation",
          content: "docs/forms/inline-validation.md",
        },
      ],
    },
    {
      name: "Development Guides",
      sections: [
        {
          name: "Partial data refresh",
          content: "docs/utilities/partial-data-refresh.md",
        },
        {
          name: "useFetch",
          content: "docs/utilities/usefetch.md",
        },
        {
          name: "Testing",
          content: "docs/utilities/testing.md",
        },
      ],
    },
  ],
  template: {
    head: {
      links: [
        {
          rel: "stylesheet",
          href: "/styles.css",
        },
        {
          rel: "icon",
          type: "image/svg+xml",
          href: "/favicon.svg",
        },
        {
          rel: "alternate icon",
          href: "/favicon.ico",
        },
        {
          rel: "mask-icon",
          href: "/safari-pinned-tab.svg",
          color: "6a6a6a",
        },
        {
          rel: 'stylesheet',
          href: 'https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600&display=swap'
        }
      ],
      scripts: [],
    },
  },
  webpackConfig: require("./src/_doc/webpack-config.cjs"),
  theme: require("./src/_doc/theme.cjs"),
  styleguideComponents: require("./src/_doc/renderers.cjs"),
  styles: require("./src/_doc/style.cjs"),
}
