make bookmark dropdown items better looking

This commit is contained in:
2025-11-26 21:02:59 +03:00
parent 97e2c041c9
commit 90fe38497d
6 changed files with 101 additions and 15 deletions

View File

@@ -1242,7 +1242,7 @@ $bookmarks_dropdown_background_color: $ACCENT_COLOR !default;
$bookmarks_dropdown_border_radius: $DEFAULT_BORDER_RADIUS !default;
$bookmarks_dropdown_border: $button_border !default;
$bookmarks_dropdown_shadow: 0 0 30px rgba(0, 0, 0, 0.25) !default;
$bookmarks_dropdown_min_width: 400px !default;
$bookmarks_dropdown_width: 400px !default;
$bookmarks_dropdown_padding: $MEDIUM_PADDING !default;
.bookmarks-dropdown {
background-color: $bookmarks_dropdown_background_color;
@@ -1250,10 +1250,12 @@ $bookmarks_dropdown_padding: $MEDIUM_PADDING !default;
border-radius: $bookmarks_dropdown_border_radius;
box-shadow: $bookmarks_dropdown_shadow;
position: absolute;
right: 0;
min-width: $bookmarks_dropdown_min_width;
margin: 0;
min-width: $bookmarks_dropdown_width;
max-width: $bookmarks_dropdown_width;
padding: $bookmarks_dropdown_padding;
z-index: 100;
color: unset;
}
$bookmark_dropdown_item_padding: $MEDIUM_PADDING 0 !default;
@@ -1267,6 +1269,7 @@ $bookmark_dropdown_item_icon_size: 24px !default;
$bookmark_dropdown_item_icon_padding: 0 $MEDIUM_PADDING !default;
.bookmark-dropdown-item {
display: flex;
justify-content: space-between;
padding: $bookmark_dropdown_item_padding;
margin: $bookmark_dropdown_item_margin;
cursor: pointer;
@@ -1286,6 +1289,7 @@ $bookmark_dropdown_item_icon_padding: 0 $MEDIUM_PADDING !default;
width: $bookmark_dropdown_item_icon_size;
height: $bookmark_dropdown_item_icon_size;
padding: $bookmark_dropdown_item_icon_padding;
flex-shrink: 0;
}
&.selected {
@@ -1305,6 +1309,18 @@ $bookmark_dropdown_item_icon_padding: 0 $MEDIUM_PADDING !default;
justify-content: space-between;
}
.bookmark-dropdown-item-name {
overflow: hidden;
text-overflow: ellipsis;
}
$bookmark_dropdown_item_stats_padding: 0 $MEDIUM_PADDING !default;
.bookmark-dropdown-item-stats {
padding: $bookmark_dropdown_item_stats_padding;
flex-shrink: 0;
margin-left: auto;
}
$bookmark_dropdown_items_container_max_height: 300px !default;
.bookmark-dropdown-items-container {
max-height: $bookmark_dropdown_items_container_max_height;