Угловой материал полосы прокрутки

Question

Ссылка: - https://stackblitz.com/angular/qmedkbvramy?file=app%2Fcdk-virtual-scroll-overview-example.ts

Пытаюсь прокрутить угловой материал, как показано на рисунке.Но я не могу понять, как это сделать.

Answer 1

Материал по умолчанию не предоставляет никаких стилей для изменения прокрутки

Вы можете использовать эту CSS для изменения стиля полосы прокрутки

cdk-virtual-scroll-viewport::-webkit-scrollbar-track
{
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
    background-color: #F5F5F5;
}

cdk-virtual-scroll-viewport::-webkit-scrollbar
{
    width: 12px;
    background-color: #F5F5F5;
}

cdk-virtual-scroll-viewport::-webkit-scrollbar-thumb
{
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #555;
}

Демонстрация Stackblitz: https://stackblitz.com/edit/angular-jkw9ac