add ability to bookmark posts and threads, courtesy of bitty

This commit is contained in:
2025-11-23 22:07:50 +03:00
parent 962b833a80
commit 075a9bd498
15 changed files with 521 additions and 31 deletions

View File

@@ -18,6 +18,14 @@ $MAIN_BG: color.scale($ACCENT_COLOR, $lightness: -10%, $saturation: -40%) !defau
$BUTTON_COLOR: color.adjust($ACCENT_COLOR, $hue: 90) !default;
$BUTTON_COLOR_2: color.adjust($ACCENT_COLOR, $hue: 180) !default;
$BUTTON_COLOR_HOVER: color.scale($BUTTON_COLOR, $lightness: 20%) !default;
$BUTTON_COLOR_ACTIVE: color.scale($BUTTON_COLOR, $lightness: -10%, $saturation: -70%) !default;
$BUTTON_COLOR_DISABLED: color.scale($BUTTON_COLOR, $lightness: 30%, $saturation: -90%) !default;
$BUTTON_COLOR_2_HOVER: color.scale($BUTTON_COLOR_2, $lightness: 20%) !default;
$BUTTON_COLOR_2_ACTIVE: color.scale($BUTTON_COLOR_2, $lightness: -10%, $saturation: -70%) !default;
$BUTTON_COLOR_2_DISABLED: color.scale($BUTTON_COLOR_2, $lightness: 30%, $saturation: -90%) !default;
$ACCORDION_COLOR: color.adjust($ACCENT_COLOR, $hue: 140, $lightness: -10%, $saturation: -15%) !default;
$DEFAULT_FONT_COLOR: black !default;
@@ -885,7 +893,7 @@ $colorful_table_margin: $MEDIUM_PADDING $ZERO_PADDING !default;
border-collapse: collapse;
width: 100%;
margin: $colorful_table_margin;
overflow: hidden;
// overflow: hidden;
}
$colorful_table_th_color: $BUTTON_COLOR_2 !default;
@@ -1095,7 +1103,7 @@ $accordion_margin: $MEDIUM_PADDING $SMALL_PADDING !default;
box-sizing: border-box;
border: $accordion_border;
margin: $accordion_margin;
overflow: hidden;
// overflow: hidden;
}
.accordion.hidden {
@@ -1221,3 +1229,79 @@ $babycode_guide_list_border: 1px dashed !default;
.babycode-guide-list {
border-bottom: $babycode_guide_list_border;
}
.bookmark-dropdown-inner {
position: relative;
}
$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_padding: $MEDIUM_PADDING !default;
.bookmarks-dropdown {
background-color: $bookmarks_dropdown_background_color;
border: $bookmarks_dropdown_border;
border-radius: $bookmarks_dropdown_border_radius;
box-shadow: $bookmarks_dropdown_shadow;
position: absolute;
right: 0;
min-width: $bookmarks_dropdown_min_width;
padding: $bookmarks_dropdown_padding;
z-index: 100;
}
$bookmark_dropdown_item_padding: $MEDIUM_PADDING 0 !default;
$bookmark_dropdown_item_margin: $MEDIUM_PADDING 0 !default;
$bookmark_dropdown_item_font_color: $BUTTON_FONT_COLOR !default;
$bookmark_dropdown_item_background: $BUTTON_COLOR !default;
$bookmark_dropdown_item_background_hover: $BUTTON_COLOR_HOVER !default;
$bookmark_dropdown_item_background_selected: $BUTTON_COLOR_2 !default;
$bookmark_dropdown_item_background_selected_hover: $BUTTON_COLOR_2_HOVER !default;
$bookmark_dropdown_item_icon_size: 24px !default;
$bookmark_dropdown_item_icon_padding: 0 $MEDIUM_PADDING !default;
.bookmark-dropdown-item {
display: flex;
padding: $bookmark_dropdown_item_padding;
margin: $bookmark_dropdown_item_margin;
cursor: pointer;
border: $button_border;
border-radius: $button_border_radius;
color: $bookmark_dropdown_item_font_color;
background-color: $bookmark_dropdown_item_background;
&:hover {
background-color: $bookmark_dropdown_item_background_hover;
}
&::before {
// TODO: un-inline this once the bitty bug is fixed
content: url('data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect%20x%3D%221.5%22%20y%3D%221.5%22%20width%3D%2221%22%20height%3D%2221%22%20rx%3D%223%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223%22%20fill%3D%22none%22%2F%3E%3C%2Fsvg%3E');
width: $bookmark_dropdown_item_icon_size;
height: $bookmark_dropdown_item_icon_size;
padding: $bookmark_dropdown_item_icon_padding;
}
&.selected {
background-color: $bookmark_dropdown_item_background_selected;
&:hover {
background-color: $bookmark_dropdown_item_background_selected_hover;
}
&::before{
content: url('data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect%20x%3D%221.5%22%20y%3D%221.5%22%20width%3D%2221%22%20height%3D%2221%22%20rx%3D%223%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223%22%20fill%3D%22none%22%2F%3E%3Crect%20x%3D%225%22%20y%3D%225%22%20width%3D%2214%22%20height%3D%2214%22%20rx%3D%222%22%20stroke%3D%22none%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fsvg%3E');
}
}
}
.bookmarks-dropdown-header {
display: flex;
justify-content: space-between;
}
$bookmark_dropdown_items_container_max_height: 300px !default;
.bookmark-dropdown-items-container {
max-height: $bookmark_dropdown_items_container_max_height;
overflow: scroll;
}