Пересобранный и видоизмененный conky для ОСГОС

web/pages/index.tsx

@@ -0,0 +1,90 @@
+import Link from 'next/link'
+import { getDocuments, Document } from '../utils/mdx-utils'
+import Layout from '../components/Layout'
+import ArrowIcon from '../components/ArrowIcon'
+import SEO from '../components/SEO'
+
+const pages = [
+  {
+    slug: '/variables',
+    title: 'Variables',
+    desc: 'Variables let you define the various objects displayed in Conky including text, bars, graphs, and more.',
+  },
+  {
+    slug: '/config_settings',
+    title: 'Configuration settings',
+    desc: 'Global configuration pramaters for Conky allow you to customize various behaviours.',
+  },
+  {
+    slug: '/lua',
+    title: 'Lua API',
+    desc: 'Program wild things into your Conky with the Lua API',
+  },
+]
+
+interface IndexItemProps {
+  href: string
+  as?: string
+  title: string
+  desc?: string
+}
+
+const IndexItem: React.FunctionComponent<IndexItemProps> = (props) => {
+  return (
+    <div className="md:first:rounded-t-lg md:last:rounded-b-lg backdrop-blur-lg bg-slate-300 dark:bg-black dark:bg-opacity-30 bg-opacity-10 hover:bg-opacity-30 dark:hover:bg-opacity-50 transition border border-gray-800 dark:border-white border-opacity-10 dark:border-opacity-10 border-b-0 last:border-b hover:border-b hovered-sibling:border-t-0">
+      <Link
+        as={props.as}
+        href={props.href}
+        className="py-2 lg:py-4 px-2 lg:px-4 block focus:outline-none focus:ring-4"
+      >
+        <h2 className="text-xl md:text-2xl">{props.title}</h2>
+        {props.desc && <p className="mt-3 text-lg opacity-60">{props.desc}</p>}
+        <ArrowIcon className="mt-4" />
+      </Link>
+    </div>
+  )
+}
+
+interface IndexProps {
+  documents: Document[]
+}
+
+export default function Index({ documents }: IndexProps) {
+  return (
+    <Layout>
+      <SEO title="Conky" description="Conky documentation" />
+      <main className="w-full">
+        <div className="w-full">
+          {pages.map((p) => (
+            <IndexItem
+              key={p.slug}
+              href={p.slug}
+              title={p.title}
+              desc={p.desc}
+            />
+          ))}
+          {documents.map((document) => (
+            <IndexItem
+              key={document.filePath}
+              as={`/documents/${document.filePath.replace(/\.mdx?$/, '')}`}
+              href={`/documents/[slug]`}
+              title={document.data.title ?? 'Untitled'}
+              desc={document.data.description}
+            />
+          ))}
+          <IndexItem
+            href="https://github.com/brndnmtthws/conky/wiki"
+            title="Wiki"
+            desc="The Wiki (hosted on GitHub) contains a number of user configs, Lua scripts, FAQs and more."
+          />
+        </div>
+      </main>
+    </Layout>
+  )
+}
+
+export function getStaticProps() {
+  const documents = getDocuments()
+
+  return { props: { documents } }
+}