diff --git a/generator/konfig-docs/blog/2023/08/21-serverless.mdx b/generator/konfig-docs/blog/2023/08/21-serverless.mdx index 9cf3b3d46..0c939aca6 100644 --- a/generator/konfig-docs/blog/2023/08/21-serverless.mdx +++ b/generator/konfig-docs/blog/2023/08/21-serverless.mdx @@ -5,7 +5,6 @@ description: | From DHH shunning serverless, Ahrefs saving millions by using a cloud provider at all, to Amazon raining fire on their own serverless product, serverless has recently faced significant scrutiny. -and literally hundreds more). One research paper from Berkeley even claimed: authors: dylan tags: [Engineering] image: ./serverless-assets/banner.png diff --git a/generator/konfig-docs/docusaurus.config.js b/generator/konfig-docs/docusaurus.config.js index 26527933b..25a90e5bb 100644 --- a/generator/konfig-docs/docusaurus.config.js +++ b/generator/konfig-docs/docusaurus.config.js @@ -85,200 +85,207 @@ const beforeRemarkPluginsForPages = [ ], ]; - /** * @returns {Promise} */ async function createConfig() { -const remarkPlugins = [ - (await import('remark-gfm')).default, - [ - mermaid, - { - theme: { light: "default", dark: "dark" }, - }, - ], -]; - return { - title: "Konfig", - tagline: "Generate SDKs for your REST API", - url: "https://konfigthis.com", - baseUrl: "/", - onBrokenLinks: "throw", - onBrokenMarkdownLinks: "warn", - favicon: "img/favicon.png", - themes: [ - "docusaurus-json-schema-plugin", + const remarkPlugins = [ + (await import("remark-gfm")).default, [ - require.resolve("@easyops-cn/docusaurus-search-local"), + mermaid, { - hashed: true, - indexBlog: false, - docsRouteBasePath: "/", + theme: { light: "default", dark: "dark" }, }, ], - "mdx-v2", - ], - plugins: [ - async function docusaurus(context, options) { - return { - name: "docusaurus-tailwindcss", - configurePostCss(postcssOptions) { - // Appends TailwindCSS and AutoPrefixer. - postcssOptions.plugins.push(require("tailwindcss")); - postcssOptions.plugins.push(require("autoprefixer")); - return postcssOptions; + ]; + return { + title: "Konfig", + tagline: "Generate SDKs for your REST API", + url: "https://konfigthis.com", + baseUrl: "/", + onBrokenLinks: "throw", + onBrokenMarkdownLinks: "warn", + favicon: "img/favicon.png", + themes: [ + "docusaurus-json-schema-plugin", + [ + require.resolve("@easyops-cn/docusaurus-search-local"), + { + hashed: true, + indexBlog: false, + docsRouteBasePath: "/", }, - }; - }, - ], + ], + "mdx-v2", + ], + plugins: [ + async function docusaurus(context, options) { + return { + name: "docusaurus-tailwindcss", + configurePostCss(postcssOptions) { + // Appends TailwindCSS and AutoPrefixer. + postcssOptions.plugins.push(require("tailwindcss")); + postcssOptions.plugins.push(require("autoprefixer")); + return postcssOptions; + }, + }; + }, + ], - // GitHub pages deployment config. - // If you aren't using GitHub pages, you don't need these. - // organizationName: "facebook", // Usually your GitHub org/user name. - // projectName: "docusaurus", // Usually your repo name. + // GitHub pages deployment config. + // If you aren't using GitHub pages, you don't need these. + // organizationName: "facebook", // Usually your GitHub org/user name. + // projectName: "docusaurus", // Usually your repo name. - // Even if you don't use internalization, you can use this field to set useful - // metadata like html lang. For example, if your site is Chinese, you may want - // to replace "en" with "zh-Hans". - i18n: { - defaultLocale: "en", - locales: ["en"], - }, + // Even if you don't use internalization, you can use this field to set useful + // metadata like html lang. For example, if your site is Chinese, you may want + // to replace "en" with "zh-Hans". + i18n: { + defaultLocale: "en", + locales: ["en"], + }, - presets: [ - [ - "classic", - /** @type {import('@docusaurus/preset-classic').Options} */ + presets: [ + [ + "classic", + /** @type {import('@docusaurus/preset-classic').Options} */ + ({ + docs: { + beforeDefaultRemarkPlugins: beforeRemarkPlugins, + remarkPlugins: remarkPlugins, + routeBasePath: "/docs", + sidebarPath: require.resolve("./sidebars.js"), + }, + pages: { + beforeDefaultRemarkPlugins: beforeRemarkPluginsForPages, + remarkPlugins: remarkPlugins, + }, + theme: { + customCss: [ + require.resolve("@code-hike/mdx/styles.css"), + require.resolve("./src/css/custom.css"), + ], + }, + blog: { + beforeDefaultRemarkPlugins: beforeRemarkPluginsForBlogs, + blogSidebarCount: "ALL", + blogSidebarTitle: "All posts", + remarkPlugins: remarkPlugins, + showReadingTime: true, + blogDescription: "Generate SDKs for your REST API", + truncateMarker: /{\/\* TRUNCATE \*\/}/, + }, + gtag: { + trackingID: "G-L2Q9WBQN2D", + anonymizeIP: true, + }, + }), + ], + ], + + themeConfig: + /** @type {import('@docusaurus/preset-classic').ThemeConfig} */ ({ - docs: { - beforeDefaultRemarkPlugins: beforeRemarkPlugins, - remarkPlugins: remarkPlugins, - routeBasePath: "/docs", - sidebarPath: require.resolve("./sidebars.js"), - }, - pages: { - beforeDefaultRemarkPlugins: beforeRemarkPluginsForPages, - remarkPlugins: remarkPlugins, + colorMode: { + defaultMode: "light", + disableSwitch: true, }, - theme: { - customCss: [ - require.resolve("@code-hike/mdx/styles.css"), - require.resolve("./src/css/custom.css"), + navbar: { + logo: { + alt: "Konfig Logo", + src: "img/logo-light.png", + href: "https://konfigthis.com", + }, + items: [ + { + type: "doc", + docId: "intro", + position: "left", + label: "Documentation", + }, + { + to: "/interactive-tutorial", + label: "Interactive Tutorial", + position: "left", + }, + { to: "/schedule-demo", label: "Schedule Demo", position: "right" }, + { to: "/blog", label: "Blog", position: "right" }, + { to: "/about", label: "About", position: "right" }, ], }, - blog: { - beforeDefaultRemarkPlugins: beforeRemarkPluginsForBlogs, - blogSidebarCount: "ALL", - remarkPlugins: remarkPlugins, - showReadingTime: true, - blogDescription: "Generate SDKs for your REST API", - truncateMarker: /{\/\* TRUNCATE \*\/}/, + api: { + authPersistance: "localStorage", + serverVariablesPersistance: "localStorage", }, - gtag: { - trackingID: "G-L2Q9WBQN2D", - anonymizeIP: true, + footer: { + style: "light", + links: [ + { + title: "Links", + items: [ + { + label: "Website", + to: "https://konfigthis.com", + }, + { + label: "LinkedIn", + to: "https://www.linkedin.com/company/konfig", + }, + { + label: "Blog", + to: "/blog", + }, + ], + }, + // { + // title: "Docs", + // items: [ + // { + // label: "Introduction", + // to: "/docs/intro", + // }, + // ], + // }, + // { + // title: "Community", + // items: [ + // { + // label: "Stack Overflow", + // href: "https://stackoverflow.com/questions/tagged/docusaurus", + // }, + // { + // label: "Discord", + // href: "https://discordapp.com/invite/docusaurus", + // }, + // { + // label: "Twitter", + // href: "https://twitter.com/docusaurus", + // }, + // ], + // }, + // { + // title: "More", + // items: [ + // { + // label: "Blog", + // to: "/blog", + // }, + // { + // label: "GitHub", + // href: "https://github.com/facebook/docusaurus", + // }, + // ], + // }, + ], + copyright: `Copyright © ${new Date().getFullYear()} Konfig, Inc.`, }, - }), - ], - ], - - themeConfig: - /** @type {import('@docusaurus/preset-classic').ThemeConfig} */ - ({ - navbar: { - title: "Konfig", - logo: { - alt: "Konfig Logo", - src: "img/favicon.png", - href: "https://konfigthis.com", + prism: { + theme: lightCodeTheme, + darkTheme: darkCodeTheme, + additionalLanguages: ["ruby", "csharp", "php"], }, - items: [ - { - type: "doc", - docId: "intro", - position: "left", - label: "Documentation", - }, - { - to: "/interactive-tutorial", - label: "Interactive Tutorial", - position: "left", - }, - { to: "/schedule-demo", label: "Schedule Demo", position: "right" }, - { to: "/blog", label: "Blog", position: "right" }, - { to: "/about", label: "About", position: "right" }, - ], - }, - api: { - authPersistance: "localStorage", - serverVariablesPersistance: "localStorage", - }, - footer: { - style: "light", - links: [ - { - title: "Links", - items: [ - { - label: "Website", - to: "https://konfigthis.com", - }, - { - label: "LinkedIn", - to: "https://www.linkedin.com/company/konfig", - }, - ], - }, - // { - // title: "Docs", - // items: [ - // { - // label: "Introduction", - // to: "/docs/intro", - // }, - // ], - // }, - // { - // title: "Community", - // items: [ - // { - // label: "Stack Overflow", - // href: "https://stackoverflow.com/questions/tagged/docusaurus", - // }, - // { - // label: "Discord", - // href: "https://discordapp.com/invite/docusaurus", - // }, - // { - // label: "Twitter", - // href: "https://twitter.com/docusaurus", - // }, - // ], - // }, - // { - // title: "More", - // items: [ - // { - // label: "Blog", - // to: "/blog", - // }, - // { - // label: "GitHub", - // href: "https://github.com/facebook/docusaurus", - // }, - // ], - // }, - ], - copyright: `Copyright © ${new Date().getFullYear()} Konfig, Inc.`, - }, - prism: { - theme: lightCodeTheme, - darkTheme: darkCodeTheme, - additionalLanguages: ["ruby", "csharp", "php"], - }, - }), + }), + }; } -}; module.exports = createConfig; diff --git a/generator/konfig-docs/src/css/custom.css b/generator/konfig-docs/src/css/custom.css index dbbe9c2bc..64b1ef272 100644 --- a/generator/konfig-docs/src/css/custom.css +++ b/generator/konfig-docs/src/css/custom.css @@ -3,7 +3,7 @@ @tailwind utilities; a[data-footnote-ref="true"] { - scroll-margin-top: calc(var(--ifm-navbar-height) + 0.5rem);; + scroll-margin-top: calc(var(--ifm-navbar-height) + 0.5rem); } figure { @@ -34,6 +34,53 @@ figure { :root { --ifm-font-size-base: 15px; + --ifm-navbar-height: 64px; + --ifm-font-size-base: 16px; + --ifm-menu-link-padding-vertical: 0.5rem; + --ifm-menu-color: var(--ifm-color-gray-600); + --ifm-link-hover-decoration: none; + --ifm-link-decoration: none; + --ifm-menu-color-background-active: var( + --ifm-color-primary-contrast-background + ); +} + +.alert { + --ifm-link-hover-decoration: none; + --ifm-link-decoration: none; +} + +.markdown { + color: var(--ifm-color-gray-700); + + --ifm-h1-vertical-rhythm-top: 5; + --ifm-h2-vertical-rhythm-top: 4; + --ifm-h3-vertical-rhythm-top: 3; + --ifm-heading-vertical-rhythm-top: 1.25; + --ifm-h1-vertical-rhythm-bottom: 1.25; + --ifm-heading-vertical-rhythm-bottom: 1; +} + +.markdown a { + color: var(--ifm-color-emphasis-1000); + border-bottom: 1px solid var(--ifm-color-primary-light); +} + +.markdown p { + margin-top: 1rem; +} + +.markdown a:hover { + border-bottom-width: 2px; +} + +.markdown h1, +h2, +h3, +h4, +h5, +h6 { + color: var(--ifm-color-emphasis-1000); } :root { @@ -185,3 +232,57 @@ summary { .highlighted-node .nodeLabel { color: black !important; } + +.theme-doc-sidebar-container { + border-right: none !important; + font-size: 0.875rem; +} + +.menu__link { + line-height: 1.55; +} + +.navbar { + border-bottom: 1px solid var(--ifm-toc-border-color); + box-shadow: none !important; +} + +.menu__link--sublist-caret:after { + background: var(--ifm-menu-link-sublist-icon) 50% / 1rem 1rem; +} + +.menu__link:hover { + color: var(--ifm-color-emphasis-800); +} + +.menu__link:hover { + color: var(--ifm-color-emphasis-800); +} + +.menu__link--active:hover { + color: var(--ifm-menu-color-active); +} + +.menu__caret:before { + background: var(--ifm-menu-link-sublist-icon) 50% / 1rem 1rem; +} + +.navbar__link { + color: var(--ifm-color-gray-600); +} + +.navbar__link--active { + color: var(--ifm-color-primary); +} + +.menu__list-item:not(:first-child) { + margin-top: 0; +} + +.navbar__link:hover { + color: var(--ifm-color-emphasis-800); +} + +.menu__list .menu__list { + margin-top: 0; +} diff --git a/generator/konfig-docs/src/theme/BlogSidebar/Desktop/index.js b/generator/konfig-docs/src/theme/BlogSidebar/Desktop/index.js new file mode 100644 index 000000000..06682800c --- /dev/null +++ b/generator/konfig-docs/src/theme/BlogSidebar/Desktop/index.js @@ -0,0 +1,37 @@ +import React from "react"; +import clsx from "clsx"; +import Link from "@docusaurus/Link"; +import { translate } from "@docusaurus/Translate"; +import styles from "./styles.module.css"; +export default function BlogSidebarDesktop({ sidebar }) { + return ( + + ); +} diff --git a/generator/konfig-docs/src/theme/BlogSidebar/Desktop/styles.module.css b/generator/konfig-docs/src/theme/BlogSidebar/Desktop/styles.module.css new file mode 100644 index 000000000..ce897e03f --- /dev/null +++ b/generator/konfig-docs/src/theme/BlogSidebar/Desktop/styles.module.css @@ -0,0 +1,38 @@ +.sidebar { + max-height: calc(100vh - (var(--ifm-navbar-height) + 2rem)); + overflow-y: auto; + position: sticky; + top: calc(var(--ifm-navbar-height) + 2rem); +} + +.sidebarItemTitle { + font-size: var(--ifm-h3-font-size); + font-weight: var(--ifm-font-weight-bold); +} + +.sidebarItemList { + font-size: 0.9rem; +} + +.sidebarItem { + margin-top: 0.7rem; +} + +.sidebarItemLink { + color: var(--ifm-color-gray-600); + display: block; +} + +.sidebarItemLink:hover { + text-decoration: none; +} + +.sidebarItemLinkActive { + color: var(--ifm-color-primary) !important; +} + +@media (max-width: 996px) { + .sidebar { + display: none; + } +} diff --git a/generator/konfig-docs/static/img/logo-light.png b/generator/konfig-docs/static/img/logo-light.png new file mode 100644 index 000000000..f17e04960 Binary files /dev/null and b/generator/konfig-docs/static/img/logo-light.png differ