amirho/react.dev
1
0
Fork 0
mirror of https://github.com/reactjs/react.dev.git synced 2026-02-23 20:23:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: consoleBlock text & bg in dark mode (#3983)

Browse Source
This commit is contained in:
Shriram Balaji
2021-10-26 19:17:58 +05:30
committed by Dan Abramov
parent 20709b0190
commit 191fff7902
1 changed files with 8 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
beta/src/components/MDX/ConsoleBlock.tsx
View File

@@ -25,9 +25,7 @@ const Box = ({
className?: string;
customStyles?: Record<string, string>;
}) => (
<div
className={className}
style={{width, height, backgroundColor: '#C4C4C4', ...customStyles}}></div>
<div className={className} style={{width, height, ...customStyles}}></div>
);
Box.displayName = 'Box';
@@ -44,20 +42,18 @@ function ConsoleBlock({level = 'info', children}: ConsoleBlockProps) {
return (
<div className="mb-4" translate="no">
<div
className="flex w-full rounded-t-lg"
style={{backgroundColor: '#DADEE0'}}>
<div className="px-4 py-2" style={{borderRight: '1px solid #C4C4C4'}}>
<Box width="15px" />
<div className="flex w-full rounded-t-lg bg-gray-200 dark:bg-gray-80">
<div className="px-4 py-2 border-gray-300 dark:border-gray-90 border-r">
<Box className="bg-gray-300 dark:bg-gray-90" width="15px" />
</div>
<div className="flex text-sm px-4">
<div className="border-b-2" style={{borderColor: '#C4C4C4'}}>
<div className="border-b-2 border-gray-300 dark:border-gray-90">
Console
</div>
<div className="px-4 py-2 flex">
<Box className="mr-2" />
<Box className="mr-2 hidden md:block" />
<Box className="hidden md:block" />
<Box className="mr-2 bg-gray-300 dark:bg-gray-90" />
<Box className="mr-2 hidden md:block bg-gray-300 dark:bg-gray-90" />
<Box className="hidden md:block bg-gray-300 dark:bg-gray-90" />
</div>
</div>
</div>