onairpage.css

/* コメントエリアの一番外側要素 *//* 透明にする 透明度は右の数字を0-1の間で opacityで指定すると子要素まで透明になってコメントが見づらい*/
/*
[class^="TVContainer__right-comment-area___"]{
    background: rgba(255, 255, 255, 0.2);
}
*/
 /* コメントエリア内のdiv,form要素 */
/*
[class^="TVContainer__right-comment-area___"] div,[class^="TVContainer__right-comment-area___"] form{
    background: rgba(255, 255, 255, 0);完全透明
}
*/
/* コメントフォーム */
/*
[class^="TVContainer__right-comment-area___"] > div > form[class*="styles__comment-form___"] > div{
    background: rgba(255, 255, 255, 0.4);
    z-index: 20;
}
*/
/*テキストボックス*/
/*
[class*="styles__comment-form___"] textarea {
    opacity: 0.5;
}
*/
/* コメント本文 *//* コメントの文字色 *//*コメントの縁取り 4つのblackを好きな色にすると縁の色を変更できます。 */
/*
[class^="TVContainer__right-comment-area___"] [class^="styles__message___"] {
    color: white;
    font-weight: bold;
    text-shadow: black 1px 1px 0px, black -1px 1px 0px, black 1px -1px 0px, black -1px -1px 0px;
    opacity: 0.8;
    float: left;
}
*/
/* コメント時間 */
/*
[class^="styles__time___"] {
    color: black;
    float: right;
}
[class*="styles__comment-list-wrapper___"] > div {
    overflow: auto;
}
*/
.movingComment {/* 横に流れるコメント */
    color: white;
    font-weight: bold;
    font-size: xx-large;
    white-space: nowrap;
    text-shadow: black 1px 1px 0px, black -1px 1px 0px, black 1px -1px 0px, black -1px -1px 0px;
    opacity: 0.8;
    left: 100%;
}
.movingCommentCSS {/* CSSで横に動かす */
    transition: left 16s linear;
    left: -100%;
}
.movingComment.selfComment {/* 自分のコメント */
    border-color: yellow;
    border-style: solid;
    border-width: 1px;
}
/* 黒帯パネル上下 onairpage.jsで設定
[class*="styles__footer___"] {
    opacity: 0.5;
}

[class*="styles__header___"] {
    opacity: 0.5;
}
*/
[class*="styles__balloon-"] { /* 緑色吹き出し非表示 */
    display:none;
}
/* 古いコメントを非表示 onairpage.jsで設定
[class^="TVContainer__right-comment-area___"] [class*="styles__comment-list-wrapper___"]>* {
    overflow: hidden!important;
}*/
/* コメント1行化用
[class^="TVContainer__right-comment-area___"] [class*="styles__comment-list-wrapper___"]>*>div {
    clear: both;
    padding: 1px 0px 1px 16px;
    border-top-color:rgba(255,255,255,0.5);
}
*/
body{
    overflow-x: hidden;/*コメント流したときにスクロールバーが出るのを防止*/
}
[class*="styles__continue-btn___"] { /* 新着コメのボタン */
/*    display:none;*/
    opacity: 0.5;
}
[class*="styles__side___"] button{ /* 画面右の番組表ボタンと番組移動ボタン */
    opacity:0.5;
    z-index:20;
}
[class*="styles__side___"] { /* 画面右の番組表ボタンと番組移動ボタンをコメント欄の上からクリックできるように */
    z-index:20;
}
#NGConfig { /*「AbemaTV, ニコニコ風コメントスクロール」ユーザースクリプトのNG設定画面　コメ欄とかぶらないように*/
    z-index: 20;
    opacity: 0.7;
}
.toast {
    z-index: 100;
    background-color: black;
    color: white;
    opacity: 0.8;
    border-radius: 20px;
    position: fixed;
    top: 30%;
    left: 50%;
    margin-left: -200px;
    width: 400px;
}
.toast p{
    margin: 10px;
}
/* 音量ゲージ下部の吹き出しを下へ伸ばす */
[class*="styles__footer___"] [class^="styles__volume___"] [class^="styles__slider-container___"]:after{
    border-top-width:15px;
}
/* その他メニューがコメ欄の下にくぐらないように */
[class*="Dropdown__column___"]{
    z-index: 15;
}
/* z-indexが効かない→音量とフルスクリーンボタンがコメ欄をくぐらないように 
[class*="styles__full-screen___"] *,[class*="styles__volume___"] *{
    z-index: 15;
}*/
/* 左下からpopしてくるボタンの処理
[class^="TVContainer__ad-reserve-button___"] {
    transform:translateX(-170px);
}
*/
/*視聴数を下へ*/
[class*="styles__view-counter___"] {
    opacity: 0.5;
    background-color: transparent;
}
/*通知登録ボタン*/
.addNotify {
    background-color: #fff;
    border: 1px solid orangered;
    border-radius: 2px;
    color: orangered;
    cursor: pointer;
    font-weight: 700;
    padding: 12px 0 10px;
    text-align: center;
    margin-top: 12px;
    margin-bottom: 12px;
}
.listAddNotifyWrapper .addNotify { /*検索結果と公式視聴予約一覧*/
    padding: 5px 0 4px;
    margin-left: 12px;
    margin-top: 0;
    width: 200px;
}
.addNotify:hover{
    opacity: 0.7;
}
/*通知登録済み番組背景*/
.registeredProgs [class*="style__status-future___"]{
    background-color:rgba(255,238,187,0.7);
}
.registeredProgs [class*="style__status-future___"]:hover{
    background-color:rgba(250,233,182,0.7);
}
/*チャンネル別番組表で番組の枠を広げたときに途中までしかスクロールできない問題に対応*/
[class*="styles__time-table___"] [class*="styles__col___1"] {
    overflow: visible;
}
/*視聴数*/
[class*="styles__view-counter___"] {
    transition: transform .5s cubic-bezier(.215,.61,.355,1),visibility .5s cubic-bezier(.215,.61,.355,1),-webkit-transform .5s cubic-bezier(.215,.61,.355,1);
    width: 100px; /* 要素の幅が不安定なので決め打ち 100という数字はonairpage.css中の視聴数位置調整でも使用 */
    padding-left: 0px;
    padding-right: 0px;
}