From dd5d55ed78a736da6bdb3eb8c76c9391808c9f63 Mon Sep 17 00:00:00 2001 From: overdodactyl Date: Sat, 14 Apr 2018 20:13:37 -0600 Subject: [PATCH] variables for code mirror --- css/common-files/color_variables.css | 14 ++- .../webextension-tweaks/generic_style.css | 86 ++++++++----------- 2 files changed, 49 insertions(+), 51 deletions(-) diff --git a/css/common-files/color_variables.css b/css/common-files/color_variables.css index 0f09f6f..14fa6ec 100644 --- a/css/common-files/color_variables.css +++ b/css/common-files/color_variables.css @@ -60,7 +60,7 @@ --theme-highlight-bluegrey: #5e88b0; --theme-highlight-lightorange: #d99b28; --theme-highlight-orange: #d96629; - --theme-highlight-pink: #FF7DE9; + --theme-highlight-pink: #df80ff; --tone-1: var(--grey-10); --tone-2: var(--grey-20); --tone-3: var(--grey-30); @@ -113,7 +113,17 @@ --in-content-dark-header-background: var(--tone-9)!important; --secure-connection-color: var(--accent-1); --theme-sidebar-background: #1B1B1D!important; + --cm-background: var(--tone-8)!important; + --cm-selection: #353b48!important; + --cm-marker: #555 !important; + --cm-linenumber:#58575c!important; + --cm-cursor:#fff!important; + --cm-active-line-background: rgba(185,215,253,.15)!important; + --cm-matching-bracket: rgba(255,255,255,.25) !important; + --cm-search-background: rgba(24,29,32,1) !important; + --cm-red: #de7474!important; --start-indicator-for-updater-scripts: black; --end-indicator-for-updater-scripts: black; --dummy-variable-for-updater-scripys: black -} \ No newline at end of file + +} diff --git a/css/userContent-files/webextension-tweaks/generic_style.css b/css/userContent-files/webextension-tweaks/generic_style.css index b375169..8e4f372 100644 --- a/css/userContent-files/webextension-tweaks/generic_style.css +++ b/css/userContent-files/webextension-tweaks/generic_style.css @@ -118,42 +118,38 @@ url-prefix("moz-extension://ublock_origin_UUID/"), url-prefix("moz-extension://umatrix_UUID/") { .CodeMirror { - border: 1px solid #2a2a2c!important; - background: var(--tone-8)!important; + border: 1px solid !important; + border-color: var(--cm-background)!important; + background: var(--cm-background)!important; color: #b1b1b3!important; font-size: 11px!important; line-height: 14px!important } - div.CodeMirror-selected { - background: #353b48!important - } + div.CodeMirror-selected, .CodeMirror-line > span > span::selection, .CodeMirror-line > span::selection, .CodeMirror-line::selection { - background: #353b48!important - } - .CodeMirror-line > span > span::-moz-selection, - .CodeMirror-line > span::-moz-selection, - .CodeMirror-line::-moz-selection { - background: #353b48!important + background: var(--cm-selection)!important } .CodeMirror-gutters { background: var(--theme-sidebar-background)!important; - border-right: 0 solid #4a4a4f!important + border-right: 0 solid var(--in-content-border-color)!important } .CodeMirror-guttermarker, .CodeMirror-guttermarker-subtle { - color: #555!important + color: var(--cm-marker)!important } .CodeMirror-linenumber { padding: 0 8px 0 5px!important; - color: #58575c!important + color: var(--cm-linenumber)!important } .CodeMirror-cursor { border-left: 1px solid!important; - border-color: #fff!important + border-color: var(--cm-cursor)!important } - span.cm-comment { + span.cm-comment, + span.cm-hr, + span.cm-meta { color: #939393!important } span.cm-atom, @@ -162,70 +158,62 @@ span.cm-error, span.cm-keyword, span.cm-quote { - color: #ff7de9!important + color: var(--theme-highlight-red)!important } span.cm-number, span.cm-string, span.cm-string-2 { color: #6b89ff!important } - span.cm-hr, - span.cm-meta { - color: #939393!important - } span.cm-header, span.cm-qualifier, - span.cm-variable-2 { - color: #75bfff!important - } - span.cm-property { - color: #86de74!important - } + span.cm-variable-2, span.cm-bracket, span.cm-def, span.cm-link:visited, span.cm-tag { - color: #75bfff!important + color: var(--theme-highlight-blue)!important + } + span.cm-property { + color: var(--theme-highlight-green)!important } span.cm-variable { - color: #b98eff!important + color: var(--theme-highlight-purple)!important } - span.cm-variable-3 { - color: #d7d7db!important + span.cm-variable-3, + span.cm-special { + color: var(--in-content-text-color)!important } span.cm-link { - color: #737373!important + color: var(--in-content-box-border-color)!important } span.cm-operator { - color: #b1b1b3!important - } - span.cm-special { - color: #d7d7db!important + color: var(--in-content-page-color)!important } .CodeMirror-activeline-background { - background: rgba(185,215,253,.15)!important + background: var(--cm-active-line-background)!important } .CodeMirror-matchingbracket { - outline: rgba(255,255,255,.25) solid 1px!important; - color: #fff!important + outline: var(--cm-matching-bracket) solid 1px!important; + color: var(--cm-cursor)!important } .CodeMirror-merge-l-chunk { - background: var(--tone-7)!important + background: var(--in-content-page-background)!important } .cm-search-widget { background-color: var(--theme-sidebar-background)!important; border: 1px solid; border-bottom: none!important; - border-color: #2a2a2c!important; + border-color: var(--in-content-category-header-background)!important; max-height: 15px!important; justify-content: right!important } .cm-search-widget input { -moz-appearance: none!important; - background-color: rgba(24,29,32,1)!important; + background-color: var(--cm-search-background)!important; border: 1px solid!important; - border-color: var(--tone-7)!important; - color: var(--tone-4)!important; + border-color: var(--in-content-table-border-dark-color)!important; + color: var(--in-content-page-color)!important; border-radius: 8px!important; padding-left: 8px!important } @@ -233,29 +221,29 @@ background-color: var(--warning-background-color)!important } .cm-staticOpt { - background-color: var(--tone-6)!important; + background-color: var(--in-content-box-background)!important; font-weight: 700 } .CodeMirror-merge-gap { - background-color: var(--theme-sidebar-background)!important; + background-color: var(--in-content-category-header-background)!important; border-top: 1px solid!important; border-bottom: 1px solid!important; border-right: none!important; border-left: none!important; - border-color: #2a2a2c!important + border-color: var(--cm-background)!important } .CodeMirror-merge { border: none!important } .cm-search-widget span.fa { - color: var(--tone-6)!important; + color: var(--in-content-border-color)!important; font-size: 100%!important } .cm-staticext { color: var(--theme-highlight-blue)!important } .cm-staticnetBlock { - color: #de7474!important + color: var(--cm-red)!important } .cm-staticnetAllow { color: var(--theme-highlight-green)!important