feat(client): make chapter problem editorial more visible (#587)

ia-toki · Feb 3, 2024 · 4bc943f · 4bc943f
1 parent 8677103
commit 4bc943f
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 5 deletions.
diff --git a/.../courses/single/chapters/single/problems/single/ChapterProblemPage/ChapterProblemPage.jsx b/.../courses/single/chapters/single/problems/single/ChapterProblemPage/ChapterProblemPage.jsx
@@ -102,7 +102,7 @@ export class ChapterProblemPage extends Component {
       newProgress?.verdict == VerdictCode.AC &&
       this.state.response.editorial
     ) {
-      const problemEditorialEl = document.querySelector('.problem-editorial');
+      const problemEditorialEl = document.querySelector('.chapter-problem-editorial');
       if (problemEditorialEl) {
         problemEditorialEl.scrollIntoView({ behavior: 'smooth' });
       }

diff --git a/...e/problems/single/Programming/ChapterProblemStatementPage/ChapterProblemStatementPage.jsx b/...e/problems/single/Programming/ChapterProblemStatementPage/ChapterProblemStatementPage.jsx
@@ -93,7 +93,7 @@ function ChapterProblemStatementPage({ worksheet }) {
     <ContentCard id="chapter-problem-statement" className="chapter-programming-problem-statement-page">
       {renderStatementHeader()}
       {renderStatement()}
-      <div className="chapter-programming-problem-statement-page__footer">{renderEditorial()}</div>
+      <div className="chapter-problem-editorial">{renderEditorial()}</div>
     </ContentCard>
   );
 }

diff --git a/.../problems/single/Programming/ChapterProblemStatementPage/ChapterProblemStatementPage.scss b/.../problems/single/Programming/ChapterProblemStatementPage/ChapterProblemStatementPage.scss
@@ -31,7 +31,7 @@
     margin-top: 0;
   }
 
-  .chapter-programming-problem-statement-page__footer {
+  .chapter-problem-editorial {
     max-width: 800px;
     margin-left: auto;
     margin-right: auto;
@@ -42,9 +42,12 @@
     }
 
     .problem-editorial {
-      border: 2px solid #238551;
-      border-radius: 4px;
+      background-color: #72ca9b;
       box-shadow: none;
+
+      .bp5-dark & {
+        background-color: #1c6e42;
+      }
     }
   }
   .chapter-programming-problem-statement-page__navigation {