スタイルシート
仕事でも使うのでやらねばならんCSSなんですが、いきなり業務用のCSS読み解くとか、プログラミング挫折組の私には苦行( -᷄ω-᷅ )ﾑﾘﾎﾟｰで、二の足を踏んでいましたが、これくらいならできるんじゃないかと、重い腰をあげてみました。
YouTubeのコラボなんかでDiscordを使って通話しながらやることがあるんですが、水曜恒例のオーバークック同好会もその方法でやっています。
で、そうなると今誰がしゃべってるんだ問題が発生するんですよ！
オーバークックは最大4人なので、ある程度予測はつきやすいですが、Among USなんかは最大15人が同時に話すので聞いている方は、聞き慣れた声以外は誰が発言したのかわかりません。
そんな時に画面内にアイコンを表示して、それが点滅することで、喋っている人を判別させる方法があって、その設定は、CSS（スタイルシート）でカスタマイズすることができます。
この動画の右上に表示されているアイコンと名前は、OBSにCSSを設定して表示させています。
参考にさせていただいたページはこちらです
このサイトの『明るさを変更する』というコードを丸パクリで、名前の色は、
このページで変更してます。
このページの使い方は、以前の日記でも触れている内容をいろいろやっているときに見つけたんですが…
この辺の日記を書いたときに参考にさせていただいた動画があって、
沖縄のムックさんのこの動画で教えてもらいました！
とってもわかりやすかったです。
Google先生にYouTube先輩、本当にたくさんの情報が出ていてありがたいですm( ^ω^ )ｍ
そして、CSSの方ですがさらにオーバークックの青・赤・緑・黄の4色で色分けしたいし、アイコンを四角くしたいと思いまして、調べてみました！
仕上がりはこんな感じです✨(*ˊᗜˋ*)♡（黄色になった時バージョン）
喋るとアイコンだけ明るく表示された上にぴょこぴょこ動いてわかりやすい！
拾ってきたCSSコードを集めただけですが、自分のイメージ通りに動いてくれると本当に嬉しいです( ◜ᴗ◝)達成感✨
達成感GET記念に、コードも貼っとこう( ¯꒳¯ )ｂ✧
（同好会用なのでそのままじゃ流用できないけどね）
今週の水曜の動画はまだこのCSSが出来てなかったので、名前の色分けまでのCSSで表示しています。
この四角いアイコン表示のCSSは、また次の会合で使えたらいいなと思います！ちょっと楽しみ♪
もっというと、これにそれぞれの選択したキャラクターも表示できたら良いのにな〜とか思ったり…🤔
出来たらやってみたいです( ◜ᴗ◝)
今日のツイートをリンクします。
【今日ツイ】
みんながいろいろ頑張ってるの見てほっこりしながら1日が終わるの幸せ
— しゅが〜ロール🌺☕️ (@sugarroll666) 2021年12月16日
受験で勉強のためにゲームやSNSを自ら制限して頑張ってるよってだったり、仕事が激務なのにプライベートだってちゃんと楽しむよってしっかり自分の人生楽しんでたり、やりたいことに没頭したよって成果を見せてくれたり、子育て大変だけど幸せだよ〜って写真や充実ツイート発信してくれたり、頑張ってるし充実してるってツイートは本当に励みになるし私も前向きになれてほっこりします！
みんな頑張って〜୧( ๑•̀ω•́๑)૭✧
お子にリアルを大事にしなさいとか偉そーに語ったくせにリアルの飲み会に二の足を踏むとか大人の矛盾が絶好調←
— しゅが〜ロール🌺☕️ (@sugarroll666) 2021年12月16日
大人って…ってやつですよね(ˉ ˘ ˉ; )
今日もミラ付き合ってくれてありがと🥰
— しゅが〜ロール🌺☕️ (@sugarroll666) 2021年12月16日
エモラン始まったみたいで早速お着替えさせてもらいました(*ˊᗜˋ*)♡
みんないつもありがと⸜(๑’ᵕ’๑)⸝
明日からコレです♪走ります😤
またね♪(´ᵕ｀๑)۶⁾⁾おやすみぃ pic.twitter.com/QxfYCJdIYi
いっぱいありがと💕女子会✨ pic.twitter.com/oGF6izZb5g
— しゅが〜ロール🌺☕️ (@sugarroll666) 2021年12月16日
本当にいつもありがと🥰男子会❣️ pic.twitter.com/WfXnlSY6s7
— しゅが〜ロール🌺☕️ (@sugarroll666) 2021年12月16日
新しいイベントが始まったみたいで、早速ギフトを投げてくれて始まってすぐにお着替えできました(*ˊᗜˋ*)♡
本当にみんなの愛が盛り盛りでありがたいです。あったかい( ⑉¯ ꇴ ¯⑉ )ありがとう
みんながくれたこの衣装で明日からエモラン走ります( *˙ω˙*)و
( ⸝⸝•ᴗ•⸝⸝ )੭⁾⁾