Light Box Imageのリファレンス
レイアウトおよびクラス
高度なユースケース
Light Box Imageオーバーレイを変更する
カスタムCSSを追加して、Light Box Imageオーバーレイを開いたときの不透明度を変更することができます。これをアプリケーションに実装するには、以下のCSSコードをコピーしてテーマに追加します。
.pswp__bg { background-color: rgba(0, 0, 0, 0.8); } .pswp__ui--fit .pswp__top-bar, .pswp__ui--fit .pswp__caption { background-color: rgba(0, 0, 0, 0); }
Light Box Imageパターン内の画像に丸い角を追加する
Light Box Image内の画像に丸い角を追加するには、以下のカスタムCSSをテーマに追加します。
.lightbox-content-thumbnail img, .pswp__item img { border-radius: var(--border-radius-soft); }