How to set the max line numbers?

[Kampi]

I have several code snippets on my website which are quite long. Is there a way to tell Enlighter to show a specific number of lines and then add a vertical scrollbar?

(Sorry for that noobish question :) )

[AndiDittrich]

short answer: no, use css as intended

[Kampi]

short answer: no, use css as intended

Hi,

thank you. How can I do it?

[AndiDittrich]

see EnlighterJS/EnlighterJS#87
you can copy the related css from the EnlighterJS sources

[Kampi]

Hi,

I have added the code block

.enlighter-collapse {
    &.@{VIEW_STANDARD} {
        overflow-y: auto;
        max-height: 50px;
    }
    &.@{VIEW_CODEGROUP} {
        .enlighter-codegroup-wrapper {
            overflow-y: auto;
            max-height: 50px;
        }
    }

    &.enlighter-collapse-full.@{VIEW_STANDARD} {
        max-height: none;
    }

    &.enlighter-collapse-full.@{VIEW_CODEGROUP} .enlighter-codegroup-wrapper {
        max-height: none;
    }
}

to my style.css of my theme (as you wrote), but it doesn´t change the visible lines of my code blocks.

[AndiDittrich]

this is not css, it's the less code including the EnlighterJS framework functions - this won't work.

you have to create your own css rules based on the the example. the sourcecode above has a different purpose (toggle/expand button).

.enlighter-default{
      overflow-y: auto;
       max-height: 100px;
}

[Kampi]

It´s working now, but I don´t have a scrollbar. I thought overflow-y: auto enables the vertical scrollbar.

[AndiDittrich]

it depends on the browser - you can also set it to scroll - https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-y

[Kampi]

mmh both options doesn´t work.

[AndiDittrich]

it's working fine within the dev env

[philippeflorent]

this should be an option in Gutenberg

[AndiDittrich]

the option is theme related and sets the absolute height (px) of the codeblock