no log: Replace raw html bold tag inside text with Mantine Text (#2639)

frontend/src/pages/Settings/Subtitles/index.tsx

@@ -1,5 +1,5 @@
-import { FunctionComponent } from "react";
-import { Code, Space, Table } from "@mantine/core";
+import React, { FunctionComponent } from "react";
+import { Code, Space, Table, Text as MantineText } from "@mantine/core";
 import {
   Check,
   CollapseBox,
@@ -115,14 +115,16 @@ const commandOptions: CommandOption[] = [
   },
 ];
 
-const commandOptionElements: JSX.Element[] = commandOptions.map((op, idx) => (
+const commandOptionElements: React.JSX.Element[] = commandOptions.map(
+  (op, idx) => (
     <tr key={idx}>
       <td>
         <Code>{op.option}</Code>
       </td>
       <td>{op.description}</td>
     </tr>
-));
+  ),
+);
 
 const SettingsSubtitlesView: FunctionComponent = () => {
   return (
@@ -436,8 +438,11 @@ const SettingsSubtitlesView: FunctionComponent = () => {
             <Slider settingKey="settings-subsync-subsync_threshold"></Slider>
             <Space />
             <Message>
-              Only series subtitles with scores <b>below</b> this value will be
-              automatically synchronized.
+              Only series subtitles with scores{" "}
+              <MantineText fw={700} span>
+                below
+              </MantineText>{" "}
+              this value will be automatically synchronized.
             </Message>
           </CollapseBox>
           <Check
@@ -451,8 +456,11 @@ const SettingsSubtitlesView: FunctionComponent = () => {
             <Slider settingKey="settings-subsync-subsync_movie_threshold"></Slider>
             <Space />
             <Message>
-              Only movie subtitles with scores <b>below</b> this value will be
-              automatically synchronized.
+              Only movie subtitles with scores{" "}
+              <MantineText fw={700} span>
+                below
+              </MantineText>{" "}
+              this value will be automatically synchronized.
             </Message>
           </CollapseBox>
         </CollapseBox>
@@ -478,8 +486,11 @@ const SettingsSubtitlesView: FunctionComponent = () => {
             <Slider settingKey="settings-general-postprocessing_threshold"></Slider>
             <Space />
             <Message>
-              Only series subtitles with scores <b>below</b> this value will be
-              automatically post-processed.
+              Only series subtitles with scores{" "}
+              <MantineText fw={700} span>
+                below
+              </MantineText>{" "}
+              this value will be automatically post-processed.
             </Message>
           </CollapseBox>
           <Check
@@ -493,8 +504,11 @@ const SettingsSubtitlesView: FunctionComponent = () => {
             <Slider settingKey="settings-general-postprocessing_threshold_movie"></Slider>
             <Space />
             <Message>
-              Only movie subtitles with scores <b>below</b> this value will be
-              automatically post-processed.
+              Only movie subtitles with scores{" "}
+              <MantineText fw={700} span>
+                below
+              </MantineText>{" "}
+              this value will be automatically post-processed.
             </Message>
           </CollapseBox>
           <Text