@@ -7,11 +7,6 @@ import { bindActionCreators } from 'redux';
77import { useSelector , useDispatch } from 'react-redux' ;
88import classNames from 'classnames' ;
99import { Console as ConsoleFeed } from 'console-feed' ;
10- import {
11- CONSOLE_FEED_LIGHT_STYLES ,
12- CONSOLE_FEED_DARK_STYLES ,
13- CONSOLE_FEED_CONTRAST_STYLES
14- } from '../../../styles/components/_console-feed.scss' ;
1510import warnLightUrl from '../../../images/console-warn-light.svg?byUrl' ;
1611import warnDarkUrl from '../../../images/console-warn-dark.svg?byUrl' ;
1712import warnContrastUrl from '../../../images/console-warn-contrast.svg?byUrl' ;
@@ -42,6 +37,114 @@ import { useDidUpdate } from '../hooks/custom-hooks';
4237import useHandleMessageEvent from '../hooks/useHandleMessageEvent' ;
4338import { listen } from '../../../utils/dispatcher' ;
4439
40+ const CONSOLE_FEED_WITHOUT_ICONS = {
41+ LOG_WARN_ICON : 'none' ,
42+ LOG_ERROR_ICON : 'none' ,
43+ LOG_DEBUG_ICON : 'none' ,
44+ LOG_INFO_ICON : 'none'
45+ } ;
46+
47+ const CONSOLE_FEED_LIGHT_STYLES = {
48+ BASE_BACKGROUND_COLOR : '' ,
49+ LOG_ERROR_BACKGROUND : 'hsl(0, 100%, 97%)' ,
50+ LOG_ERROR_COLOR : '#D11518' ,
51+ LOG_ERROR_BORDER : 'hsl(0, 100%, 92%)' ,
52+ LOG_WARN_BACKGROUND : 'hsl(50, 100%, 95%)' ,
53+ LOG_WARN_COLOR : '#996B00' ,
54+ LOG_WARN_BORDER : 'hsl(50, 100%, 88%)' ,
55+ LOG_INFO_COLOR : '#4D4D4D' ,
56+ LOG_DEBUG_COLOR : '#0071AD' ,
57+ LOG_DEBUG_BACKGROUND : '#D6F1FF' ,
58+ LOG_DEBUG_BORDER : '#C2EBFF' ,
59+ LOG_COLOR : '#4D4D4D' ,
60+ ARROW_COLOR : '#666' ,
61+ OBJECT_NAME_COLOR : '#333' ,
62+ OBJECT_VALUE_NULL_COLOR : '#747474' ,
63+ OBJECT_VALUE_UNDEFINED_COLOR : '#747474' ,
64+ OBJECT_VALUE_STRING_COLOR : '#47820A' ,
65+ OBJECT_VALUE_REGEXP_COLOR : '#A06801' ,
66+ OBJECT_VALUE_NUMBER_COLOR : '#333' ,
67+ OBJECT_VALUE_BOOLEAN_COLOR : '#D52889' ,
68+ OBJECT_VALUE_FUNCTION_KEYWORD_COLOR : '#0B7CA9' ,
69+ LOG_AMOUNT_BACKGROUND : '#5276B7' ,
70+ LOG_AMOUNT_COLOR : '#FFF' ,
71+ LOG_WARN_AMOUNT_BACKGROUND : '#996B00' ,
72+ LOG_ERROR_AMOUNT_BACKGROUND : '#D11518' ,
73+ LOG_DEBUG_AMOUNT_BACKGROUND : '#0071AD'
74+ } ;
75+
76+ const CONSOLE_FEED_DARK_STYLES = {
77+ BASE_BACKGROUND_COLOR : '' ,
78+ BASE_COLOR : 'white' ,
79+ OBJECT_NAME_COLOR : 'white' ,
80+ OBJECT_VALUE_NULL_COLOR : '#DE4A9B' ,
81+ OBJECT_VALUE_UNDEFINED_COLOR : '#DE4A9B' ,
82+ OBJECT_VALUE_REGEXP_COLOR : '#EE9900' ,
83+ OBJECT_VALUE_STRING_COLOR : '#58a10b' ,
84+ OBJECT_VALUE_SYMBOL_COLOR : 'hsl(230, 100%, 80%)' ,
85+ OBJECT_VALUE_NUMBER_COLOR : 'white' ,
86+ OBJECT_VALUE_BOOLEAN_COLOR : '#DE4A9B' ,
87+ OBJECT_VALUE_FUNCTION_KEYWORD_COLOR : '#b58318' ,
88+ LOG_ERROR_BACKGROUND : '#1F0000' ,
89+ LOG_ERROR_COLOR : '#DF3A3D' ,
90+ LOG_WARN_BACKGROUND : 'hsl(50, 100%, 10%)' ,
91+ LOG_WARN_COLOR : '#F5BC38' ,
92+ LOG_INFO_COLOR : '#D9D9D9' ,
93+ LOG_INFO_BORDER : '#4D4D4D' ,
94+ LOG_COLOR : '#D9D9D9' ,
95+ LOG_DEBUG_COLOR : '#0C99E2' ,
96+ LOG_DEBUG_BACKGROUND : '#05232E' ,
97+ LOG_DEBUG_BORDER : '#0C546E' ,
98+ TABLE_BORDER_COLOR : 'grey' ,
99+ TABLE_TH_BACKGROUND_COLOR : 'transparent' ,
100+ TABLE_TH_HOVER_COLOR : 'grey' ,
101+ TABLE_SORT_ICON_COLOR : 'grey' ,
102+ TABLE_DATA_BACKGROUND_IMAGE : 'grey' ,
103+ TABLE_DATA_BACKGROUND_SIZE : 'grey' ,
104+ ARROW_COLOR : '#D9D9D9' ,
105+ LOG_AMOUNT_BACKGROUND : '#5276B7' ,
106+ LOG_AMOUNT_COLOR : '#333' ,
107+ LOG_WARN_AMOUNT_BACKGROUND : '#996B00' ,
108+ LOG_ERROR_AMOUNT_BACKGROUND : '#D11518' ,
109+ LOG_DEBUG_AMOUNT_BACKGROUND : '#0071AD'
110+ } ;
111+
112+ const CONSOLE_FEED_CONTRAST_STYLES = {
113+ BASE_BACKGROUND_COLOR : '' ,
114+ BASE_COLOR : 'white' ,
115+ OBJECT_NAME_COLOR : 'white' ,
116+ OBJECT_VALUE_NULL_COLOR : '#FFA9D9' ,
117+ OBJECT_VALUE_UNDEFINED_COLOR : '#FFA9D9' ,
118+ OBJECT_VALUE_REGEXP_COLOR : '#2DE9B6' ,
119+ OBJECT_VALUE_STRING_COLOR : '#2DE9B6' ,
120+ OBJECT_VALUE_SYMBOL_COLOR : '#B3BEFF' ,
121+ OBJECT_VALUE_NUMBER_COLOR : '#FFA9D9' ,
122+ OBJECT_VALUE_BOOLEAN_COLOR : '#FFA9D9' ,
123+ OBJECT_VALUE_FUNCTION_KEYWORD_COLOR : '#F5DC23' ,
124+ LOG_ERROR_BACKGROUND : '#1F0000' ,
125+ LOG_ERROR_COLOR : '#EA7B7D' ,
126+ LOG_WARN_BACKGROUND : 'hsl(50, 100%, 10%)' ,
127+ LOG_WARN_COLOR : '#F5BC38' ,
128+ LOG_INFO_COLOR : '#D9D9D9' ,
129+ LOG_INFO_BORDER : '#4D4D4D' ,
130+ LOG_COLOR : '#D9D9D9' ,
131+ LOG_DEBUG_COLOR : '#38B6F5' ,
132+ LOG_DEBUG_BACKGROUND : '#05232E' ,
133+ LOG_DEBUG_BORDER : '#0C546E' ,
134+ TABLE_BORDER_COLOR : 'grey' ,
135+ TABLE_TH_BACKGROUND_COLOR : 'transparent' ,
136+ TABLE_TH_HOVER_COLOR : 'grey' ,
137+ TABLE_SORT_ICON_COLOR : 'grey' ,
138+ TABLE_DATA_BACKGROUND_IMAGE : 'grey' ,
139+ TABLE_DATA_BACKGROUND_SIZE : 'grey' ,
140+ ARROW_COLOR : '#D9D9D9' ,
141+ LOG_AMOUNT_BACKGROUND : '#5276B7' ,
142+ LOG_AMOUNT_COLOR : '#333' ,
143+ LOG_WARN_AMOUNT_BACKGROUND : '#966C08' ,
144+ LOG_ERROR_AMOUNT_BACKGROUND : '#DD3134' ,
145+ LOG_DEBUG_AMOUNT_BACKGROUND : '#097BB3'
146+ } ;
147+
45148const getConsoleFeedStyle = ( theme , fontSize ) => {
46149 const style = {
47150 BASE_FONT_FAMILY : 'Inconsolata, monospace'
0 commit comments