Discourse - Collapse Boosts

自动折叠 boost。

You will need to install an extension such as Tampermonkey, Greasemonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Userscripts to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install a user script manager extension to install this script.

(I already have a user script manager, let me install it!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(I already have a user style manager, let me install it!)

/* ==UserStyle==
@name           Discourse - Collapse Boosts
@namespace      https://github.com/utags
@version        3.0.0
@description    自动折叠 boost。
@author         Pipecraft
@license        MIT
@icon           https://www.google.com/s2/favicons?sz=64&domain=meta.discourse.org
==/UserStyle== */

@-moz-document domain("meta.discourse.org"), domain("linux.do"), domain("idcflare.com"), domain("www.nodeloc.com"), domain("meta.appinn.net"), domain("community.openai.com"), domain("community.cloudflare.com"), domain("community.wanikani.com"), domain("forum.cursor.com"), domain("forum.obsidian.md"), domain("forum-zh.obsidian.md"), domain("www.uscardforum.com") {
  .discourse-boosts__list {
    max-width: fit-content;
  }

  /* 第三个和它后面的 boost */
  .discourse-boosts__bubble:nth-child(n + 3) {
    opacity: 0%;
    display: inline-flex;
    max-inline-size: 0;
    max-block-size: 0;
    padding: 0;
    margin-inline-start: calc(var(--space-1) * -1);
    overflow: hidden;
    pointer-events: none;
    transition-property:
      opacity, max-inline-size, max-block-size, padding, margin-inline-start;
    transition-duration: 180ms, 0ms, 0ms, 0ms, 0ms;
    transition-delay: 0ms, 0ms, 0ms, 0ms, 0ms;
    transition-timing-function: ease, linear, linear, linear, linear;
  }
  /* 第二个 boost */
  .discourse-boosts__bubble:nth-child(2) {
    opacity: 50%;
    transition: opacity 180ms ease;
  }
  /* 鼠标移到第二个 boost 上面时,或仅有两个 boost 时 */
  .discourse-boosts__bubble:nth-child(2):hover,
  .discourse-boosts__bubble:nth-child(2).discourse-boosts__bubble:last-of-type {
    opacity: 100%;
  }
  /* 鼠标移到 boost 上面时 */
  .discourse-boosts__list:hover .discourse-boosts__bubble {
    opacity: 100%;
    max-inline-size: 999px;
    max-block-size: 999px;
    padding: var(--space-1) var(--space-2) var(--space-1) var(--space-1);
    margin-inline-start: 0;
    pointer-events: auto;
    transition-delay: 120ms, 120ms, 120ms, 120ms, 120ms;
  }

  .discourse-boosts-trigger {
    order: -1;
  }
}