横スクロールコメント

カスタマイズ
1

対象

テンプレート

対象となるサービス

すべて

内容

テンプレのneonについて質問です。
横スクロールのコメントがとても良いなと思ったんですが、シャドウなしにするか、縁取りで表示したいです。 script.jsの以下をnoneにしたんですが、シャドウが消えませんでした。

const style = {
          '--lcv-background-color': bgColor,
          '--lcv-text-color': textColor,
          '--lcv-comment-shadow': 'none',
          '--lcv-neon-shadow': 'none',
          '--lcv-neon-box-shadow': 'none',
          '--lcv-box-shadow': 'none' ←ここ
        }

どこをいじればいけますか？ あるいは有料テンプレ等で横スクロールで使えるものはありますか？ お時間ある時にどなたか教えていただけると助かります

2

手抜きですが、参考になれば幸いです。

１－１）テンプレエディタで【neon】を選び、ネオンカラーの透明度を０にする。

１－２）↓下のCSSをOBSのカスタムCSSにすべて貼り付けの部分をOBSのカスタムCSSの部分に張り付ける。

２－１）デンプレエディタで【basic】を選び、好みの縁取りにする。

２－２）↓下のCSSをOBSのカスタムCSSにすべて貼り付けの部分をOBSのカスタムCSSの部分に張り付ける。（１－２の下でよい）

※OBSに書き込むのがイヤという場合は、「自己責任で」neonを複製しリネームしてstyle.cssに書き込んでください。

満足できるかどうかわかりませんがお試しあれ。

image
image330×868 27.3 KB

image
image323×858 20.6 KB

3

image
お返事ありがとうございます！
ご指示の通りやってみましたが、やはりボケてしまいます。
何か見落としがないか試してみます。

4

シャドウなし、もしくは縁取りということでしたら、以下のようなものをCSSに追記するのはいかがでしょうか。

シャドウなし

:root {
    --lcv-neon-shadow: none;
}

縁取り（色は適当）

:root {
    --lcv-neon-shadow: rgba(0,0,0,0);
}
body {
    text-shadow: 1px 1px 0 #0ff,
    -1px -1px 0 #0ff,
    -1px 1px 0 #0ff,
    1px -1px 0 #0ff,
    0 1px 0 #0ff,
    0 -1px 0 #0ff,
    -1px 0 0 #0ff,
    1px 0 0 #0ff;
}

また別トピックにはなりますが、neonのテンプレートを使いシャドウなしで色を変えている（その他のカスタマイズも含みますが）ものもあるため、参考にしていただければと存じます。

5

ありがとうございます！
数値を変えて試してみましたがきれいに縁取り出来ませんでした。
また、フォントをローカルに保存してあるものに変更することは可能ですか？
もしよろしければ教えてください！

:root {
    --lcv-neon-shadow: rgba(0, 0, 0, 0); 
}

body {
    text-shadow: 3px 3px 0 #000,
                 -3px -3px 0 #000,
                 -3px 3px 0 #000,
                 3px -3px 0 #000,
                 0 3px 0 #000,
                 0 -3px 0 #000,
                 -3px 0 0 #000,
                 3px 0 0 #000;
}

image

6

ローカルにあるフォントを使った上で、文字に縁取りをさせたりシャドウを消したりすることももちろん可能です。

ローカルにあるフォントの参照方法は、ドキュメントを参考にしてみてください。