@redocly/theme 0.82.2-rc.3 → 0.83.0-rc.1

package/src/layouts/NotFound.tsx

@@ -10,7 +10,7 @@ export function NotFound(): JSX.Element {
   const { translate } = useTranslate();
 
   return (
-    <Wrapper data-component-name="Pages/NotFound">
+    <NotFoundWrapper data-component-name="Pages/NotFound">
       <StatusText>404</StatusText>
       <Title data-translation-key="theme.page.notFound.title">
         {translate('theme.page.notFound.title', 'Something went missing...')}
@@ -30,11 +30,11 @@ export function NotFound(): JSX.Element {
       >
         {translate('theme.page.homeButton', 'Go home')}
       </Button>
-    </Wrapper>
+    </NotFoundWrapper>
   );
 }
 
-const Wrapper = styled.div`
+const NotFoundWrapper = styled.div`
   height: 100%;
   max-width: var(--page-404-max-width);
   display: flex;

package/src/layouts/RootLayout.tsx

@@ -3,9 +3,9 @@ import React from 'react';
 import { Navbar } from '@redocly/theme/components/Navbar/Navbar';
 import { Footer } from '@redocly/theme/components/Footer/Footer';
 
-interface LayoutConfig {
+export type LayoutConfig = {
   children: React.ReactNode;
-}
+};
 
 export function RootLayout({ children }: LayoutConfig): JSX.Element {
   return (

package/src/markdoc/components/InlineSvg/InlineSvg.tsx

@@ -1,8 +1,15 @@
 import * as React from 'react';
 
-export function InlineSvg({ fileRawContent }: { fileRawContent: string }) {
+export function InlineSvg({
+  fileRawContent,
+  className,
+}: {
+  fileRawContent: string;
+  className?: string;
+}) {
   return (
     <span
+      className={className}
       data-component-name="Markdoc/InlineSvg/InlineSvg"
       dangerouslySetInnerHTML={{ __html: fileRawContent }}
     />

package/src/markdoc/components/Tabs/variables.ts

@@ -6,8 +6,8 @@ import { css } from "styled-components";
   */
 
   --md-tabs-container-text-color: inherit; // @presenter Color
-  --md-tabs-container-font-size: var(--font-size-base); // @presenter FontSize
-  --md-tabs-container-font-family: var(--font-size-base); // @presenter FontFamily
+  --md-tabs-container-font-size: var(--md-content-font-size); // @presenter FontSize
+  --md-tabs-container-font-family: var(--md-content-font-family); // @presenter FontFamily
   --md-tabs-container-font-style: normal; // @presenter FontStyle
   --md-tabs-container-font-weight: var(--font-weight-regular); // @presenter FontWeight
   --md-tabs-container-bg-color: inherit; // @presenter Color
@@ -20,8 +20,8 @@ import { css } from "styled-components";
   --md-tabs-padding: 0; // @presenter Spacing
 
   --md-tabs-content-text-color: inherit; // @presenter Color
-  --md-tabs-content-font-size: var(--font-size-base); // @presenter FontSize
-  --md-tabs-content-font-family: var(--font-size-base); // @presenter FontFamily
+  --md-tabs-content-font-size: var(--md-content-font-size); // @presenter FontSize
+  --md-tabs-content-font-family: var(--md-content-font-family); // @presenter FontFamily
   --md-tabs-content-font-style: normal; // @presenter FontStyle
   --md-tabs-content-font-weight: var(--font-weight-regular); // @presenter FontWeight
   --md-tabs-content-bg-color: inherit; // @presenter Color
@@ -31,7 +31,7 @@ import { css } from "styled-components";
 
   --md-tabs-tab-text-color: var(--text-color-primary); // @presenter Color
   --md-tabs-tab-font-size: var(--font-size-lg); // @presenter FontSize
-  --md-tabs-tab-font-family: var(--font-size-base); // @presenter FontFamily
+  --md-tabs-tab-font-family: var(--md-content-font-family); // @presenter FontFamily
   --md-tabs-tab-font-style: normal; // @presenter FontStyle
   --md-tabs-tab-font-weight: var(--font-weight-bold); // @presenter FontWeight
   --md-tabs-tab-bg-color: none; // @presenter Color