Здравствуйте,
Прежде всего, огромное спасибо за новый дизайн автодополнения — мне он очень нравится. 
Я внес несколько небольших изменений, которые использую на своём сайте.
1. Я сделал список автодополнения на всю ширину на мобильных устройствах. Считаю, что это безопасное решение, так как оно предотвращает выход списка за пределы экрана. Это особенно актуально в центральной части. Такой подход обеспечивает более широкое отображение, что удобно, когда у пользователя длинное имя или отображается статус.
.d-editor-textarea-wrapper {
.autocomplete {
.mobile-view & {
max-width: calc(100% - 20px);
width: 100%;
left: 10px !important; // переопределение расчёта позиции слева
}
}
}
2. В списке с эффектом затухания нижняя тень и отступ всегда видны, даже если список не прокручивается. Я заменил использование -webkit-mask на псевдоэлемент :after для тени. Добавил верхнюю и нижнюю тени, которые плавно появляются под первым и последним элементами <li>. Это позволяет убрать нижний отступ.
.hashtag-autocomplete {
max-height: 14em;
&__fadeout {
-webkit-mask: none;
&:before {
content: '';
position: absolute;
top: 0;
width: 100%;
height: 1.5em;
background: linear-gradient(
to bottom,
rgba(var(--secondary-rgb), 1),
rgba(var(--secondary-rgb), 0)
);
}
&:after {
content: '';
position: absolute;
bottom: 0;
width: 100%;
height: 1.5em;
background: linear-gradient(
to bottom,
rgba(var(--secondary-rgb), 0),
rgba(var(--secondary-rgb), 1)
);
}
}
&__option {
&:last-of-type {
margin-bottom: 0;
}
// размещаем элементы поверх теней
&:first-of-type,
&:last-of-type {
.hashtag-autocomplete__link {
position: relative;
z-index: 1;
}
}
}
}
