Skip to content

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

Not planned
@TCOTC

Description

@TCOTC
Contributor

#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

Activity

ytm157

ytm157 commented on Aug 29, 2024

@ytm157
Contributor

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

Vanessa219

Vanessa219 commented on Aug 29, 2024

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

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

TCOTC

TCOTC commented on Aug 29, 2024

@TCOTC
ContributorAuthor

确实,难搞

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @88250@Vanessa219@TCOTC@ytm157

        Issue actions

          代码块行号应该固定在左侧,只有代码可以横向滚动 · Issue #12354 · siyuan-note/siyuan