diff --git a/packages/documentation/src/_everything.scss b/packages/documentation/src/_everything.scss index 83e1740084..89c80fca99 100644 --- a/packages/documentation/src/_everything.scss +++ b/packages/documentation/src/_everything.scss @@ -5,21 +5,3 @@ $rmd-theme-secondary: $rmd-pink-a-200, $rmd-utils-auto-dense: true ); - -$solarized-base-03: #002b36; -$solarized-base-02: #073642; -$solarized-base-01: #586e75; -$solarized-base-00: #657b83; -$solarized-base-0: #839496; -$solarized-base-1: #93a1a1; -$solarized-base-2: #eee8d5; -$solarized-base-3: #fdf6e3; - -$solarized-yellow: #b58900; -$solarized-orange: #cb4b16; -$solarized-red: #d30102; -$solarized-magenta: #d33682; -$solarized-violet: #6c71c4; -$solarized-blue: #268bd2; -$solarized-cyan: #2aa198; -$solarized-green: #859900; diff --git a/packages/documentation/src/components/Code/Code.module.scss b/packages/documentation/src/components/Code/Code.module.scss index a2a642dcdb..9bfffb9505 100644 --- a/packages/documentation/src/components/Code/Code.module.scss +++ b/packages/documentation/src/components/Code/Code.module.scss @@ -1,4 +1,4 @@ -@use '../../everything' as *; +@use 'react-md' as *; .code { @include rmd-typography(body-1); diff --git a/packages/documentation/src/components/Code/index.ts b/packages/documentation/src/components/Code/index.ts index c703387719..27aa31e493 100644 --- a/packages/documentation/src/components/Code/index.ts +++ b/packages/documentation/src/components/Code/index.ts @@ -1,2 +1 @@ -export { default as Code } from "./Code"; -export { default as CodeBlock } from "./CodeBlock"; +export { default } from "./Code"; diff --git a/packages/documentation/src/components/Code/CodeBlock.module.scss b/packages/documentation/src/components/CodeBlock/CodeBlock.module.scss similarity index 76% rename from packages/documentation/src/components/Code/CodeBlock.module.scss rename to packages/documentation/src/components/CodeBlock/CodeBlock.module.scss index 6a7e6d69aa..837f25a6f0 100644 --- a/packages/documentation/src/components/Code/CodeBlock.module.scss +++ b/packages/documentation/src/components/CodeBlock/CodeBlock.module.scss @@ -1,10 +1,11 @@ -@use '../../everything' as *; +@use 'react-md' as *; +@use './solarized'; .block { @include rmd-typography(body-1); - background-color: $solarized-base-03; - color: $solarized-base-1; + background-color: solarized.$base-03; + color: solarized.$base-1; // always enforce ltr for blocked code direction: ltr; @@ -15,7 +16,7 @@ &::selection, *::selection { - background-color: $solarized-base-02; + background-color: solarized.$base-02; } // to help with the collapse transition on expandable code, update it so @@ -34,45 +35,45 @@ &.comment, &.doctype { - color: $solarized-base-01; + color: solarized.$base-01; } &.keyword { - color: $solarized-green; + color: solarized.$green; } &.punctuation { - color: $solarized-base-01; + color: solarized.$base-01; } &.inserted, &.string, .language-tsx &.attr-value { - color: $solarized-cyan; + color: solarized.$cyan; } &.tag, &.selector, &.class-name { - color: $solarized-blue; + color: solarized.$blue; } &.attr-name, &.property, &.builtin { - color: $solarized-yellow; + color: solarized.$yellow; } &.script, &.interpolation { - color: $solarized-base-1; + color: solarized.$base-1; } &.deleted, &.boolean, &.number, &.interpolation-punctuation { - color: $solarized-red; + color: solarized.$red; } &.important, @@ -92,16 +93,16 @@ &:global(.language-scss) :global .token.function, &:global(.language-scss) :global .token.variable { - color: $solarized-blue; + color: solarized.$blue; } &:global(.language-ts) :global .token + .class-name { - color: $solarized-base-1; + color: solarized.$base-1; } &:global(.language-scss) :global .token.function, &:global(.language-shell) :global .token.function { - color: $solarized-orange; + color: solarized.$orange; } } diff --git a/packages/documentation/src/components/Code/CodeBlock.tsx b/packages/documentation/src/components/CodeBlock/CodeBlock.tsx similarity index 98% rename from packages/documentation/src/components/Code/CodeBlock.tsx rename to packages/documentation/src/components/CodeBlock/CodeBlock.tsx index 7bc2cae8c5..dfa1875ee6 100644 --- a/packages/documentation/src/components/Code/CodeBlock.tsx +++ b/packages/documentation/src/components/CodeBlock/CodeBlock.tsx @@ -6,8 +6,8 @@ import React, { } from "react"; import cn from "classnames"; +import Code from "../Code"; import styles from "./CodeBlock.module.scss"; -import Code from "./Code"; import LineNumbers from "./LineNumbers"; import { highlightCode } from "./utils"; diff --git a/packages/documentation/src/components/Code/LineNumbers.module.scss b/packages/documentation/src/components/CodeBlock/LineNumbers.module.scss similarity index 79% rename from packages/documentation/src/components/Code/LineNumbers.module.scss rename to packages/documentation/src/components/CodeBlock/LineNumbers.module.scss index 6542b8aa7a..b9cf74d9f1 100644 --- a/packages/documentation/src/components/Code/LineNumbers.module.scss +++ b/packages/documentation/src/components/CodeBlock/LineNumbers.module.scss @@ -1,7 +1,7 @@ -@use '../../everything' as *; +@use './solarized'; .container { - border-right: 1px solid $solarized-base-01; + border-right: 1px solid solarized.$base-01; counter-reset: line-numbers; display: flex; flex-direction: column; diff --git a/packages/documentation/src/components/Code/LineNumbers.tsx b/packages/documentation/src/components/CodeBlock/LineNumbers.tsx similarity index 100% rename from packages/documentation/src/components/Code/LineNumbers.tsx rename to packages/documentation/src/components/CodeBlock/LineNumbers.tsx diff --git a/packages/documentation/src/components/CodeBlock/_solarized.scss b/packages/documentation/src/components/CodeBlock/_solarized.scss new file mode 100644 index 0000000000..7f22cf0f9a --- /dev/null +++ b/packages/documentation/src/components/CodeBlock/_solarized.scss @@ -0,0 +1,17 @@ +$base-03: #002b36; +$base-02: #073642; +$base-01: #586e75; +$base-00: #657b83; +$base-0: #839496; +$base-1: #93a1a1; +$base-2: #eee8d5; +$base-3: #fdf6e3; + +$yellow: #b58900; +$orange: #cb4b16; +$red: #d30102; +$magenta: #d33682; +$violet: #6c71c4; +$blue: #268bd2; +$cyan: #2aa198; +$green: #859900; diff --git a/packages/documentation/src/components/CodeBlock/index.ts b/packages/documentation/src/components/CodeBlock/index.ts new file mode 100644 index 0000000000..45a9fcacda --- /dev/null +++ b/packages/documentation/src/components/CodeBlock/index.ts @@ -0,0 +1 @@ +export { default } from "./CodeBlock"; diff --git a/packages/documentation/src/components/Code/utils.ts b/packages/documentation/src/components/CodeBlock/utils.ts similarity index 100% rename from packages/documentation/src/components/Code/utils.ts rename to packages/documentation/src/components/CodeBlock/utils.ts diff --git a/packages/documentation/src/components/ColorsAndTheming/ColorPalette/About.tsx b/packages/documentation/src/components/ColorsAndTheming/ColorPalette/About.tsx index 22b0398ff5..68115093cd 100644 --- a/packages/documentation/src/components/ColorsAndTheming/ColorPalette/About.tsx +++ b/packages/documentation/src/components/ColorsAndTheming/ColorPalette/About.tsx @@ -1,9 +1,10 @@ import React, { ReactElement } from "react"; import { Text, TextContainer } from "@react-md/typography"; +import { Link } from "@react-md/link"; +import Code from "components/Code"; +import CodeBlock from "components/CodeBlock"; import Heading from "components/Heading"; -import { Link } from "@react-md/link"; -import { Code, CodeBlock } from "components/Code"; export default function About(): ReactElement { return ( diff --git a/packages/documentation/src/components/DemoSandbox/CodePreview.tsx b/packages/documentation/src/components/DemoSandbox/CodePreview.tsx index 585c09e33d..d642400422 100644 --- a/packages/documentation/src/components/DemoSandbox/CodePreview.tsx +++ b/packages/documentation/src/components/DemoSandbox/CodePreview.tsx @@ -3,7 +3,7 @@ import cn from "classnames"; import { IFiles } from "codesandbox-import-utils/lib/api/define"; import { CircularProgress } from "@react-md/progress"; -import { CodeBlock } from "components/Code"; +import CodeBlock from "components/CodeBlock"; import FileNotFound from "./FileNotFound"; diff --git a/packages/documentation/src/components/DemoSandbox/FileNotFound.tsx b/packages/documentation/src/components/DemoSandbox/FileNotFound.tsx index c73e5ba26a..13779fb6e6 100644 --- a/packages/documentation/src/components/DemoSandbox/FileNotFound.tsx +++ b/packages/documentation/src/components/DemoSandbox/FileNotFound.tsx @@ -7,7 +7,7 @@ import { List, ListItem } from "@react-md/list"; import { Text, TextContainer } from "@react-md/typography"; import { bem } from "@react-md/utils"; -import Code from "components/Code/Code"; +import Code from "components/Code"; import styles from "./CodePreview.module.scss"; diff --git a/packages/documentation/src/components/Demos/Alert/HandlingDuplicatedMessages.tsx b/packages/documentation/src/components/Demos/Alert/HandlingDuplicatedMessages.tsx index 5a9f2c98f3..7a9eac50ff 100644 --- a/packages/documentation/src/components/Demos/Alert/HandlingDuplicatedMessages.tsx +++ b/packages/documentation/src/components/Demos/Alert/HandlingDuplicatedMessages.tsx @@ -10,7 +10,7 @@ import { Divider } from "@react-md/divider"; import { Fieldset, Form, NativeSelect, Radio, useChoice } from "@react-md/form"; import { ArrowDropDownSVGIcon } from "@react-md/material-icons"; -import Code from "components/Code/Code"; +import Code from "components/Code"; interface Props { duplicates: DuplicateBehavior; diff --git a/packages/documentation/src/components/Demos/Elevation/AllElevations.tsx b/packages/documentation/src/components/Demos/Elevation/AllElevations.tsx index 09e76687ab..d152716a1e 100644 --- a/packages/documentation/src/components/Demos/Elevation/AllElevations.tsx +++ b/packages/documentation/src/components/Demos/Elevation/AllElevations.tsx @@ -1,7 +1,7 @@ import React, { ReactElement } from "react"; import cn from "classnames"; -import Code from "components/Code/Code"; +import Code from "components/Code"; import styles from "./AllElevations.module.scss"; diff --git a/packages/documentation/src/components/Demos/Form/FileInputs/FileInputExample.tsx b/packages/documentation/src/components/Demos/Form/FileInputs/FileInputExample.tsx index 013f97c1c8..0055e807ce 100644 --- a/packages/documentation/src/components/Demos/Form/FileInputs/FileInputExample.tsx +++ b/packages/documentation/src/components/Demos/Form/FileInputs/FileInputExample.tsx @@ -12,7 +12,7 @@ import { } from "@react-md/form"; import { SrOnly, Text } from "@react-md/typography"; -import CodeBlock from "components/Code/CodeBlock"; +import CodeBlock from "components/CodeBlock"; import styles from "./FileInputExample.module.scss"; diff --git a/packages/documentation/src/components/Demos/Form/Sliders/ConfigurableSlider.tsx b/packages/documentation/src/components/Demos/Form/Sliders/ConfigurableSlider.tsx index cff1ef0bcd..dd417fdb23 100644 --- a/packages/documentation/src/components/Demos/Form/Sliders/ConfigurableSlider.tsx +++ b/packages/documentation/src/components/Demos/Form/Sliders/ConfigurableSlider.tsx @@ -13,7 +13,7 @@ import { import { Text } from "@react-md/typography"; import { Grid, GridCell } from "@react-md/utils"; -import Code from "components/Code/Code"; +import Code from "components/Code"; import { NfcSVGIcon, SyncSVGIcon } from "@react-md/material-icons"; interface ConfiguredSliderProps extends UseSliderOptions { diff --git a/packages/documentation/src/components/Demos/Form/TextFields/NumberHookExamples.tsx b/packages/documentation/src/components/Demos/Form/TextFields/NumberHookExamples.tsx index c139927684..f3aa41a526 100644 --- a/packages/documentation/src/components/Demos/Form/TextFields/NumberHookExamples.tsx +++ b/packages/documentation/src/components/Demos/Form/TextFields/NumberHookExamples.tsx @@ -8,7 +8,7 @@ import { import { Text } from "@react-md/typography"; import { Grid } from "@react-md/utils"; -import Code from "components/Code/Code"; +import Code from "components/Code"; export default function NumberHookExamples(): ReactElement | null { const [value1, field1Props] = useNumberField({ diff --git a/packages/documentation/src/components/Demos/Form/Validation/WithReactHookForm.tsx b/packages/documentation/src/components/Demos/Form/Validation/WithReactHookForm.tsx index 089f7e6c9b..1062c9711a 100644 --- a/packages/documentation/src/components/Demos/Form/Validation/WithReactHookForm.tsx +++ b/packages/documentation/src/components/Demos/Form/Validation/WithReactHookForm.tsx @@ -14,7 +14,7 @@ import { import { CircularProgress } from "@react-md/progress"; import { useTimeout } from "@react-md/utils"; -import CodeBlock from "components/Code/CodeBlock"; +import CodeBlock from "components/CodeBlock"; import ControllerTextField, { ExampleFormData } from "./ControllerTextField"; interface State { diff --git a/packages/documentation/src/components/Demos/Layout/ConfigurationForm.tsx b/packages/documentation/src/components/Demos/Layout/ConfigurationForm.tsx index 8dc7d4bab9..580b481b42 100644 --- a/packages/documentation/src/components/Demos/Layout/ConfigurationForm.tsx +++ b/packages/documentation/src/components/Demos/Layout/ConfigurationForm.tsx @@ -8,7 +8,8 @@ import { } from "@react-md/layout"; import { Text } from "@react-md/typography"; import { Grid, useAppSize } from "@react-md/utils"; -import Code from "components/Code/Code"; + +import Code from "components/Code"; interface ConfigurationFormProps { phoneLayout: SupportedPhoneLayout; diff --git a/packages/documentation/src/components/Demos/Layout/CurrentChildren.tsx b/packages/documentation/src/components/Demos/Layout/CurrentChildren.tsx index 13940c6e41..45e612ce09 100644 --- a/packages/documentation/src/components/Demos/Layout/CurrentChildren.tsx +++ b/packages/documentation/src/components/Demos/Layout/CurrentChildren.tsx @@ -1,7 +1,8 @@ +import React, { ReactElement } from "react"; import { Text } from "@react-md/typography"; import { Grid } from "@react-md/utils"; -import Code from "components/Code/Code"; -import React, { ReactElement } from "react"; + +import Code from "components/Code"; export interface CurrentChildrenProps { route: string; diff --git a/packages/documentation/src/components/Demos/Layout/LayoutVisibility.tsx b/packages/documentation/src/components/Demos/Layout/LayoutVisibility.tsx index 48e9390bf9..e6905d1c8e 100644 --- a/packages/documentation/src/components/Demos/Layout/LayoutVisibility.tsx +++ b/packages/documentation/src/components/Demos/Layout/LayoutVisibility.tsx @@ -3,8 +3,8 @@ import { Button } from "@react-md/button"; import { isPersistentLayout, useLayoutConfig } from "@react-md/layout"; import { Text } from "@react-md/typography"; -import CodeBlock from "components/Code/CodeBlock"; import Blockquote from "components/Blockquote"; +import CodeBlock from "components/CodeBlock"; export default function LayoutVisibility(): ReactElement { const { showNav, hideNav, ...remaining } = useLayoutConfig(); diff --git a/packages/documentation/src/components/Demos/Link/SimpleExamples.tsx b/packages/documentation/src/components/Demos/Link/SimpleExamples.tsx index a60f0717f5..28839ed795 100644 --- a/packages/documentation/src/components/Demos/Link/SimpleExamples.tsx +++ b/packages/documentation/src/components/Demos/Link/SimpleExamples.tsx @@ -2,7 +2,7 @@ import React, { ReactElement } from "react"; import { Link } from "@react-md/link"; import { Text } from "@react-md/typography"; -import Code from "components/Code/Code"; +import Code from "components/Code"; export default function SimpleExamples(): ReactElement { return ( diff --git a/packages/documentation/src/components/Demos/MaterialIcons/AllIcons.tsx b/packages/documentation/src/components/Demos/MaterialIcons/AllIcons.tsx index ee1578d3c7..fd91c71242 100644 --- a/packages/documentation/src/components/Demos/MaterialIcons/AllIcons.tsx +++ b/packages/documentation/src/components/Demos/MaterialIcons/AllIcons.tsx @@ -2,7 +2,7 @@ import React, { ReactElement } from "react"; import * as MaterialIcons from "@react-md/material-icons"; import { Tooltipped } from "@react-md/tooltip"; -import Code from "components/Code/Code"; +import Code from "components/Code"; import styles from "./AllIcons.module.scss"; diff --git a/packages/documentation/src/components/Demos/Menu/AddingEventHandlers/AddingOnClick.tsx b/packages/documentation/src/components/Demos/Menu/AddingEventHandlers/AddingOnClick.tsx index e082cc351b..056fd8e3d3 100644 --- a/packages/documentation/src/components/Demos/Menu/AddingEventHandlers/AddingOnClick.tsx +++ b/packages/documentation/src/components/Demos/Menu/AddingEventHandlers/AddingOnClick.tsx @@ -2,7 +2,7 @@ import React, { ReactElement, useState } from "react"; import { DropdownMenu } from "@react-md/menu"; import { Text } from "@react-md/typography"; -import Code from "components/Code/Code"; +import Code from "components/Code"; export default function AddingOnClick(): ReactElement { const [value, setValue] = useState("None"); diff --git a/packages/documentation/src/components/Demos/Menu/AddingEventHandlers/CustomMenuItems.tsx b/packages/documentation/src/components/Demos/Menu/AddingEventHandlers/CustomMenuItems.tsx index e53595c651..f8e51ce173 100644 --- a/packages/documentation/src/components/Demos/Menu/AddingEventHandlers/CustomMenuItems.tsx +++ b/packages/documentation/src/components/Demos/Menu/AddingEventHandlers/CustomMenuItems.tsx @@ -5,7 +5,7 @@ import { AddSVGIcon, ShareSVGIcon } from "@react-md/material-icons"; import { DropdownMenu, MenuItem, MenuItemProps } from "@react-md/menu"; import { Text } from "@react-md/typography"; -import Code from "components/Code/Code"; +import Code from "components/Code"; function Share(props: MenuItemProps): ReactElement { return ( diff --git a/packages/documentation/src/components/Demos/Menu/CustomRenderers/NonVirtualizedMenu.tsx b/packages/documentation/src/components/Demos/Menu/CustomRenderers/NonVirtualizedMenu.tsx index fdeaf730c9..f8748c07c3 100644 --- a/packages/documentation/src/components/Demos/Menu/CustomRenderers/NonVirtualizedMenu.tsx +++ b/packages/documentation/src/components/Demos/Menu/CustomRenderers/NonVirtualizedMenu.tsx @@ -3,7 +3,7 @@ import { ListItemAddonType } from "@react-md/list"; import { DropdownMenu } from "@react-md/menu"; import { Text } from "@react-md/typography"; -import Code from "components/Code/Code"; +import Code from "components/Code"; interface Item { leftAddon: ReactNode; diff --git a/packages/documentation/src/components/Demos/Menu/CustomRenderers/VirtualizedMenu.tsx b/packages/documentation/src/components/Demos/Menu/CustomRenderers/VirtualizedMenu.tsx index 3ea5b592a5..e3568daf7c 100644 --- a/packages/documentation/src/components/Demos/Menu/CustomRenderers/VirtualizedMenu.tsx +++ b/packages/documentation/src/components/Demos/Menu/CustomRenderers/VirtualizedMenu.tsx @@ -6,7 +6,7 @@ import { DropdownMenu, Menu, MenuItem, MenuRenderer } from "@react-md/menu"; import { Text } from "@react-md/typography"; import { unitToNumber, useAppSize } from "@react-md/utils"; -import Code from "components/Code/Code"; +import Code from "components/Code"; const mobileHeight = unitToNumber(scssVariables["rmd-list-item-large-height"]); const desktopHeight = unitToNumber( diff --git a/packages/documentation/src/components/Demos/Portal/CustomPortalContainer.tsx b/packages/documentation/src/components/Demos/Portal/CustomPortalContainer.tsx index 338dca37b7..696af2bb83 100644 --- a/packages/documentation/src/components/Demos/Portal/CustomPortalContainer.tsx +++ b/packages/documentation/src/components/Demos/Portal/CustomPortalContainer.tsx @@ -3,7 +3,7 @@ import { Radio, useChoice } from "@react-md/form"; import { Portal } from "@react-md/portal"; import { Text } from "@react-md/typography"; -import Code from "components/Code/Code"; +import Code from "components/Code"; import styles from "./CustomPortalContainer.module.scss"; diff --git a/packages/documentation/src/components/Demos/Tooltip/AdvancedAPIAndGotchas.tsx b/packages/documentation/src/components/Demos/Tooltip/AdvancedAPIAndGotchas.tsx index 5a0042b687..65c09b6cd1 100644 --- a/packages/documentation/src/components/Demos/Tooltip/AdvancedAPIAndGotchas.tsx +++ b/packages/documentation/src/components/Demos/Tooltip/AdvancedAPIAndGotchas.tsx @@ -3,7 +3,7 @@ import { Button } from "@react-md/button"; import { Tooltipped } from "@react-md/tooltip"; import { Text } from "@react-md/typography"; -import CodeBlock from "components/Code/CodeBlock"; +import CodeBlock from "components/CodeBlock"; function BrokenButton(): ReactElement { return ; diff --git a/packages/documentation/src/components/Demos/Transition/CrossFadeExamples.tsx b/packages/documentation/src/components/Demos/Transition/CrossFadeExamples.tsx index 6128b2d2df..a522675e39 100644 --- a/packages/documentation/src/components/Demos/Transition/CrossFadeExamples.tsx +++ b/packages/documentation/src/components/Demos/Transition/CrossFadeExamples.tsx @@ -2,7 +2,7 @@ import React, { ReactElement } from "react"; import { Divider } from "@react-md/divider"; import { Text } from "@react-md/typography"; -import Code from "components/Code/Code"; +import Code from "components/Code"; import CrossFadeExamplesAsync from "./CrossFadeExamplesAsync"; import CrossFadeExamplesStatic from "./CrossFadeExamplesStatic"; diff --git a/packages/documentation/src/components/Demos/Utils/AppSizeListenerExample.tsx b/packages/documentation/src/components/Demos/Utils/AppSizeListenerExample.tsx index f42cc17a8e..8310e49c81 100644 --- a/packages/documentation/src/components/Demos/Utils/AppSizeListenerExample.tsx +++ b/packages/documentation/src/components/Demos/Utils/AppSizeListenerExample.tsx @@ -2,7 +2,7 @@ import React, { ReactElement } from "react"; import { TextContainer, Text } from "@react-md/typography"; import { AppSizeListener, useAppSize } from "@react-md/utils"; -import CodeBlock from "components/Code/CodeBlock"; +import CodeBlock from "components/CodeBlock"; function CurrentSize(): ReactElement { const context = useAppSize(); diff --git a/packages/documentation/src/components/Demos/Utils/ResizeListenerExample.tsx b/packages/documentation/src/components/Demos/Utils/ResizeListenerExample.tsx index ef27881ebb..8890cb6e61 100644 --- a/packages/documentation/src/components/Demos/Utils/ResizeListenerExample.tsx +++ b/packages/documentation/src/components/Demos/Utils/ResizeListenerExample.tsx @@ -3,7 +3,7 @@ import { Checkbox, useChecked } from "@react-md/form"; import { Text } from "@react-md/typography"; import { ResizeListener } from "@react-md/utils"; -import CodeBlock from "components/Code/CodeBlock"; +import CodeBlock from "components/CodeBlock"; export default function ResizeListenerExample(): ReactElement { const [size, setSize] = useState(() => { diff --git a/packages/documentation/src/components/Home/Components.tsx b/packages/documentation/src/components/Home/Components.tsx index b806dcb991..bf3489e248 100644 --- a/packages/documentation/src/components/Home/Components.tsx +++ b/packages/documentation/src/components/Home/Components.tsx @@ -9,7 +9,8 @@ import { Divider } from "@react-md/divider"; import { MediaContainer } from "@react-md/media"; import { Text } from "@react-md/typography"; -import { Code, CodeBlock } from "components/Code"; +import Code from "components/Code"; +import CodeBlock from "components/CodeBlock"; import LinkButton from "components/LinkButton"; import { Component as SVG } from "./components.svg"; diff --git a/packages/documentation/src/components/Home/Customization.tsx b/packages/documentation/src/components/Home/Customization.tsx index db1b528b53..b3007c4032 100644 --- a/packages/documentation/src/components/Home/Customization.tsx +++ b/packages/documentation/src/components/Home/Customization.tsx @@ -9,7 +9,7 @@ import { Divider } from "@react-md/divider"; import { MediaContainer } from "@react-md/media"; import { Text } from "@react-md/typography"; -import { Code } from "components/Code"; +import Code from "components/Code"; import LinkButton from "components/LinkButton"; import { Component as SVG } from "./customization.svg"; diff --git a/packages/documentation/src/components/Home/GettingStarted.tsx b/packages/documentation/src/components/Home/GettingStarted.tsx index a2bd370e3a..25b78fd2fb 100644 --- a/packages/documentation/src/components/Home/GettingStarted.tsx +++ b/packages/documentation/src/components/Home/GettingStarted.tsx @@ -9,7 +9,7 @@ import { Divider } from "@react-md/divider"; import { MediaContainer } from "@react-md/media"; import { Text } from "@react-md/typography"; -import { Code } from "components/Code"; +import Code from "components/Code"; import LinkButton from "components/LinkButton"; import JumpStartCard from "./JumpStartCard"; diff --git a/packages/documentation/src/components/Home/LibraryInfo/AccessibilityCons.tsx b/packages/documentation/src/components/Home/LibraryInfo/AccessibilityCons.tsx index 03eea82d7f..24ae4313e9 100644 --- a/packages/documentation/src/components/Home/LibraryInfo/AccessibilityCons.tsx +++ b/packages/documentation/src/components/Home/LibraryInfo/AccessibilityCons.tsx @@ -1,6 +1,6 @@ import React, { ReactElement } from "react"; -import { Code } from "components/Code"; +import Code from "components/Code"; import TableCellList from "./TableCellList"; diff --git a/packages/documentation/src/components/Home/LibraryInfo/AccessibilityPros.tsx b/packages/documentation/src/components/Home/LibraryInfo/AccessibilityPros.tsx index 53cb1216a3..5304b688c9 100644 --- a/packages/documentation/src/components/Home/LibraryInfo/AccessibilityPros.tsx +++ b/packages/documentation/src/components/Home/LibraryInfo/AccessibilityPros.tsx @@ -1,6 +1,6 @@ import React, { ReactElement } from "react"; -import { Code } from "components/Code"; +import Code from "components/Code"; import TableCellList from "./TableCellList"; diff --git a/packages/documentation/src/components/Home/LibraryInfo/ComponentsPros.tsx b/packages/documentation/src/components/Home/LibraryInfo/ComponentsPros.tsx index 166f0e3bee..0f2382312c 100644 --- a/packages/documentation/src/components/Home/LibraryInfo/ComponentsPros.tsx +++ b/packages/documentation/src/components/Home/LibraryInfo/ComponentsPros.tsx @@ -1,6 +1,6 @@ import React, { ReactElement } from "react"; -import Code from "components/Code/Code"; +import Code from "components/Code"; import TableCellList from "./TableCellList"; diff --git a/packages/documentation/src/components/Home/LibraryInfo/StylingCons.tsx b/packages/documentation/src/components/Home/LibraryInfo/StylingCons.tsx index 9462a01c12..fa2402bbf1 100644 --- a/packages/documentation/src/components/Home/LibraryInfo/StylingCons.tsx +++ b/packages/documentation/src/components/Home/LibraryInfo/StylingCons.tsx @@ -1,6 +1,6 @@ import React, { ReactElement } from "react"; -import { Code } from "components/Code"; +import Code from "components/Code"; import Link from "components/Link"; import TableCellList from "./TableCellList"; diff --git a/packages/documentation/src/components/Home/LibraryInfo/StylingPros.tsx b/packages/documentation/src/components/Home/LibraryInfo/StylingPros.tsx index 2fe7453a5a..f2ce6f305e 100644 --- a/packages/documentation/src/components/Home/LibraryInfo/StylingPros.tsx +++ b/packages/documentation/src/components/Home/LibraryInfo/StylingPros.tsx @@ -1,6 +1,6 @@ import React, { ReactElement } from "react"; -import { Code } from "components/Code"; +import Code from "components/Code"; import Link from "components/Link"; import { UNPKG } from "./constants"; diff --git a/packages/documentation/src/components/Layout/Layout.tsx b/packages/documentation/src/components/Layout/Layout.tsx index 9ce4ed82cd..0fd7bdc243 100644 --- a/packages/documentation/src/components/Layout/Layout.tsx +++ b/packages/documentation/src/components/Layout/Layout.tsx @@ -70,11 +70,11 @@ const icons: ConfiguredIcons = { let devLayoutConf: LayoutConfiguration | undefined; if (process.env.NODE_ENV !== "production") { - devLayoutConf = { - landscapeTabletLayout: "temporary", - desktopLayout: "temporary", - largeDesktopLayout: "temporary", - }; + // devLayoutConf = { + // landscapeTabletLayout: "temporary", + // desktopLayout: "temporary", + // largeDesktopLayout: "temporary", + // }; } export default function Layout({ diff --git a/packages/documentation/src/components/Markdown/Markdown.tsx b/packages/documentation/src/components/Markdown/Markdown.tsx index 280c545605..f71a6d1544 100644 --- a/packages/documentation/src/components/Markdown/Markdown.tsx +++ b/packages/documentation/src/components/Markdown/Markdown.tsx @@ -7,7 +7,7 @@ import React, { import cn from "classnames"; import { Markdown as MarkdownRenderer } from "react-marked-renderer"; -import { getLanguage, highlightCode } from "components/Code/utils"; +import { getLanguage, highlightCode } from "components/CodeBlock/utils"; import styles from "./Markdown.module.scss"; import { renderers } from "./renderers"; diff --git a/packages/documentation/src/components/Markdown/renderers.tsx b/packages/documentation/src/components/Markdown/renderers.tsx index 0a4b3072f6..50d3892d13 100644 --- a/packages/documentation/src/components/Markdown/renderers.tsx +++ b/packages/documentation/src/components/Markdown/renderers.tsx @@ -18,8 +18,8 @@ import { } from "react-md"; import Blockquote from "components/Blockquote"; -import Code from "components/Code/Code"; -import CodeBlock from "components/Code/CodeBlock"; +import Code from "components/Code"; +import CodeBlock from "components/CodeBlock"; import Link from "components/Link"; import styles from "./renderers.module.scss"; diff --git a/packages/documentation/src/components/PackageSassDoc/Example.tsx b/packages/documentation/src/components/PackageSassDoc/Example.tsx index 2b8ad8209f..09821e4df9 100644 --- a/packages/documentation/src/components/PackageSassDoc/Example.tsx +++ b/packages/documentation/src/components/PackageSassDoc/Example.tsx @@ -2,7 +2,7 @@ import React, { ReactElement } from "react"; import { Switch, useChecked } from "@react-md/form"; import Heading from "components/Heading"; -import CodeBlock from "components/Code/CodeBlock"; +import CodeBlock from "components/CodeBlock"; import { CompiledExample } from "utils/sassdoc"; interface ExampleProps extends CompiledExample { diff --git a/packages/documentation/src/components/PackageSassDoc/ExpandableCode.tsx b/packages/documentation/src/components/PackageSassDoc/ExpandableCode.tsx index 53f060175c..d6d8ef13ea 100644 --- a/packages/documentation/src/components/PackageSassDoc/ExpandableCode.tsx +++ b/packages/documentation/src/components/PackageSassDoc/ExpandableCode.tsx @@ -2,7 +2,7 @@ import React, { ReactElement, useState } from "react"; import { UnstyledButton } from "@react-md/button"; import { Collapse } from "@react-md/transition"; -import { CodeBlock } from "components/Code"; +import CodeBlock from "components/CodeBlock"; import styles from "./ExpandableCode.module.scss"; diff --git a/packages/documentation/src/components/PackageSassDoc/Find.tsx b/packages/documentation/src/components/PackageSassDoc/Find.tsx index 6f24d769be..63789a9662 100644 --- a/packages/documentation/src/components/PackageSassDoc/Find.tsx +++ b/packages/documentation/src/components/PackageSassDoc/Find.tsx @@ -16,7 +16,7 @@ import { useAppSize, } from "@react-md/utils"; -import Code from "components/Code/Code"; +import Code from "components/Code"; import { FormattedSassDocItem, FormattedVariableItem } from "utils/sassdoc"; import getId from "./getId"; diff --git a/packages/documentation/src/components/PackageSassDoc/Parameters.tsx b/packages/documentation/src/components/PackageSassDoc/Parameters.tsx index 372035e3ef..af368237c0 100644 --- a/packages/documentation/src/components/PackageSassDoc/Parameters.tsx +++ b/packages/documentation/src/components/PackageSassDoc/Parameters.tsx @@ -8,7 +8,7 @@ import { TableRow, } from "@react-md/table"; -import Code from "components/Code/Code"; +import Code from "components/Code"; import { Markdown } from "components/Markdown"; import { M_DASH } from "constants/unicode"; import { ParameterizedItemParameter } from "utils/sassdoc"; diff --git a/packages/documentation/src/components/PackageSassDoc/Returns.tsx b/packages/documentation/src/components/PackageSassDoc/Returns.tsx index 290dd04699..4e21dfb66f 100644 --- a/packages/documentation/src/components/PackageSassDoc/Returns.tsx +++ b/packages/documentation/src/components/PackageSassDoc/Returns.tsx @@ -1,7 +1,7 @@ import React, { ReactElement } from "react"; import { Text } from "@react-md/typography"; -import Code from "components/Code/Code"; +import Code from "components/Code"; import { M_DASH } from "constants/unicode"; import { ItemReturn, SupportedItemDataType } from "utils/sassdoc"; diff --git a/packages/documentation/src/components/PackageSassDoc/SassDocItem.tsx b/packages/documentation/src/components/PackageSassDoc/SassDocItem.tsx index c34fb8ec66..335cd3f97e 100644 --- a/packages/documentation/src/components/PackageSassDoc/SassDocItem.tsx +++ b/packages/documentation/src/components/PackageSassDoc/SassDocItem.tsx @@ -1,7 +1,7 @@ import React, { ReactElement } from "react"; import { Text } from "@react-md/typography"; -import Code from "components/Code/Code"; +import Code from "components/Code"; import { Markdown } from "components/Markdown"; import GithubLink from "components/GithubLink"; import Link from "components/Link"; diff --git a/packages/documentation/src/components/PackageSassDoc/VariableCode.tsx b/packages/documentation/src/components/PackageSassDoc/VariableCode.tsx index 99d2143ac7..f8580c6cc3 100644 --- a/packages/documentation/src/components/PackageSassDoc/VariableCode.tsx +++ b/packages/documentation/src/components/PackageSassDoc/VariableCode.tsx @@ -1,7 +1,7 @@ import React, { ReactElement } from "react"; import { Switch, useChecked } from "@react-md/form"; -import { CodeBlock } from "components/Code"; +import CodeBlock from "components/CodeBlock"; import { FormattedVariableItem } from "utils/sassdoc"; export interface VariableCodeProps