add ability to bookmark posts and threads, courtesy of bitty
This commit is contained in:
@@ -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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user