@docusaurus/theme-classic 0.0.0-4842 → 0.0.0-4845

package/lib/theme-classic.d.ts

@@ -176,6 +176,7 @@ declare module '@theme/DocCardList' {
 
   export interface Props {
     readonly items: PropSidebarItem[];
+    readonly className?: string;
   }
 
   export default function DocCardList(props: Props): JSX.Element;

package/lib-next/theme/BlogSidebar/Desktop/styles.module.css

@@ -29,6 +29,7 @@
 
 .sidebarItemLink {
   color: var(--ifm-font-color-base);
+  display: block;
 }
 
 .sidebarItemLink:hover {

package/lib-next/theme/DocCardList/index.js

@@ -5,9 +5,11 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React from 'react';
+import clsx from 'clsx';
 import DocCard from '@theme/DocCard';
-import {findFirstCategoryLink} from '@docusaurus/theme-common'; // Filter categories that don't have a link.
+import {findFirstCategoryLink} from '@docusaurus/theme-common';
 
+// Filter categories that don't have a link.
 function filterItems(items) {
   return items.filter((item) => {
     if (item.type === 'category') {
@@ -18,9 +20,9 @@ function filterItems(items) {
   });
 }
 
-export default function DocCardList({items}) {
+export default function DocCardList({items, className}) {
   return (
-    <div className="row">
+    <div className={clsx('row', className)}>
       {filterItems(items).map((item, index) => (
         <article key={index} className="col col--6 margin-bottom--lg">
           <DocCard key={index} item={item} />

package/lib-next/theme/DocCategoryGeneratedIndexPage/index.js

@@ -52,7 +52,7 @@ function DocCategoryGeneratedIndexPageContent({categoryGeneratedIndex}) {
           )}
         </header>
         <main className="margin-top--lg">
-          <DocCardList items={category.items} />
+          <DocCardList items={category.items} className={styles.list} />
         </main>
         <footer className="margin-top--lg">
           <DocPaginator

package/lib-next/theme/DocCategoryGeneratedIndexPage/styles.module.css

@@ -16,3 +16,7 @@
   --ifm-h1-font-size: 3rem;
   margin-bottom: calc(1.25 * var(--ifm-leading));
 }
+
+.list article:nth-last-child(-n + 2) {
+  margin-bottom: 0 !important;
+}

package/lib-next/theme/DocItem/styles.module.css

@@ -20,3 +20,9 @@
     display: none;
   }
 }
+
+@media print {
+  .tocMobile {
+    display: none;
+  }
+}

package/lib-next/theme/DocSidebar/Desktop/Content/styles.module.css

@@ -10,6 +10,12 @@
     flex-grow: 1;
     padding: 0.5rem;
   }
+  @supports (scrollbar-gutter: stable) {
+    .menu {
+      padding: 0.5rem 0 0.5rem 0.5rem;
+      scrollbar-gutter: stable;
+    }
+  }
 
   .menuWithAnnouncementBar {
     margin-bottom: var(--docusaurus-announcement-bar-height);

package/lib-next/theme/NavbarItem/LocaleDropdownNavbarItem/index.js

@@ -51,7 +51,7 @@ export default function LocaleDropdownNavbarItem({
       label={
         <span>
           <IconLanguage className={styles.iconLanguage} />
-          <span>{dropdownLabel}</span>
+          {dropdownLabel}
         </span>
       }
       items={items}

package/lib-next/theme/TabItem/index.js

@@ -5,13 +5,15 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React from 'react';
+import clsx from 'clsx';
+import styles from './styles.module.css';
 export default function TabItem({children, hidden, className}) {
   return (
     <div
       role="tabpanel"
+      className={clsx(styles.tabItem, className)}
       {...{
         hidden,
-        className,
       }}>
       {children}
     </div>

package/lib-next/theme/TabItem/styles.module.css

@@ -0,0 +1,10 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+.tabItem > *:last-child {
+  margin-bottom: 0;
+}

package/lib-next/theme/Tabs/index.js

@@ -132,7 +132,7 @@ function TabsComponent(props) {
   };
 
   return (
-    <div className="tabs-container">
+    <div className={clsx('tabs-container', styles.tabList)}>
       <ul
         role="tablist"
         aria-orientation="horizontal"
@@ -173,11 +173,11 @@ function TabsComponent(props) {
             (tabItem) => tabItem.props.value === selectedValue,
           )[0],
           {
-            className: 'margin-vert--md',
+            className: 'margin-top--md',
           },
         )
       ) : (
-        <div className="margin-vert--md">
+        <div className="margin-top--md">
           {children.map((tabItem, i) =>
             cloneElement(tabItem, {
               key: i,

package/lib-next/theme/Tabs/styles.module.css

@@ -5,6 +5,10 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+.tabList {
+  margin-bottom: var(--ifm-leading);
+}
+
 .tabItem {
   margin-top: 0 !important;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@docusaurus/theme-classic",
-  "version": "0.0.0-4842",
+  "version": "0.0.0-4845",
   "description": "Classic theme for Docusaurus",
   "main": "lib/index.js",
   "types": "src/theme-classic.d.ts",
@@ -21,15 +21,15 @@
     "format:lib-next": "prettier --config ../../.prettierrc --write \"lib-next/**/*.{js,ts,jsx,tsc}\""
   },
   "dependencies": {
-    "@docusaurus/core": "0.0.0-4842",
-    "@docusaurus/plugin-content-blog": "0.0.0-4842",
-    "@docusaurus/plugin-content-docs": "0.0.0-4842",
-    "@docusaurus/plugin-content-pages": "0.0.0-4842",
-    "@docusaurus/theme-common": "0.0.0-4842",
-    "@docusaurus/theme-translations": "0.0.0-4842",
-    "@docusaurus/utils": "0.0.0-4842",
-    "@docusaurus/utils-common": "0.0.0-4842",
-    "@docusaurus/utils-validation": "0.0.0-4842",
+    "@docusaurus/core": "0.0.0-4845",
+    "@docusaurus/plugin-content-blog": "0.0.0-4845",
+    "@docusaurus/plugin-content-docs": "0.0.0-4845",
+    "@docusaurus/plugin-content-pages": "0.0.0-4845",
+    "@docusaurus/theme-common": "0.0.0-4845",
+    "@docusaurus/theme-translations": "0.0.0-4845",
+    "@docusaurus/utils": "0.0.0-4845",
+    "@docusaurus/utils-common": "0.0.0-4845",
+    "@docusaurus/utils-validation": "0.0.0-4845",
     "@mdx-js/react": "^1.6.22",
     "clsx": "^1.1.1",
     "copy-text-to-clipboard": "^3.0.1",
@@ -42,8 +42,8 @@
     "rtlcss": "^3.5.0"
   },
   "devDependencies": {
-    "@docusaurus/module-type-aliases": "0.0.0-4842",
-    "@docusaurus/types": "0.0.0-4842",
+    "@docusaurus/module-type-aliases": "0.0.0-4845",
+    "@docusaurus/types": "0.0.0-4845",
     "@types/mdx-js__react": "^1.5.5",
     "@types/prismjs": "^1.26.0",
     "@types/rtlcss": "^3.1.3",
@@ -59,5 +59,5 @@
   "engines": {
     "node": ">=14"
   },
-  "gitHead": "6bf15cea226810a6d8263f83eb2b6a56a5d0499b"
+  "gitHead": "5381d62303ebb8010c7de7dbe9b4c5d5be612fea"
 }

package/src/theme/BlogSidebar/Desktop/styles.module.css

@@ -29,6 +29,7 @@
 
 .sidebarItemLink {
   color: var(--ifm-font-color-base);
+  display: block;
 }
 
 .sidebarItemLink:hover {

package/src/theme/DocCardList/index.tsx

@@ -6,10 +6,12 @@
  */
 
 import React from 'react';
+import clsx from 'clsx';
 
 import DocCard from '@theme/DocCard';
 import type {PropSidebarItem} from '@docusaurus/plugin-content-docs';
 import {findFirstCategoryLink} from '@docusaurus/theme-common';
+import type {Props} from '@theme/DocCardList';
 
 // Filter categories that don't have a link.
 function filterItems(items: PropSidebarItem[]): PropSidebarItem[] {
@@ -21,13 +23,9 @@ function filterItems(items: PropSidebarItem[]): PropSidebarItem[] {
   });
 }
 
-export default function DocCardList({
-  items,
-}: {
-  items: PropSidebarItem[];
-}): JSX.Element {
+export default function DocCardList({items, className}: Props): JSX.Element {
   return (
-    <div className="row">
+    <div className={clsx('row', className)}>
       {filterItems(items).map((item, index) => (
         <article key={index} className="col col--6 margin-bottom--lg">
           <DocCard key={index} item={item} />

package/src/theme/DocCategoryGeneratedIndexPage/index.tsx

@@ -61,7 +61,7 @@ function DocCategoryGeneratedIndexPageContent({
           )}
         </header>
         <main className="margin-top--lg">
-          <DocCardList items={category.items} />
+          <DocCardList items={category.items} className={styles.list} />
         </main>
         <footer className="margin-top--lg">
           <DocPaginator

package/src/theme/DocCategoryGeneratedIndexPage/styles.module.css

@@ -16,3 +16,7 @@
   --ifm-h1-font-size: 3rem;
   margin-bottom: calc(1.25 * var(--ifm-leading));
 }
+
+.list article:nth-last-child(-n + 2) {
+  margin-bottom: 0 !important;
+}

package/src/theme/DocItem/styles.module.css

@@ -20,3 +20,9 @@
     display: none;
   }
 }
+
+@media print {
+  .tocMobile {
+    display: none;
+  }
+}

package/src/theme/DocSidebar/Desktop/Content/styles.module.css

@@ -10,6 +10,12 @@
     flex-grow: 1;
     padding: 0.5rem;
   }
+  @supports (scrollbar-gutter: stable) {
+    .menu {
+      padding: 0.5rem 0 0.5rem 0.5rem;
+      scrollbar-gutter: stable;
+    }
+  }
 
   .menuWithAnnouncementBar {
     margin-bottom: var(--docusaurus-announcement-bar-height);

package/src/theme/NavbarItem/LocaleDropdownNavbarItem/index.tsx

@@ -60,7 +60,7 @@ export default function LocaleDropdownNavbarItem({
       label={
         <span>
           <IconLanguage className={styles.iconLanguage} />
-          <span>{dropdownLabel}</span>
+          {dropdownLabel}
         </span>
       }
       items={items}

package/src/theme/TabItem/index.tsx

@@ -7,6 +7,9 @@
 
 import React from 'react';
 import type {Props} from '@theme/TabItem';
+import clsx from 'clsx';
+
+import styles from './styles.module.css';
 
 export default function TabItem({
   children,
@@ -14,7 +17,10 @@ export default function TabItem({
   className,
 }: Props): JSX.Element {
   return (
-    <div role="tabpanel" {...{hidden, className}}>
+    <div
+      role="tabpanel"
+      className={clsx(styles.tabItem, className)}
+      {...{hidden}}>
       {children}
     </div>
   );

package/src/theme/TabItem/styles.module.css

@@ -0,0 +1,10 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+.tabItem > *:last-child {
+  margin-bottom: 0;
+}

package/src/theme/Tabs/index.tsx

@@ -141,7 +141,7 @@ function TabsComponent(props: Props): JSX.Element {
   };
 
   return (
-    <div className="tabs-container">
+    <div className={clsx('tabs-container', styles.tabList)}>
       <ul
         role="tablist"
         aria-orientation="horizontal"
@@ -181,10 +181,10 @@ function TabsComponent(props: Props): JSX.Element {
           children.filter(
             (tabItem) => tabItem.props.value === selectedValue,
           )[0]!,
-          {className: 'margin-vert--md'},
+          {className: 'margin-top--md'},
         )
       ) : (
-        <div className="margin-vert--md">
+        <div className="margin-top--md">
           {children.map((tabItem, i) =>
             cloneElement(tabItem, {
               key: i,

package/src/theme/Tabs/styles.module.css

@@ -5,6 +5,10 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+.tabList {
+  margin-bottom: var(--ifm-leading);
+}
+
 .tabItem {
   margin-top: 0 !important;
 }

package/src/theme-classic.d.ts

@@ -176,6 +176,7 @@ declare module '@theme/DocCardList' {
 
   export interface Props {
     readonly items: PropSidebarItem[];
+    readonly className?: string;
   }
 
   export default function DocCardList(props: Props): JSX.Element;