feat(client,server): support .highlight class in problem statement (#618

)
ia-toki · Mar 28, 2024 · 256b759 · 256b759
1 parent 0095ae2
commit 256b759
Show file tree

Hide file tree

Showing 6 changed files with 23 additions and 20 deletions.
diff --git a/.../src/main/resources/assets/css/main-2.css → .../src/main/resources/assets/css/main-3.css b/.../src/main/resources/assets/css/main-2.css → .../src/main/resources/assets/css/main-3.css
@@ -314,6 +314,14 @@ input[type="text"], input[type="password"], textarea {
   font-weight: normal;
 }
 
+.content-text .highlight {
+  background-color: #fbd065;
+  margin: -10px;
+  margin-bottom: 15px;
+  padding: 15px;
+  padding-bottom: 10px;
+}
+
 .content-text embed {
   width: 100%;
   min-height: 800px;

diff --git a/...ckends/judgels-server-app/src/main/resources/judgels/michael/template/base/baseLayout.ftl b/...ckends/judgels-server-app/src/main/resources/judgels/michael/template/base/baseLayout.ftl
@@ -9,7 +9,7 @@
       <link rel="stylesheet" href="/webjars/open-sans/css/open-sans.min.css">
       <link rel="stylesheet" href="/webjars/roboto-fontface/css/roboto/roboto-fontface.css">
       <link rel="stylesheet" href="/webjars/bootstrap/css/bootstrap.min.css">
-      <link rel="stylesheet" href="/assets/css/main-2.css">
+      <link rel="stylesheet" href="/assets/css/main-3.css">
       <link rel="shortcut icon" type="image/ico" href="/assets/images/favicon.ico">
       <script src="/webjars/jquery/jquery.min.js"></script>
       <script src="/webjars/bootstrap/js/bootstrap.min.js"></script>

diff --git a/judgels-client/src/components/HtmlText/HtmlText.scss b/judgels-client/src/components/HtmlText/HtmlText.scss
@@ -76,6 +76,19 @@
       font-weight: normal;
     }
   }
+
+  .highlight {
+    background-color: #fbd065;
+    margin: -20px;
+    margin-bottom: 15px;
+    padding: 20px;
+    padding-bottom: 10px;
+    border-radius: 3px;
+
+    .bp5-dark & {
+      background-color: #5a701a;
+    }
+  }
 }
 
 small .html-text {

diff --git a/...components/ProblemWorksheetCard/Programming/ProblemEditorialCard/ProblemEditorialCard.jsx b/...components/ProblemWorksheetCard/Programming/ProblemEditorialCard/ProblemEditorialCard.jsx
@@ -3,7 +3,7 @@ import RichStatementText from '../../../RichStatementText/RichStatementText';
 
 export function ProblemEditorialCard({ alias, statement: { title }, editorial: { text }, showTitle = true }) {
   return (
-    <ContentCard className="problem-editorial">
+    <ContentCard>
       {showTitle && (
         <h2 className="programming-problem-statement__name">
           {alias ? `${alias}. ` : ''}

diff --git a/...ingle/Bundle/submissions/ChapterProblemSubmissionsPage/ChapterProblemSubmissionsPage.scss b/...ingle/Bundle/submissions/ChapterProblemSubmissionsPage/ChapterProblemSubmissionsPage.scss
@@ -9,15 +9,6 @@
       margin-top: 25px !important;
       margin-bottom: 25px !important;
     }
-
-    .problem-editorial {
-      background-color: #72ca9b;
-      box-shadow: none;
-
-      .bp5-dark & {
-        background-color: #1c6e42;
-      }
-    }
   }
 
   .chapter-problem-navigation {

diff --git a/.../problems/single/Programming/ChapterProblemStatementPage/ChapterProblemStatementPage.scss b/.../problems/single/Programming/ChapterProblemStatementPage/ChapterProblemStatementPage.scss
@@ -40,15 +40,6 @@
       margin-top: 25px !important;
       margin-bottom: 25px !important;
     }
-
-    .problem-editorial {
-      background-color: #72ca9b;
-      box-shadow: none;
-
-      .bp5-dark & {
-        background-color: #1c6e42;
-      }
-    }
   }
   .chapter-programming-problem-statement-page__navigation {
     text-align: right;