diff --git a/client/styles/components/_console-feed.scss b/client/styles/components/_console-feed.scss index 174fd543..8bd0d4a6 100644 --- a/client/styles/components/_console-feed.scss +++ b/client/styles/components/_console-feed.scss @@ -17,7 +17,11 @@ $CONSOLE_FEED_LIGHT_STYLES: ( LOG_DEBUG_COLOR: '#0071AD', LOG_DEBUG_BACKGROUND: '#D6F1FF', LOG_DEBUG_BORDER: '#C2EBFF', - LOG_COLOR: '#4D4D4D' + LOG_COLOR: '#4D4D4D', + ARROW_COLOR: '#666', + OBJECT_VALUE_STRING_COLOR: '#D81B18', + OBJECT_VALUE_NULL_COLOR: '#666', + OBJECT_VALUE_UNDEFINED_COLOR: '#666', ); $CONSOLE_FEED_DARK_STYLES: ( @@ -47,21 +51,22 @@ $CONSOLE_FEED_DARK_STYLES: ( TABLE_TH_HOVER_COLOR: 'grey', TABLE_SORT_ICON_COLOR: 'grey', TABLE_DATA_BACKGROUND_IMAGE: 'grey', - TABLE_DATA_BACKGROUND_SIZE: 'grey' + TABLE_DATA_BACKGROUND_SIZE: 'grey', + ARROW_COLOR: '#D9D9D9' ); $CONSOLE_FEED_CONTRAST_STYLES: ( BASE_BACKGROUND_COLOR: '', BASE_COLOR: 'white', OBJECT_NAME_COLOR: 'white', - OBJECT_VALUE_NULL_COLOR: 'hsl(230, 100%, 80%)', - OBJECT_VALUE_UNDEFINED_COLOR: 'hsl(230, 100%, 80%)', - OBJECT_VALUE_REGEXP_COLOR: 'hsl(230, 100%, 80%)', - OBJECT_VALUE_STRING_COLOR: 'hsl(230, 100%, 80%)', - OBJECT_VALUE_SYMBOL_COLOR: 'hsl(230, 100%, 80%)', - OBJECT_VALUE_NUMBER_COLOR: 'hsl(230, 100%, 80%)', - OBJECT_VALUE_BOOLEAN_COLOR: 'hsl(230, 100%, 80%)', - OBJECT_VALUE_FUNCTION_KEYWORD_COLOR: 'hsl(230, 100%, 80%)', + OBJECT_VALUE_NULL_COLOR: '#B3BEFF', + OBJECT_VALUE_UNDEFINED_COLOR: '#B3BEFF', + OBJECT_VALUE_REGEXP_COLOR: '#B3BEFF', + OBJECT_VALUE_STRING_COLOR: '#B3BEFF', + OBJECT_VALUE_SYMBOL_COLOR: '#B3BEFF', + OBJECT_VALUE_NUMBER_COLOR: '#B3BEFF', + OBJECT_VALUE_BOOLEAN_COLOR: '#B3BEFF', + OBJECT_VALUE_FUNCTION_KEYWORD_COLOR: '#B3BEFF', LOG_ERROR_BACKGROUND: '#1F0000', LOG_ERROR_COLOR: '#EA7B7D', LOG_WARN_BACKGROUND: 'hsl(50, 100%, 10%)', @@ -77,5 +82,6 @@ $CONSOLE_FEED_CONTRAST_STYLES: ( TABLE_TH_HOVER_COLOR: 'grey', TABLE_SORT_ICON_COLOR: 'grey', TABLE_DATA_BACKGROUND_IMAGE: 'grey', - TABLE_DATA_BACKGROUND_SIZE: 'grey' + TABLE_DATA_BACKGROUND_SIZE: 'grey', + ARROW_COLOR: '#D9D9D9' ); \ No newline at end of file diff --git a/client/styles/components/_editor.scss b/client/styles/components/_editor.scss index b5b13c6e..db8c1764 100644 --- a/client/styles/components/_editor.scss +++ b/client/styles/components/_editor.scss @@ -52,7 +52,7 @@ pre.CodeMirror-line { } .CodeMirror-gutter-elt:not(.CodeMirror-linenumber) { - opacity: 0.3; + opacity: 0.2; width: #{49 / $base-font-size}rem !important; height: 100%; left: 49px !important; diff --git a/client/styles/components/_p5-contrast-codemirror-theme.scss b/client/styles/components/_p5-contrast-codemirror-theme.scss index 4e75bec6..0ec609b8 100644 --- a/client/styles/components/_p5-contrast-codemirror-theme.scss +++ b/client/styles/components/_p5-contrast-codemirror-theme.scss @@ -84,12 +84,12 @@ $p5-contrast-activeline: #999999; } .cm-s-p5-contrast .CodeMirror-activeline-background { - background-color: #404040; + background-color: $dark; } .cm-s-p5-contrast .CodeMirror-activeline-gutter { - background-color: #454545; - border-right: 1px solid #949494; + background-color: $dark; + border-right: 1px solid $middle-dark; } .cm-s-p5-contrast .cm-error { diff --git a/client/styles/components/_p5-dark-codemirror-theme.scss b/client/styles/components/_p5-dark-codemirror-theme.scss index d9091bf8..955cc5e1 100644 --- a/client/styles/components/_p5-dark-codemirror-theme.scss +++ b/client/styles/components/_p5-dark-codemirror-theme.scss @@ -89,12 +89,12 @@ $p5-dark-error: #df3a3d; } .cm-s-p5-dark .CodeMirror-activeline-background { - background-color: #404040; + background-color: $dark; } .cm-s-p5-dark .CodeMirror-activeline-gutter { - background-color: #454545; - border-right: 1px solid #949494; + background-color: $dark; + border-right: 1px solid $middle-dark; } .cm-s-p5-dark span.CodeMirror-matchingbracket { diff --git a/client/styles/components/_p5-light-codemirror-theme.scss b/client/styles/components/_p5-light-codemirror-theme.scss index 1c7b23b4..90a0509d 100644 --- a/client/styles/components/_p5-light-codemirror-theme.scss +++ b/client/styles/components/_p5-light-codemirror-theme.scss @@ -13,12 +13,12 @@ $p5-light-lightbrown: #7a5a3a; $p5-light-brown: #704F21; $p5-light-black: #333333; -$p5-light-pink: #be3652; +$p5-light-pink: #CA445F; $p5-light-gray: #666; $p5-light-lightblue: #007bbb; $p5-light-darkblue: #306bb4; $p5-light-white: #FDFDFD; -$p5-light-orange: #EE9900; +$p5-light-orange: #9E6700; $p5-light-lightgray: #E0D7D1; $p5-light-darkgray: #666666; $p5-light-green: #008007; @@ -86,11 +86,12 @@ $p5-light-activeline: rgb(207, 207, 207); } .cm-s-p5-light .CodeMirror-activeline-background { - background-color: #F3F3F3; + background-color: $light; } .cm-s-p5-light .CodeMirror-activeline-gutter { - background-color: #ECECEC; + background-color: $light; + border-right: 1px solid $medium-light; } .cm-s-p5-light .cm-error {