feat: visual distinction between instructions and code (#45354)
* Add border-left to description-container * Add description-container use primary-background * Jaw border to quaternary bg * Select editor line to highlight bg * Update client/src/templates/Challenges/classic/editor.tsx Co-authored-by: Ahmad Abdolsaheb <ahmad.abdolsaheb@gmail.com> Co-authored-by: Ahmad Abdolsaheb <ahmad.abdolsaheb@gmail.com>pull/45450/head
parent
adcce7fb6d
commit
6a7d2e5cbe
|
@ -41,7 +41,7 @@
|
|||
.description-container {
|
||||
background-color: var(--secondary-background);
|
||||
padding: 10px;
|
||||
border: 2px solid var(--tertiary-background);
|
||||
border: 2px solid var(--quaternary-background);
|
||||
max-width: 700px;
|
||||
}
|
||||
|
||||
|
|
|
@ -178,7 +178,8 @@ const defineMonacoThemes = (
|
|||
inherit: true,
|
||||
// TODO: Use actual color from style-guide
|
||||
colors: {
|
||||
'editor.background': options.usesMultifileEditor ? '#eee' : '#fff'
|
||||
'editor.background': options.usesMultifileEditor ? '#eee' : '#fff',
|
||||
'editor.lineHighlightBorder': '#cee8fc'
|
||||
},
|
||||
rules: [{ token: 'identifier.js', foreground: darkBlueColor }]
|
||||
});
|
||||
|
|
Loading…
Reference in New Issue