小白想给标签加背景色(如图)所以用GPT写了个css,但遇到了两个bug

image

css:
/* 自定义标签样式 /
.cm-hashtag {
background-color: #889eaa2b; /
半透明背景 /
border-radius: 18px !important; /
设置统一圆角 /
padding: 2px 8px !important; /
设置内边距,使标签更加舒适 /
text-align: center !important; /
文字居中 /
font-size: 0.95em !important; /
调整标签文字大小 /
font-weight: bold !important; /
标签文字加粗 /
align-items: center; /
垂直居中对齐 /
justify-content: center; /
水平居中 /
margin: 0; /
移除可能的外边距 /
overflow: hidden; /
确保内容不溢出,圆角效果保持 */
}

/* 标签通用样式:确保标签内容不会换行 /
.cm-hashtag {
white-space: nowrap !important; /
禁止换行,确保 # 和内容保持在同一行 */
}

/* 隐藏标签前缀部分(通常是用于逻辑处理的空元素) /
.cm-hashtag-begin {
display: none !important; /
将前缀部分隐藏 */
}

/* 为标签内容之前插入 # 符号 /
.cm-hashtag-begin + .cm-hashtag:before {
content: ‘#’ !important; /
手动插入 # 符号,使其视觉上与内容连为一体 */
}

/* 定义标签的样式和布局 /
.cm-hashtag-begin + .cm-hashtag {
border-top-left-radius: var(–tag-radius); /
设置左上角圆角,使用主题变量 /
border-bottom-left-radius: var(–tag-radius); /
设置左下角圆角 /
border-right: none; /
移除右边框,保持左边框独立样式 /
border-left: var(–tag-border-width) solid var(–tag-border-color); /
左边框宽度和颜色 /
padding-left: var(–tag-padding-x); /
标签内容的左内边距,避免文字贴边 */
}

bug1:标签在无序列表和正文非开头处,光标移动时会将#和第一个字符算做一个整体;标签在正文开头处,光标无法移动到#前,。
bug2:标签在无序列表开头处,第二行时输入期间第二行缩进消失,结束输入第二行缩进重现。

问了GPT好几遍都解决不了,请问有什么办法吗?