r/p5.js-web-editor
1
0
Fork 0
Code Issues 1 Pull requests Releases 1 Wiki Activity

Merge pull request #1380 from elit-altum/updating-high-contrast-theme

Browse source 
fix(high-contrast-theme): fixed failing WCAG AAA checks
This commit is contained in:
Cassie Tarakajian 2020-04-10 17:45:22 -04:00 committed by GitHub
commit 4cb48399db
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 20 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
client/styles/abstracts/_variables.scss
View file

@ -186,7 +186,7 @@ $themes: (
modal-button-color: #333,
heading-text-color: #e1e1e1,
secondary-text-color: #e1e1e1,
inactive-text-color: #c1c1c1,
inactive-text-color: #f2f2f2,
background-color: #333,
button-background-color: $white,
button-color: $black,
@ -201,14 +201,14 @@ $themes: (
modal-background-color: #444,
modal-button-background-color: #C1C1C1,
modal-border-color: #949494,
icon-color: #a9a9a9,
icon-color: #d9d9d9,
icon-hover-color: $yellow,
icon-toast-hover-color: $yellow,
shadow-color: rgba(0, 0, 0, 0.16),
console-background-color: #4f4f4f,
console-color: $black,
console-header-background-color: #3f3f3f,
console-header-color: #b5b5b5,
console-header-color: #d9d9d9,
console-info-background-color: $lightsteelblue,
console-warn-background-color: $orange,
console-debug-background-color: $dodgerblue,

34
client/styles/components/_p5-contrast-codemirror-theme.scss
View file

@ -31,47 +31,47 @@ $p5-contrast-activeline: #999999;
color: $p5-contrast-white;
}
.cm-s-p5-contrast .cm-comment {
.cm-s-p5-contrast span .cm-comment {
color: $p5-contrast-lightgray;
}
.cm-s-p5-contrast .cm-def {
.cm-s-p5-contrast span .cm-def {
color: $p5-contrast-blue;
}
.cm-s-p5-contrast .cm-string {
.cm-s-p5-contrast span .cm-string {
color: $p5-contrast-green;
}
.cm-s-p5-contrast .cm-string-2 {
.cm-s-p5-contrast span .cm-string-2 {
color: $p5-contrast-green;
}
.cm-s-p5-contrast .cm-number {
.cm-s-p5-contrast span .cm-number {
color: $p5-contrast-pink;
}
.cm-s-p5-contrast .cm-keyword {
.cm-s-p5-contrast span .cm-keyword {
color: $p5-contrast-yellow;
}
.cm-s-p5-contrast .cm-variable {
.cm-s-p5-contrast span .cm-variable {
color: $p5-contrast-white;
}
.cm-s-p5-contrast .cm-variable-2 {
.cm-s-p5-contrast span .cm-variable-2 {
color: $p5-contrast-white;
}
.cm-s-p5-contrast .cm-property {
.cm-s-p5-contrast span .cm-property {
color: $p5-contrast-white;
}
.cm-s-p5-contrast .cm-atom {
.cm-s-p5-contrast span .cm-atom {
color: $p5-contrast-pink;
}
.cm-s-p5-contrast .cm-operator {
.cm-s-p5-contrast span .cm-operator {
color: $p5-contrast-lightgray;
}
@ -79,7 +79,7 @@ $p5-contrast-activeline: #999999;
color: $p5-contrast-number;
}
.cm-s-p5-contrast .CodeMirror-selected {
.cm-s-p5-contrast div .CodeMirror-selected {
background-color: $p5-contrast-selected;
}
@ -96,25 +96,25 @@ $p5-contrast-activeline: #999999;
color: #f00;
}
.cm-s-p5-contrast .CodeMirror-matchingbracket {
.cm-s-p5-contrast span .CodeMirror-matchingbracket {
outline: 1px solid $p5-contrast-lightgray;
outline-offset: 1px;
color: $p5-contrast-white !important;
}
.cm-s-p5-contrast .cm-qualifier {
.cm-s-p5-contrast span .cm-qualifier {
color: $p5-contrast-yellow;
}
.cm-s-p5-contrast .cm-tag {
.cm-s-p5-contrast span .cm-tag {
color: $p5-contrast-orange;
}
.cm-s-p5-contrast .cm-builtin {
.cm-s-p5-contrast span .cm-builtin {
color: $p5-contrast-yellow;
}
.cm-s-p5-contrast .cm-attribute {
.cm-s-p5-contrast span .cm-attribute {
color: $p5-contrast-white;
}