別ペイン表示のときは省スペースになると嬉しい

[kdmsnr]

ありがたく使用させていただいています。ありがとうございます。

表示に関する要望です。

Scrapboxでは下記の「関連ページ一覧を横に移動させる」でスッキリとした表示が可能になります。
https://scrapbox.io/blu3mo-public/%E9%96%A2%E9%80%A3%E3%83%9A%E3%83%BC%E3%82%B8%E4%B8%80%E8%A6%A7%E3%82%92%E6%A8%AA%E3%81%AB%E7%A7%BB%E5%8B%95%E3%81%95%E3%81%9B%E3%82%8B

別ペイン表示のときは、上記のような省スペース表示になると嬉しいなと思いました。

[L7Cy]

以下のようなCSSスニペットを適用すると同じような感じの表示になるかと思いますが，これでどうでしょうか？

.twohop-links-box {
  height: 50px;
  position: relative;
  border-top: 5px solid var(--bg-box-top) !important;
  font-size: 13.4px;
  padding: 5px;
}
.twohop-links-section{
  grid-gap: 5px;
}
.twohop-links-box-title{
  filter: drop-shadow(0px 0px 2px var(--bg-box, #fff)) drop-shadow(0px 0px 6px var(--bg-box, #fff)) drop-shadow(0px 0px 8px var(--bg-box, #fff)) drop-shadow(0px 0px 10px var(--bg-box, #fff)) drop-shadow(0px 0px 14px var(--bg-box, #fff));
  margin-bottom: 0px;
  z-index: 1;
  position: absolute;
  -webkit-line-clamp: 2;
}
.twohop-links-box-preview{
  z-index: 0;
}
.twohop-links-box-preview img{
  max-width: 50% !important;
  display: block;
  margin-right: initial;
}

[L7Cy]

drop-shadowだとレンダリングが重くなるので使わないように修正しました．

.twohop-links-box {
  height: 50px;
  position: relative;
  border-top: 5px solid var(--bg-box-top) !important;
  font-size: 13.4px;
  padding: 5px;
}
.twohop-links-section{
  grid-gap: 5px;
}
.twohop-links-box-title{
  margin-bottom: 0px;
  z-index: 1;
  position: absolute;
  -webkit-line-clamp: 2;
}
.twohop-links-box-preview{
  z-index: 0;
  color: #b7b7b780;
}
.twohop-links-box-preview img{
  max-width: 50% !important;
  display: block;
  margin-right: initial;
  opacity: 0.5;
}

[kdmsnr]

ありがとうございます！ いい感じになりました。