Update color scheme and styling in CodeBlock & Collapsible components

The changes provide a more readable color scheme and enhances component appearance for the CodeBlock and Collapsible components within redux-devtools-inspector-monitor-trace-tab. The updated styling features a lighter background color, adjusted text color, and included new border specifications.
This commit is contained in:
Iliya Brook 2024-03-05 01:19:10 +02:00
parent a77d8edb07
commit e71d599cd0
2 changed files with 4 additions and 1 deletions

View File

@ -10,17 +10,19 @@ import React, { CSSProperties } from 'react';
const preStyle: CSSProperties = { const preStyle: CSSProperties = {
position: 'relative', position: 'relative',
display: 'block', display: 'block',
backgroundColor: '#000', backgroundColor: '#f7f7f7',
padding: '0.5em', padding: '0.5em',
marginTop: '0.5em', marginTop: '0.5em',
marginBottom: '0.5em', marginBottom: '0.5em',
overflowX: 'auto', overflowX: 'auto',
whiteSpace: 'pre-wrap', whiteSpace: 'pre-wrap',
borderRadius: '0.25rem', borderRadius: '0.25rem',
border: '1px solid #ddd',
}; };
const codeStyle = { const codeStyle = {
fontFamily: 'Consolas, Menlo, monospace', fontFamily: 'Consolas, Menlo, monospace',
color: '#333',
}; };
interface CodeBlockPropsType { interface CodeBlockPropsType {

View File

@ -19,6 +19,7 @@ const _collapsibleStyle: CSSProperties = {
fontSize: '1em', fontSize: '1em',
padding: '0px 5px', padding: '0px 5px',
lineHeight: '1.5', lineHeight: '1.5',
borderBottom: '1px solid #ddd',
}; };
const collapsibleCollapsedStyle: CSSProperties = { const collapsibleCollapsedStyle: CSSProperties = {