gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix: correct theme when viewing certifications challenges solutions

Browse Source
This commit is contained in:
Tomer Ben-Rachel
2021-10-06 12:05:52 +03:00
committed by GitHub
parent 78e28e2bd3
commit 4ffc06e014
1 changed files with 50 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

100
client/src/components/layouts/prism-night.css
View File

@ -5,8 +5,8 @@
* @author Rose Pritchard * @author Rose Pritchard
*/ */
.night code[class*='language-'], .dark-palette code[class*='language-'],
.night pre[class*='language-'] { .dark-palette pre[class*='language-'] {
color: var(--secondary-color); color: var(--secondary-color);
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
font-size: 1em; font-size: 1em;
@ -28,12 +28,12 @@
text-shadow: none; text-shadow: none;
} }
.night pre[class*='language-'] code[class*='language-'] { .dark-palette pre[class*='language-'] code[class*='language-'] {
color: var(--quaternary-color); color: var(--quaternary-color);
} }
/* Code blocks */ /* Code blocks */
.night pre[class*='language-'] { .dark-palette pre[class*='language-'] {
padding: 1em; padding: 1em;
margin: 0.5em 0; margin: 0.5em 0;
overflow: auto; overflow: auto;
@ -41,108 +41,108 @@
/* Without this, the above selector takes precedence and messes up the answer /* Without this, the above selector takes precedence and messes up the answer
padding in night mode */ padding in night mode */
.night .video-quiz-option > pre { .dark-palette .video-quiz-option > pre {
padding: 0; padding: 0;
margin: 0; margin: 0;
} }
.night :not(pre) > code[class*='language-'], .dark-palette :not(pre) > code[class*='language-'],
.night pre[class*='language-'] { .dark-palette pre[class*='language-'] {
background: var(--primary-background); background: var(--primary-background);
} }
.night pre[class*='language-']::selection, .dark-palette pre[class*='language-']::selection,
.night pre[class*='language-'] ::selection, .dark-palette pre[class*='language-'] ::selection,
.night code[class*='language-']::selection, .dark-palette code[class*='language-']::selection,
.night code[class*='language-'] ::selection { .dark-palette code[class*='language-'] ::selection {
background: var(--selection-color); background: var(--selection-color);
} }
/* Inline code */ /* Inline code */
.night :not(pre) > code[class*='language-'] { .dark-palette :not(pre) > code[class*='language-'] {
padding: 0.1em; padding: 0.1em;
border-radius: 0.3em; border-radius: 0.3em;
white-space: normal; white-space: normal;
} }
.night .token.comment, .dark-palette .token.comment,
.night .token.block-comment, .dark-palette .token.block-comment,
.night .token.prolog, .dark-palette .token.prolog,
.night .token.doctype, .dark-palette .token.doctype,
.night .token.cdata { .dark-palette .token.cdata {
color: #608b4e; color: #608b4e;
} }
.night .token.punctuation { .dark-palette .token.punctuation {
color: #ffff00; color: #ffff00;
} }
.night .token.tag, .dark-palette .token.tag,
.night .token.attr-name, .dark-palette .token.attr-name,
.night .token.namespace, .dark-palette .token.namespace,
.night .token.deleted { .dark-palette .token.deleted {
color: #e2777a; color: #e2777a;
} }
.night .token.function-name { .dark-palette .token.function-name {
color: #d4d4d4; color: #d4d4d4;
} }
.night .token.boolean, .dark-palette .token.boolean,
.night .token.number, .dark-palette .token.number,
.night .token.function { .dark-palette .token.function {
color: #569cd6; color: #569cd6;
} }
.night .token.property, .dark-palette .token.property,
.night .token.class-name, .dark-palette .token.class-name,
.night .token.constant, .dark-palette .token.constant,
.night .token.symbol { .dark-palette .token.symbol {
color: #f8c555; color: #f8c555;
} }
.night .token.selector, .dark-palette .token.selector,
.night .token.important, .dark-palette .token.important,
.night .token.atrule, .dark-palette .token.atrule,
.night .token.keyword, .dark-palette .token.keyword,
.night .token.builtin { .dark-palette .token.builtin {
color: #569cd6; color: #569cd6;
} }
.night .token.string, .dark-palette .token.string,
.night .token.char, .dark-palette .token.char,
.night .token.attr-value, .dark-palette .token.attr-value,
.night .token.regex, .dark-palette .token.regex,
.night .token.variable { .dark-palette .token.variable {
color: #7ec699; color: #7ec699;
} }
/* CSS code block strings have low contrast in night mode. This attempts to increase contrast above 4.5:1 */ /* CSS code block strings have low contrast in night mode. This attempts to increase contrast above 4.5:1 */
.night .language-css .token.string, .dark-palette .language-css .token.string,
.night .style .token.string { .dark-palette .style .token.string {
color: #ec9126; color: #ec9126;
background: hsl(0 0% 100% / 0.12); background: hsl(0 0% 100% / 0.12);
} }
.night .token.operator, .dark-palette .token.operator,
.night .token.entity, .dark-palette .token.entity,
.night .token.url { .dark-palette .token.url {
color: #67cdcc; color: #67cdcc;
background: none; background: none;
} }
.night .token.important, .dark-palette .token.important,
.night .token.bold { .dark-palette .token.bold {
font-weight: bold; font-weight: bold;
} }
.night .token.italic { .dark-palette .token.italic {
font-style: italic; font-style: italic;
} }
.night .token.entity { .dark-palette .token.entity {
cursor: help; cursor: help;
} }
.night .token.inserted { .dark-palette .token.inserted {
color: green; color: green;
} }