PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Merge pull request #6320 from SimonBrandner/feature/proper-codeblock-colors

Browse source
This commit is contained in:
Germain 2021-07-08 09:07:21 +01:00 committed by GitHub
commit bda83e8140
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 13 additions and 59 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
res/css/views/rooms/_EventTile.scss
View file

@ -477,8 +477,7 @@ $hover-select-border: 4px;
pre, code {
font-family: $monospace-font-family !important;
// deliberate constants as we're behind an invert filter
color: #333;
background-color: $header-panel-bg-color;
}
pre {
@ -488,11 +487,6 @@ $hover-select-border: 4px;
overflow-x: overlay;
overflow-y: visible;
}
code {
// deliberate constants as we're behind an invert filter
background-color: #f8f8f8;
}
}
.mx_EventTile_lineNumbers {

34
res/themes/dark/css/_dark.scss
View file

@ -119,8 +119,6 @@ $voipcall-plinth-color: #394049;
$theme-button-bg-color: #e3e8f0;
$dialpad-button-bg-color: #6F7882;
;
$roomlist-button-bg-color: rgba(141, 151, 165, 0.2); // Buttons include the filter box, explore button, and sublist buttons
$roomlist-filter-active-bg-color: $bg-color;
@ -274,24 +272,7 @@ $composer-shadow-color: rgba(0, 0, 0, 0.28);
}
// markdown overrides:
.mx_EventTile_content .markdown-body pre:hover {
border-color: #808080 !important; // inverted due to rules below
scrollbar-color: rgba(0, 0, 0, 0.2) transparent; // copied from light theme due to inversion below
// the code above works only in Firefox, this is for other browsers
// see https://developer.mozilla.org/en-US/docs/Web/CSS/scrollbar-color
&::-webkit-scrollbar-thumb {
background-color: rgba(0, 0, 0, 0.2); // copied from light theme due to inversion below
}
}
.mx_EventTile_content .markdown-body {
pre, code {
filter: invert(1);
}
pre code {
filter: none;
}
table {
tr {
background-color: #000000;
@ -301,18 +282,9 @@ $composer-shadow-color: rgba(0, 0, 0, 0.28);
background-color: #080808;
}
}
blockquote {
color: #919191;
}
}
// diff highlight colors
// intentionally swapped to avoid inversion
.hljs-addition {
background: #fdd;
}
.hljs-deletion {
background: #dfd;
// highlight.js overrides
.hljs-tag {
color: inherit; // Without this they'd be weirdly blue which doesn't match the theme
}

1
res/themes/dark/css/dark.scss
View file

@ -9,3 +9,4 @@
@import "_dark.scss";
@import "../../light/css/_mods.scss";
@import "../../../../res/css/_components.scss";
@import url("highlight.js/styles/atom-one-dark.css");

26
res/themes/legacy-dark/css/_legacy-dark.scss
View file

@ -118,7 +118,7 @@ $voipcall-plinth-color: #394049;
$theme-button-bg-color: #e3e8f0;
$dialpad-button-bg-color: #6F7882;
;
$roomlist-button-bg-color: #1A1D23; // Buttons include the filter box, explore button, and sublist buttons
$roomlist-filter-active-bg-color: $roomlist-button-bg-color;
@ -249,7 +249,7 @@ $composer-shadow-color: tranparent;
@define-mixin mx_DialogButton_secondary {
// flip colours for the secondary ones
font-weight: 600;
border: 1px solid $accent-color ! important;
border: 1px solid $accent-color !important;
color: $accent-color;
background-color: $button-secondary-bg-color;
}
@ -267,18 +267,7 @@ $composer-shadow-color: tranparent;
}
// markdown overrides:
.mx_EventTile_content .markdown-body pre:hover {
border-color: #808080 !important; // inverted due to rules below
}
.mx_EventTile_content .markdown-body {
pre, code {
filter: invert(1);
}
pre code {
filter: none;
}
table {
tr {
background-color: #000000;
@ -290,12 +279,7 @@ $composer-shadow-color: tranparent;
}
}
// diff highlight colors
// intentionally swapped to avoid inversion
.hljs-addition {
background: #fdd;
}
.hljs-deletion {
background: #dfd;
// highlight.js overrides:
.hljs-tag {
color: inherit; // Without this they'd be weirdly blue which doesn't match the theme
}

1
res/themes/legacy-dark/css/legacy-dark.scss
View file

@ -4,3 +4,4 @@
@import "../../legacy-light/css/_legacy-light.scss";
@import "_legacy-dark.scss";
@import "../../../../res/css/_components.scss";
@import url("highlight.js/styles/atom-one-dark.css");

1
res/themes/legacy-light/css/legacy-light.scss
View file

@ -3,3 +3,4 @@
@import "_fonts.scss";
@import "_legacy-light.scss";
@import "../../../../res/css/_components.scss";
@import url("highlight.js/styles/atom-one-light.css");

1
res/themes/light/css/light.scss
View file

@ -4,3 +4,4 @@
@import "_light.scss";
@import "_mods.scss";
@import "../../../../res/css/_components.scss";
@import url("highlight.js/styles/atom-one-light.css");