How to restore the scroll bar style to the browser default style？

[lingyunzhimeng]

I have an idea for a new feature for jQuery Terminal

I have upgraded to the latest version, but I want to use the browser’s default scroll bar. How should I set it up?

[jcubic]

There is no easy way, but now when you have container queries with style function I can create a toggle for it with CSS Variable.

[jcubic]

Unfortunately, the toggle with style container queries doesn't work in Chrome. I've reported a bug:

https://bugs.chromium.org/p/chromium/issues/detail?id=1512309

So in order to use default scrollbar you need to delete this CSS:

    .terminal-scroller::-webkit-scrollbar {
        background: var(--background, #000);
    }
    .terminal-scroller::-webkit-scrollbar-thumb {
        background: var(--color, #aaa);
    }
    .terminal-scroller::-webkit-scrollbar-thumb:hover {
        background: var(--color, #aaa);
    }
    .terminal-scroller {
        scrollbar-color: #aaa #000;
        scrollbar-color: var(--color, #aaa) var(--background, #000);
        scrollbar-width: thin;
    }

[lingyunzhimeng]

Unfortunately, the toggle with style container queries doesn't work in Chrome. I've reported a bug:

https://bugs.chromium.org/p/chromium/issues/detail?id=1512309

So in order to use default scrollbar you need to delete this CSS:

    .terminal-scroller::-webkit-scrollbar {
        background: var(--background, #000);
    }
    .terminal-scroller::-webkit-scrollbar-thumb {
        background: var(--color, #aaa);
    }
    .terminal-scroller::-webkit-scrollbar-thumb:hover {
        background: var(--color, #aaa);
    }
    .terminal-scroller {
        scrollbar-color: #aaa #000;
        scrollbar-color: var(--color, #aaa) var(--background, #000);
        scrollbar-width: thin;
    }

Yes, I tried to delete this css and the scroll bar restored the chrome default style. But I still didn't want to modify the component source code. After I modified the scroll bar color, I accepted the new style. Thanks

[jcubic]

Unfortunately, it's not possible to add this to the library. There is a bug in Chrome that makes the scrollbar disappear if I use a toggle using container style query.

I've reported this bug to Chromium: 1512309

You can check the reproduction of the bug.

[lingyunzhimeng]

Unfortunately, it's not possible to add this to the library. There is a bug in Chrome that makes the scrollbar disappear if I use a toggle using container style query.

I've reported this bug to Chromium: 1512309

You can check the reproduction of the bug.

This bug has also reproduced here, and I hope Chrome can fix it in the future. I have another small question, I don't want users to paste pictures in the terminal, can I achieve this through configuration? At present, I have modified the source code and added configuration items when the terminal is initialized.

function echo_image(image) {
      if (!settings.isSupportCopyImg) {
            return;
       }
 self.echo('<img src="' + image + '"/>', {raw: true})
}

[jcubic]

If you're talking about copy/pasting then there is an option for this settings.pasteImage it's below your edit:

if (is_type(items[i], 'image') && settings.pasteImage) {
   var blob = items[i].getAsFile();
   echo(blob);
} else if (is_type(items[i], 'text/plain')) {
   ...

PS: use triple backticks to post the code block, and you can use language like this:

```javascript
console.log("hello");
```

it will display as:

console.log("hello");

[lingyunzhimeng]

If you're talking about copy/pasting then there is an option for this settings.pasteImage it's below your edit:

if (is_type(items[i], 'image') && settings.pasteImage) {
   var blob = items[i].getAsFile();
   echo(blob);
} else if (is_type(items[i], 'text/plain')) {
   ...

PS: use triple backticks to post the code block, and you can use language like this:

```javascript
console.log("hello");

it will display as:

```js
console.log("hello");

I've been trying to use single back quotes before, so it never worked. 0.0....
I was upgrading the version recently and found that there were many places where I directly modified the source code. This time the problem is basically solved, thank you.

[jcubic]

If you need to modify the code I suggest creating a fork and modifying -src files. Then run make from the command line but don't commit the build files. This way you will be able to sync upstream when the library changes.

[lingyunzhimeng]

If you need to modify the code I suggest creating a fork and modifying -src files. Then run make from the command line but don't commit the build files. This way you will be able to sync upstream when the library changes.

I upgraded from 2.8.0, and I found that many of the source code modifications I made before were unnecessary, such as the copy-and-paste images I just asked you about, and many CSS styles. Now I no longer need to modify the source code in my project, and it runs very well. Very nice, thanks again.

[jcubic]

I will keep this one open, until Chrome fixes the issue with style container queries. It looks like they confirmed the bug and assigned someone.