Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

指定自定义字体时,代码块的行号和实际行的高度会不一样导致错位 #778

Closed
3 tasks done
lopo12123 opened this issue Mar 29, 2024 · 3 comments
Closed
3 tasks done
Labels
Bug Something isn't working Solved

Comments

@lopo12123
Copy link

Issue Checklist

Expected behavior

行号和实际行对应

Actual behavior

Steps to reproduce the behavior

添加一个这样的代码块,应该就可以看到错位

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

Node.js and NPM Information

node -v
v18.16.1

npm -v
9.5.1

yarn -v
3.6.4

Package dependencies Information

Hexo Configuration

# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/

# Site
title: lopo
subtitle: '霓为衣兮风为马'
description: 'find an anchor to stop drifting...'
keywords:
author: lopo
language: zh-CN
timezone: Asia/Shanghai

# URL
## Set your site url here. For example, if you use GitHub Page, set url as 'https://username.github.io/project'
url: https://lopo12123.github.io
permalink: :year/:month/:day/:title/
permalink_defaults:
pretty_urls:
  trailing_index: false # Set to 'false' to remove trailing 'index.html' from permalinks
  trailing_html: false # Set to 'false' to remove trailing '.html' from permalinks

# Directory
source_dir: source
public_dir: docs  # public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render:

# Writing
new_post_name: :title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link:
  enable: true # Open external links in new tab
  field: site # Apply to the whole site
  exclude: ''
filename_case: 0
render_drafts: false
post_asset_folder: true
marked:
  prependRoot: true
  postAsset: true
relative_link: false
future: true
syntax_highlighter: prismjs  # highlight.js
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: ''

# Home page setting
# path: Root path for your blogs index page. (default = '')
# per_page: Posts displayed per page. (0 = disable pagination)
# order_by: Posts order. (Order by date descending by default)
index_generator:
  path: ''
  per_page: 10
  order_by: -date

# Category & Tag
default_category: uncategorized
category_map:
tag_map:

# Metadata elements
## https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta
meta_generator: true

# Date / Time format
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD
time_format: HH:mm:ss
## updated_option supports 'mtime', 'date', 'empty'
updated_option: 'mtime'

# Pagination
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page

# Include / Exclude file(s)
## include:/exclude: options only apply to the 'source/' folder
include:
exclude:
ignore:

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: next

# Deployment
## Docs: https://hexo.io/docs/one-command-deployment
deploy:
  type: ''

search:
  path: search.xml
  field: post
  content: true
  format: html

NexT Configuration

// 设置了一下代码高亮的配置
codeblock:
  # Code Highlight theme
  # All available themes: https://theme-next.js.org/highlight/
  theme:
    light: default  # atom-one-light
    dark: stackoverflow-dark  # atom-one-dark
  prism:
    light: prism  # prism-tomorrow
    dark: prism  # prism-tomorrow
  # Add copy button on codeblock
  copy_button:
    enable: true
    # Available values: default | flat | mac
    style: mac
  # Fold code block
  fold:
    enable: true
    height: 300

// 加了自定义样式
custom_file_path:
  style: source/_data/styles.css

// 样式里设置了字体
code {
    font-family: 'JetBrains Mono', monospace !important;
}

Other Information

No response

@lopo12123 lopo12123 added the Bug Something isn't working label Mar 29, 2024
@stevenjoezhang
Copy link
Member

你的网站上似乎没有问题
截屏2024-05-10 01 38 09

@lopo12123
Copy link
Author

现在好像确实没这个问题了,当时确实是像我的截图中那样有错位,可能是其他原因导致的吧。>﹏<

@stevenjoezhang
Copy link
Member

确实很怪,行号的样式和代码应该是完全一样的。如果之后发现问题又出现了,欢迎继续回复~

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Bug Something isn't working Solved
Projects
None yet
Development

No branches or pull requests

2 participants