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.

Sign up for GitHub

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

Jump to bottom

代码块行号应该固定在左侧，只有代码可以横向滚动 #12354

Closed
TCOTC opened this issue Aug 28, 2024 · 3 comments
Closed

代码块行号应该固定在左侧，只有代码可以横向滚动 #12354

TCOTC opened this issue Aug 28, 2024 · 3 comments

Comments

@TCOTC
Copy link
Contributor

TCOTC commented Aug 28, 2024 •
edited
Loading

#12317 (comment)

几个方案

01

2024.10.7：这样改之后选择文本会向上全选，不行

.protyle-linenumber__rows {
    position: sticky;
    left: 0;
    background-color: rgb(243,243,244);
    padding-left: 0;
    padding-right: 1em;
    min-width: auto;
    margin-right: 0;
}

乍一看感觉没什么问题：

image

但选中块之后就会出现跟 #12105 相同的颜色问题：

image

02

.code-block:not([linenumber="false"]) .protyle-linenumber__rows {
    position: absolute;
    left: 1.4em;
}
.code-block:not([linenumber="false"]) .hljs {
    margin-left: 1.8em;
}
/* 来源于 https://ld246.com/article/1724861627569 */

在 1000 行以前样式都正常（还能顺便解决 #11377 ）：

image

超过 1000 行之后文本就会重叠：

image
@TCOTC TCOTC mentioned this issue Aug 28, 2024
Closed
@ytm157
Copy link
Contributor

ytm157 commented Aug 29, 2024

哥，您是思源请的产品经理吗

@Vanessa219
Copy link
Member

  1. 有纵向滚动条时，向上滚动后下部无背景遮挡。
    QQ_1724903826154

  2. .hljs 上可能会设置 max-height 这样的话无法兼容竖向滚动条

@TCOTC
Copy link
Contributor Author

TCOTC commented Aug 29, 2024

确实，难搞

@88250 88250 closed this as not planned Won't fix, can't repro, duplicate, stale Sep 5, 2024
@TCOTC TCOTC mentioned this issue Oct 6, 2024
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@88250 @Vanessa219 @TCOTC @ytm157