From a35b3e5ac94623bc4fd468a58f00bc173bb23790 Mon Sep 17 00:00:00 2001 From: Rob Snow Date: Wed, 5 Feb 2020 16:17:49 -0800 Subject: [PATCH] Had to remove 'unique' otherwise we miss colors added css for highlighting syntax added remark plugin to apply classes to code blocks --- .../theme-default/src/index.ts | 8 +- packages/dev/docs/package.json | 1 + packages/dev/docs/src/Layout.js | 8 +- packages/dev/docs/src/hljs.css | 89 +++++++++++++++++++ .../MDXTransformer.js | 9 +- .../parcel-transformer-mdx-docs/package.json | 3 +- yarn.lock | 25 +++++- 7 files changed, 130 insertions(+), 13 deletions(-) create mode 100644 packages/dev/docs/src/hljs.css diff --git a/packages/@react-spectrum/theme-default/src/index.ts b/packages/@react-spectrum/theme-default/src/index.ts index ac400aef15f..d15f30be069 100644 --- a/packages/@react-spectrum/theme-default/src/index.ts +++ b/packages/@react-spectrum/theme-default/src/index.ts @@ -1,8 +1,8 @@ -import dark from '@adobe/spectrum-css-temp/vars/spectrum-dark-unique.css'; +import dark from '@adobe/spectrum-css-temp/vars/spectrum-dark.css'; import global from '@adobe/spectrum-css-temp/vars/spectrum-global.css'; -import large from '@adobe/spectrum-css-temp/vars/spectrum-large-unique.css'; -import light from '@adobe/spectrum-css-temp/vars/spectrum-light-unique.css'; -import medium from '@adobe/spectrum-css-temp/vars/spectrum-medium-unique.css'; +import large from '@adobe/spectrum-css-temp/vars/spectrum-large.css'; +import light from '@adobe/spectrum-css-temp/vars/spectrum-light.css'; +import medium from '@adobe/spectrum-css-temp/vars/spectrum-medium.css'; import {Theme} from '@react-types/provider'; export let theme: Theme = { diff --git a/packages/dev/docs/package.json b/packages/dev/docs/package.json index cfe8d7696ba..44b6a77a2c1 100644 --- a/packages/dev/docs/package.json +++ b/packages/dev/docs/package.json @@ -7,6 +7,7 @@ "@adobe/spectrum-css-temp": "^3.0.0-alpha.1", "@react-spectrum/provider": "^3.0.0-rc.1", "@react-spectrum/theme-default": "^3.0.0-rc.1", + "classnames": "^2.2.6", "react": "^16.8.0" } } diff --git a/packages/dev/docs/src/Layout.js b/packages/dev/docs/src/Layout.js index 2d1903a7e78..80fc45d504b 100644 --- a/packages/dev/docs/src/Layout.js +++ b/packages/dev/docs/src/Layout.js @@ -1,4 +1,6 @@ +import classNames from 'classnames'; import docStyles from './docs.css'; +import highlightCss from './hljs.css'; import path from 'path'; import {Provider} from '@react-spectrum/provider'; import React from 'react'; @@ -14,7 +16,7 @@ export function Layout({scripts, styles, pages, children}) { {scripts.map(s => )} - +
-
{children}
+
+ {children} +
{scripts.map(s =>