diff --git a/src/common.js b/src/common.js index a2f0ebe..00a5c27 100644 --- a/src/common.js +++ b/src/common.js @@ -139,6 +139,7 @@ function showTransbox({ contextMenuType, tranboxSetting = DEFAULT_TRANBOX_SETTING, transApis, + darkMode, }) { if (!tranboxSetting?.transOpen) { return; @@ -153,6 +154,8 @@ function showTransbox({ const shadowContainer = $tranbox.attachShadow({ mode: "closed" }); const emotionRoot = document.createElement("style"); const shadowRootElement = document.createElement("div"); + shadowRootElement.classList.add(`KT-transbox`); + shadowRootElement.classList.add(`KT-transbox_${darkMode ? "dark" : "light"}`); shadowContainer.appendChild(emotionRoot); shadowContainer.appendChild(shadowRootElement); const cache = createCache({ diff --git a/src/config/i18n.js b/src/config/i18n.js index 5c435fa..66119d0 100644 --- a/src/config/i18n.js +++ b/src/config/i18n.js @@ -847,4 +847,8 @@ export const I18N = { zh: `选中触发`, en: `Select Trigger`, }, + extend_styles: { + zh: `附加样式`, + en: `Extend Styles`, + }, }; diff --git a/src/config/index.js b/src/config/index.js index 51a8230..76d03c6 100644 --- a/src/config/index.js +++ b/src/config/index.js @@ -433,6 +433,7 @@ export const DEFAULT_TRANBOX_SETTING = { hideClickAway: false, // 是否点击外部关闭弹窗 simpleStyle: false, // 是否简洁界面 triggerMode: OPT_TRANBOX_TRIGGER_CLICK, // 触发翻译方式 + extStyles: "", // 附加样式 }; // 订阅列表 diff --git a/src/hooks/Theme.js b/src/hooks/Theme.js index 4346243..4f01bd9 100644 --- a/src/hooks/Theme.js +++ b/src/hooks/Theme.js @@ -1,6 +1,6 @@ import { useMemo } from "react"; import { ThemeProvider, createTheme } from "@mui/material/styles"; -import CssBaseline from "@mui/material/CssBaseline"; +import { CssBaseline, GlobalStyles } from "@mui/material"; import { useDarkMode } from "./ColorMode"; import { THEME_DARK, THEME_LIGHT } from "../config"; @@ -9,7 +9,7 @@ import { THEME_DARK, THEME_LIGHT } from "../config"; * @param {*} param0 * @returns */ -export default function Theme({ children, options }) { +export default function Theme({ children, options, styles }) { const { darkMode } = useDarkMode(); const theme = useMemo(() => { let htmlFontSize = 16; @@ -38,6 +38,7 @@ export default function Theme({ children, options }) { {/* CssBaseline kickstart an elegant, consistent, and simple baseline to build upon. */} + {children} ); diff --git a/src/views/Options/Setting.js b/src/views/Options/Setting.js index 5bef984..977d4cd 100644 --- a/src/views/Options/Setting.js +++ b/src/views/Options/Setting.js @@ -278,6 +278,7 @@ export default function Settings() { name="blacklist" defaultValue={blacklist} onChange={handleChange} + maxRows={10} multiline /> diff --git a/src/views/Options/Tranbox.js b/src/views/Options/Tranbox.js index b3822d7..dacdf0d 100644 --- a/src/views/Options/Tranbox.js +++ b/src/views/Options/Tranbox.js @@ -59,6 +59,7 @@ export default function Tranbox() { hideClickAway = false, simpleStyle = false, triggerMode = OPT_TRANBOX_TRIGGER_CLICK, + extStyles = "", } = tranboxSetting; return ( @@ -208,6 +209,16 @@ export default function Tranbox() { ))} + + {!isExt && ( + {dictResult.src} diff --git a/src/views/Selection/DictContV2.js b/src/views/Selection/DictContV2.js deleted file mode 100644 index 67ff005..0000000 --- a/src/views/Selection/DictContV2.js +++ /dev/null @@ -1,65 +0,0 @@ -import Box from "@mui/material/Box"; -import Chip from "@mui/material/Chip"; -import Stack from "@mui/material/Stack"; -import FavBtn from "./FavBtn"; -import Typography from "@mui/material/Typography"; - -const exchangeMap = { - word_third: "第三人称单数", - word_ing: "现在分词", - word_done: "过去式", - word_past: "过去分词", - word_pl: "复数", - word_proto: "词源", -}; - -export default function DictCont({ dictResult }) { - if (!dictResult) { - return; - } - - return ( - - - - {dictResult.simple_means?.word_name} - - - - - {dictResult.simple_means?.symbols?.map(({ ph_en, ph_am, parts }, idx) => ( - - {(ph_en || ph_am) && ( - {`英 /${ph_en || ""}/ 美 /${ph_am || ""}/`} - )} -
    - {parts.map(({ part, means }, idx) => ( -
  • - {part ? `[${part}] ${means.join("; ")}` : means.join("; ")} -
    • - ))} -
- - ))} - - - {Object.entries(dictResult.simple_means?.exchange || {}) - .map(([key, val]) => `${exchangeMap[key] || key}: ${val.join(", ")}`) - .join("; ")} - - - - {Object.values(dictResult.simple_means?.tags || {}) - .flat() - .filter((item) => item) - .map((item) => ( - - ))} - - - ); -} diff --git a/src/views/Selection/DraggableResizable.js b/src/views/Selection/DraggableResizable.js index 3b519e3..9648a0f 100644 --- a/src/views/Selection/DraggableResizable.js +++ b/src/views/Selection/DraggableResizable.js @@ -173,6 +173,7 @@ export default function DraggableResizable({ return ( - - + + {header} -
{children} -
+ + {sugs.map(({ k, v }) => ( {k} diff --git a/src/views/Selection/TranBox.js b/src/views/Selection/TranBox.js index 526e68f..699476b 100644 --- a/src/views/Selection/TranBox.js +++ b/src/views/Selection/TranBox.js @@ -32,7 +32,7 @@ function Header({ setHideClickAway, }) { return ( - + @@ -86,10 +86,14 @@ function TranForm({ text, setText, tranboxSetting, transApis, simpleStyle }) { const inputRef = useRef(null); return ( - + {!simpleStyle && ( <> - + - + - + + {error ? ( {error} ) : loading ? ( @@ -72,7 +72,7 @@ export default function TranCont({ } return ( - + )}