diff --git a/src/config/i18n.js b/src/config/i18n.js index 805e37d..6e523ad 100644 --- a/src/config/i18n.js +++ b/src/config/i18n.js @@ -424,6 +424,10 @@ export const I18N = { zh: `下划虚线`, en: `Dashed Underline`, }, + dash_box: { + zh: `虚线框`, + en: `Dashed Box`, + }, wavy_line: { zh: `下划波浪线`, en: `Wavy Underline`, diff --git a/src/config/index.js b/src/config/index.js index 0427070..e131ca5 100644 --- a/src/config/index.js +++ b/src/config/index.js @@ -391,6 +391,7 @@ export const OPT_STYLE_NONE = "style_none"; // 无 export const OPT_STYLE_LINE = "under_line"; // 下划线 export const OPT_STYLE_DOTLINE = "dot_line"; // 点状线 export const OPT_STYLE_DASHLINE = "dash_line"; // 虚线 +export const OPT_STYLE_DASHBOX = "dash_box"; // 虚线框 export const OPT_STYLE_WAVYLINE = "wavy_line"; // 波浪线 export const OPT_STYLE_FUZZY = "fuzzy"; // 模糊 export const OPT_STYLE_HIGHLIGHT = "highlight"; // 高亮 @@ -401,6 +402,7 @@ export const OPT_STYLE_ALL = [ OPT_STYLE_LINE, OPT_STYLE_DOTLINE, OPT_STYLE_DASHLINE, + OPT_STYLE_DASHBOX, OPT_STYLE_WAVYLINE, OPT_STYLE_FUZZY, OPT_STYLE_HIGHLIGHT, @@ -411,6 +413,7 @@ export const OPT_STYLE_USE_COLOR = [ OPT_STYLE_LINE, OPT_STYLE_DOTLINE, OPT_STYLE_DASHLINE, + OPT_STYLE_DASHBOX, OPT_STYLE_WAVYLINE, OPT_STYLE_HIGHLIGHT, OPT_STYLE_BLOCKQUOTE, diff --git a/src/views/Content/index.js b/src/views/Content/index.js index 086c6f4..c7323b6 100644 --- a/src/views/Content/index.js +++ b/src/views/Content/index.js @@ -5,6 +5,7 @@ import { OPT_STYLE_DOTLINE, OPT_STYLE_DASHLINE, OPT_STYLE_WAVYLINE, + OPT_STYLE_DASHBOX, OPT_STYLE_FUZZY, OPT_STYLE_HIGHLIGHT, OPT_STYLE_BLOCKQUOTE, @@ -49,6 +50,19 @@ const StyledSpan = styled("span")` -webkit-opacity: 1; } `; + case OPT_STYLE_DASHBOX: // 虚线框 + return css` + color: ${bgColor || DEFAULT_COLOR}; + border: 1px dashed ${bgColor || DEFAULT_COLOR}; + background: transparent; + display: block; + padding: 5px 5px; + box-sizing: border-box; + white-space: normal; + word-wrap: break-word; + overflow-wrap: break-word; + line-height: 1.4; + `; case OPT_STYLE_FUZZY: // 模糊 return css` filter: blur(0.2em);