prismjs代码高亮的一些问题

Wyatex commented 3 years ago

Please follow this Issue template to provide relevant information, such as source code repository, website URL and screenshots, which will help us investigate. 请按照此 Issue 模版提供相关信息，例如源码仓库、网站链接和屏幕截图，这将有助于我们进行调查。

Issue Checklist

[x] I am using NexT version 8.0 or later.
[x] I have already read the Troubleshooting page of Hexo and Troubleshooting page of NexT.
[x] I have already searched for current issues, which does not help me.

Expected behavior

1、代码块文件名区域显示应该和highlight引擎一样 2、左右滑动时copy按钮应该固定在右上角 3、可以使用mac样式

Actual behavior

Links to repository or source code of the blog: https://github.com/Wyatex/next-prism-bug
Screenshots:

文件名处显示不正常，mac主题不工作

copy按钮没有固定

Steps to reproduce the behavior

在hexo的config文件开启prismjs

highlight:
  enable: false
  line_number: true
  auto_detect: false
  tab_replace: ''
  wrap: true
  hljs: false

prismjs:
  enable: true
  preprocess: true
  line_number: true
  tab_replace: ''

Next主题的config设置：

codeblock:
  # Code Highlight theme
  # All available themes: https://theme-next.js.org/highlight/
  theme:
    light: tomorrow
    dark: tomorrow-night
  prism:
    light: prism-okaidia
    dark: prism-okaidia
  # Add copy button on codeblock
  copy_button:
    enable: true
    # Available values: default | flat | mac
    style: mac

然后用hexo s运行，在页面中看到的就和上图一样

Environment Information

Node.js and NPM Information

v14.9.0
6.14.8

Package dependencies Information

hexo-site@0.0.0 F:\html project\hexo
+-- hexo@5.4.0
+-- hexo-generator-archive@1.0.0
+-- hexo-generator-category@1.0.0
+-- hexo-generator-index@2.0.0
+-- hexo-generator-searchdb@1.3.4
+-- hexo-generator-tag@1.0.0
+-- hexo-renderer-ejs@1.0.0
+-- hexo-renderer-marked@4.0.0
+-- hexo-renderer-stylus@2.0.1
+-- hexo-server@2.0.0
+-- hexo-word-counter@0.0.3
+-- pjax@0.2.8
`-- prism-themes@1.7.0

Hexo Configuration

详细可以看我上面贴出来的仓库

NexT Configuration

详细可以看我上面贴出来的仓库

Other Information

Edge和Chrome浏览器，Windows10

ljcbaby commented 3 years ago

I tested it in the latest version and reproduced the problem.

ljcbaby commented 3 years ago

The same as #98

stevenjoezhang commented 3 years ago

mac 样式可能只能适配 highlight.js。prism 自带的主题本身就把代码块的样式都设置了，强行加 mac 样式反而会显得杂乱。

Wyatex commented 3 years ago

虽然但是，我还是喜欢mac那个样式

stevenjoezhang commented 2 years ago

mac 样式可以根据这个改： https://github.com/next-theme/hexo-theme-next/issues/227

I'm closing this issue. Please join the discussion there :)

github-actions[bot] commented 1 year ago

This thread has been automatically locked since there has not been any recent activity after it was closed. It is possible issue was solved or at least outdated. Feel free to open new for related bugs.

next-theme / hexo-theme-next