feat: Sidebar — разделители и перенос длинных названий (0.14.0)
Проп dividers рисует тонкие линии между пунктами (подпункты раскрытой группы — без линий). Длинное название пункта переносится на вторую строку вместо обрезки многоточием (не больше 2 строк). Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -99,7 +99,8 @@
|
||||
text-align: left;
|
||||
// Пункт-ссылка (<a>) выглядит так же, как пункт-кнопка.
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
// Длинное название переносится (не больше 2 строк — см. .itemTitle), а не обрезается многоточием.
|
||||
white-space: normal;
|
||||
cursor: pointer;
|
||||
transition: color .18s, background .18s, border-color .18s;
|
||||
|
||||
@@ -130,11 +131,26 @@
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
// Не больше 2 строк: совсем длинное название обрезается многоточием на второй строке.
|
||||
.itemTitle {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
line-height: 1.3;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
|
||||
// ---- Линии между пунктами (проп dividers) ----
|
||||
// Линия — над каждым пунктом, кроме первого; подпункты раскрытой группы лежат внутри .group — их не трогаем.
|
||||
.navDividers .items {
|
||||
gap: 0;
|
||||
|
||||
> * + * {
|
||||
border-top: 1px solid rgba(255, 255, 255, .06);
|
||||
}
|
||||
}
|
||||
|
||||
.badge {
|
||||
@@ -189,7 +205,7 @@ $sub-item-indent: 48px; // 18px отступ пункта + 3px маркер +
|
||||
font-size: 13px;
|
||||
text-align: left;
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
white-space: normal;
|
||||
cursor: pointer;
|
||||
transition: color .18s, background .18s;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user