Skip to content

ニコニコ動画(Re)動画ページダークテーマ by watanuki-azuma

Screenshot of ニコニコ動画(Re)動画ページダークテーマ

Details

Authorwatanuki-azuma

LicenseCC0 1.0

Categorynicovideo

Created

Updated

Size43 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

最新版は1.5.0です 更新が遅くなりがちなので統合版の利用をおすすめしています。

1.5.0にて大きな変更を行いました。

・Stylus(CSS言語)に置き換え

今までは通常のCSSに加えカスタマイズ機能のためにUSOという記法を利用していましたがStylusに置き換えました。

・一部カスタマイズの削除

Stylus化に伴い一部カスタマイズを削除しました。

廃止されたカスタマイズは
・シリーズ削除
・かんたんコメントエリア削除
・動画コントロールボタンのフラット化

の3つになります。

・カスタマイズ選択欄が英語表記に

Stylusの仕様なのか選択肢に日本語を入れると機能しなくなるようなので仕方なく英語表記に変更しました。

USO記法は流用しづらくカスタマイズに大型なものを入れることができないという難点を抱えていたため既存の記述を流用可能でかつマイページダークテーマで行っているような他作者様のCSSを丸ごとオンオフできるような機能を実現するために切り替えました。

一部カスタマイズの削除および設定のリセットで不便をかけますが安定した更新を続けるためにご理解ください。

また問題があればTwitter(@Quantzuma)か統合版のレビューに書いておいてください。

--説明--

邪ンヌ(復讐者)さんが公開されているNicoVideo Dark Theme for HTML5 & FLASH(ニコニコ動画)の更新版です。
上記CSSから現在使用されていないであろう記述を削除し新要素に対応しています。
もとになっているCSS通り動画部分を上に移動することでスクロールすることなく動画視聴が可能になっています。

インストール後スタイル管理画面のスタイル名右にある歯車アイコンからカスタマイズ機能を利用することができます。
利用可能なカスタマイズについては以下に記載しています。

また、この場を借りまして、オリジナルの製作者様に感謝申し上げます。

--カスタマイズ機能解説--

インストール後スタイル管理画面にてスタイル名横にある歯車アイコンからカスタマイズ機能の管理が可能です。
以下に本スタイルで利用可能なカスタマイズ機能の解説を記載します。

・広告

広告を見た目だけ見えなくしたりする機能です。通信自体を止めて軽量化とかはしてません。あくまで視覚的な効果だけです。

[いる](デフォルト)→広告が見える状態です。一応デフォルトにしています。
[いらない]→広告が見えなくなります。広告があった部分は自動的に詰められます。
[ボトムコンテナーごと消す(非推奨)]→ニコニ広告、コンテンツツリー、市場等があるエリアも同時に消します。あまり推奨していません。

・かんたんコメントエリア

かんたんコメントエリアの表示非表示を管理します。

[非表示](デフォルト)→かんたんコメントが嫌いなのでデフォルトにしています。消す機能がニコニコ本体にあることは知っていますが嫌いなので消します。
[表示]→表示します。

・動画コントロールボタンのフラット化

[する](デフォルト)→デフォルトのままです。このままでいいと思います。
[しない]→ボタンがわかりやすくなります。

・固定大の横幅を設定(廃止)-コメントパネルの横幅を設定

固定大における横幅を設定することができます。縦幅は自動的に設定されます。設定可能な値は854px~3840pxです。
それ以外の値は最大または最小値のどちらかに近い方に設定されます。たぶん。

コメントパネルの横幅も同様です。

・ニコる

ニコるの表示非表示を管理します。

[いる](デフォルト]→はい。
[いらない]→ニコる数に応じたコメント背景色の変化を無効化しニコる欄を確か消します(うろ覚え)。

・シリーズ

シリーズ欄の表示非表示を管理します。

[いる](デフォルト)→そのままです。
[いらない]→消えます。

・[実験的]シリーズを動画説明欄と並べる

シリーズ欄が動画説明文の下にあるのはどうなんだろうと思ってつけました。便利だと思ったら使って見てください。

[する]→なんとも言えない場所にシリーズ欄を移動します。だいたい動画説明文の右隣ですが高さが微妙です。(廃止)
[する(上の方)]→シリーズ欄を動画説明欄の最上部と同じ高さに並べます。ウィンドウのサイズによってはデザインが崩れる可能性があります。
[しない](デフォルト)→何もしません、合わなかったらこれにしましょう。

・マーキーエリア

プレ垢限定機能らしいです。

[いる](デフォルト)→なくすとデザイン的にしっくりこなかったのでデフォルトにしています。
[いらない]→プレ垢じゃないけどマーキーエリアは消したい人向けです。

・シリーズ欄をハイライト

シリーズ欄の見やすさを調整しています。

[する](デフォルト)→シリーズ欄を見やすくします。が配色があってるのかどうかよくわかりません。
[しない]→見づらいです。

・ニコるランクの色

ニコられた数に応じてコメント背景色が変化するのでそれを暗い背景色でも浮かないような色にしていますが自由に変えられるので合わなかったりしたら変えてください。

・動画コントロールボタンホバー時の色

動画コントロールボタンにホバーすると色が変わりますがその色を変えられるようにしています。

・動画ボリュームバーとシークバーの色

動画ボリュームバーとシークバー(進行したところまで)の色を変えられるようにしています。

・要素の再配置

従来配置とデフォルトの順番を入れ替えた状態と切り替えられます。

・自動設定の拡大サイズをより大きく

1440810pxまで拡大されるようになっている自動設定を19201080pxまで拡大されるようにする設定です。
画面サイズ 固定大のサイズを任意に設定とは競合しますので併用しないでください。

・コメント送りをスムーズスクロール化

コメント送りをスムーズスクロール化します。

Notes

2022-01-13 1.5.0 Stylu記法に切り替え、統合版に先行していた記述の反映
2021-10-17 1.4.0 統合版に先行して追加されていた記述の反映
2021-09-19 1.3.0 統合版に先行して追加されていた記述の反映
2021-09-10 1.2.0 統合版に先行して追加されていた記述を反映しました
2021-08-28 1.1.5 反映忘れとWQHD解像度向けに動画部分をより大きいサイズで利用できるカスタマイズを追加しました。
2021-08-18 1.1.4 ヘッダーメニューのホバー時の表示を修正しました。また本CSS導入時にhttps://nicovideo.jp/から始まるすべてのサイトでヘッダーメニューの表示が変更されるようになりました。視聴ページだけにしたい方はスラッシュ以下にwatchを追加してください。
2021-08-18 1.1.3 カスタマイズ[ボトムコンテナーごと消す]において通常の広告除去が行われない状態になっていたので修正。カスタマイズ[実験的 シリーズを動画説明欄と並べる]を追加 シリーズを動画説明欄と並べることで無駄なスペースを減らす目的です。一度動画説明欄を閉じると再度ページを開くまでは元の状態に戻るためご注意ください。
2021-08-16 1.1.0 ヘッダーメニューの修正、広告表示をデフォルトに変更、ボトムコンテナーを復活させ市場やコンテンツツリーを確認できるようにしました。カスタマイズ機能に広告表示(デフォルト)、広告のみ除去(ニコニ広告除く)、ボトムコンテナーごと除去のカスタマイズを追加しました。
2021-08-16 1.0.0 userstyles.worldに移管しました。コメント欄のコンテキストメニューの背景色を修正しました。

Source code

Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link.
/* ==UserStyle==
@name           ニコニコ動画(Re) 動画ページダークテーマ Stylus版
@namespace      nicovideo.jp
@version        1.5.0
@description    ニコニコ動画の動画ページをダークテーマ化
@author         Azuma

@preprocessor	stylus

@var text Setplayerpanel "コメントエリアの横幅を設定(単位px 307px未満に設定しないでください)" "384"

@var text SetSelectedSize "動画再生ボタンの判定を拡大 動画プレイヤーのサイズを入力" "1440"

@var text SetFitPlayerButton "[動画][実験的]動画再生停止ボタンをプレイヤーを覆うようにする(プレイヤーサイズを入力)" "0" 

@var select AdDouga "[動画ページ]広告"[
	"Enable",
	"Disable"
]

@var select DisableButtomContainer "[動画ページ][広告除去補助]ボトムコンテナーを消す(非推奨)"[
	"Disable",
	"Enable"
]


@var select ExtendedMoviePlayer "自動設定の拡大サイズをより大きく(1920x1080)"[
	"Enable",
	"Disable"
]

@var select MoveVideoContainer "[動画ページ]要素の再配置(動画プレイヤーを上に移動)"[
	"Enable",
	"Disable"
]

@var select HiddenSeekbar "[動画ページ]シークバーを自動的に隠す(ホバーで表示)"[
	"Disable",
	"Enable",
	"Advance-Video_control_buttons_together"
]

@var select Nicoru "[動画ページ]ニコる"[
	"Enable",
	"Disable"
]

@var select MoveSeries "[実験的 動画ページ]シリーズを動画説明欄と並べる"[
	"Disable",
	"Enable"
]


@var select SmoothComment "コメントのスムーズスクロール化"[
	"Disable",
	"Enable"
]

@var select MarqueeArea "マーキーエリアの表示"[
	"Enable",
	"Disable"
]

@var color NicoruRank1 "ニコるランク1の色(1~2)" #7f68ca
@var color NicoruRank2 "ニコるランク2の色(3~5)" #6b2ca0
@var color NicoruRank3 "ニコるランク3の色(6~8)" #561b92
@var color NicoruRank4 "ニコるランク4の色(9以上)" #9b0eb0

@var color CtrlButtonHoverColor "[動画ページ]動画コントロールボタンホバー時の色" #007CFF
@var color VolumeSeekBarColor "[動画ページ]動画ボリュームバーとシークバーの色" #007CFF

==/UserStyle== */

@-moz-document domain("nicovideo.jp") {
	/* ヘッダーメニュー */
	div#CommonHeader.CommonHeader .nico-CommonHeaderRoot > div > div > div > div > div > div > div > a[href*="header_service"],
	div#CommonHeader.CommonHeader .nico-CommonHeaderRoot > div > div > div > div > div > div > a[href*="header_service"],
	#CommonHeader > div > div > div > div > div > div > div > div > a > div {
		background-color: #666
	}
	div#CommonHeader.CommonHeader .nico-CommonHeaderRoot > div > div > div > div > div > div > div > a[href*="header_service"]:hover,
	div#CommonHeader.CommonHeader .nico-CommonHeaderRoot > div > div > div > div > div > div > a[href*="header_service"]:hover,
	#CommonHeader > div > div > div > div > div > div > div > div > a > div:hover {
		background-color: #2b2b2b !important
	}
	div#CommonHeader.CommonHeader .nico-CommonHeaderRoot > div > div > div > div > div > div > div > a[href*="header_service"] > div,
	div#CommonHeader.CommonHeader .nico-CommonHeaderRoot > div > div > div > div > div > div > a[href*="header_service"],
	#CommonHeader > div > div > div > div > div > div > div > div > a > div > div {
		color: #eee
	}

	#CommonHeader > div > div > div > div > div > div > div > div > div > a:nth-child(n) > div,
	#CommonHeader > div > div > div > div > div > div > div > div > div:nth-child(2) > label > span,
	#CommonHeader > div > div > div > div > div > div > div > div > div > div:nth-child(n) > a > div,
	#CommonHeader > div > div > div > div > div > div > div > div > div {
		color: #eee
	}

	#CommonHeader > div > div > div > div > div > div > div > div > div > a:nth-child(n),
	#CommonHeader > div > div > div > div > div > div > div > div,
	#CommonHeader > div > div > div > div > div > div > div > div > div:nth-child(2) > label,
	#CommonHeader > div > div > div > div > div > div > div,
	#CommonHeader > div > div > div > div > div > div > div > div > div > div:nth-child(n) {
		background-color: #666
	}
	#CommonHeader > div > div > div > div > div > div > div > div > div > a:nth-child(n):hover,
	#CommonHeader > div > div > div > div > div > div > div > div > div:nth-child(2) > label:hover,
	#CommonHeader > div > div > div > div > div > div > div > a:hover {
		background-color: #2b2b2b
	}
}

@-moz-document url-prefix("https://www.nicovideo.jp/video_top") {

	/* 動画トップ */
	.NicovideoLogo[data-color="black"] {
		background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M96.070679,23.740631 L83.4340667,23.740631 C82.0751344,23.740631 80.9736585,22.6233677 80.9736585,21.2462192 C80.9736585,19.8678563 82.0751344,18.750593 83.4340667,18.750593 L94.840475,18.750593 C96.2431262,18.750593 97.0531421,17.9630438 97.0531421,16.506351 L97.0531421,8.77112421 C97.0531421,7.39822619 96.1599387,6.52627504 94.840475,6.52627504 L83.4340667,6.52627504 C82.0751344,6.52627504 80.9736585,5.40961894 80.9736585,4.03186326 C80.9736585,2.65350037 82.0751344,1.53684426 83.4340667,1.53684426 L96.070679,1.53684426 C99.3253157,1.53684426 101.974566,4.22191946 101.974566,7.52331111 L101.974566,17.7535569 C101.974566,21.0549486 99.3253157,23.740631 96.070679,23.740631 M72.8716779,23.740631 L56.5153073,23.740631 C55.1569823,23.740631 54.0555064,22.6233677 54.0555064,21.2462192 C54.0555064,19.8678563 55.1569823,18.750593 56.5153073,18.750593 L72.8716779,18.750593 C74.2306101,18.750593 75.3326932,19.8678563 75.3326932,21.2462192 C75.3326932,22.6233677 74.2306101,23.740631 72.8716779,23.740631 M72.6385099,6.83048641 L56.7484753,6.83048641 C55.3895431,6.83048641 54.28746,5.7132231 54.28746,4.33546742 C54.28746,2.95771174 55.3895431,1.84044842 56.7484753,1.84044842 L72.6385099,1.84044842 C73.9974421,1.84044842 75.0995252,2.95771174 75.0995252,4.33546742 C75.0995252,5.7132231 73.9974421,6.83048641 72.6385099,6.83048641 M42.0157798,23.740631 L29.3791674,23.740631 C28.0208424,23.740631 26.9187593,22.6233677 26.9187593,21.2462192 C26.9187593,19.8678563 28.0208424,18.750593 29.3791674,18.750593 L40.7849686,18.750593 C42.188227,18.750593 42.9988501,17.9630438 42.9988501,16.506351 L42.9988501,8.77112421 C42.9988501,7.39822619 42.1056467,6.52627504 40.7849686,6.52627504 L29.3791674,6.52627504 C28.0208424,6.52627504 26.9187593,5.40961894 26.9187593,4.03186326 C26.9187593,2.65350037 28.0208424,1.53684426 29.3791674,1.53684426 L42.0157798,1.53684426 C45.2710236,1.53684426 47.9196663,4.22191946 47.9196663,7.52331111 L47.9196663,17.7535569 C47.9196663,21.0549486 45.2710236,23.740631 42.0157798,23.740631 M18.8167787,23.740631 L2.46101533,23.740631 C1.1020831,23.740631 -1.42108547e-13,22.6233677 -1.42108547e-13,21.2462192 C-1.42108547e-13,19.8678563 1.1020831,18.750593 2.46101533,18.750593 L18.8167787,18.750593 C20.1757109,18.750593 21.2771868,19.8678563 21.2771868,21.2462192 C21.2771868,22.6233677 20.1757109,23.740631 18.8167787,23.740631 M18.5842179,6.83048641 L2.69418332,6.83048641 C1.33464389,6.83048641 0.233167996,5.7132231 0.233167996,4.33546742 C0.233167996,2.95771174 1.33464389,1.84044842 2.69418332,1.84044842 L18.5842179,1.84044842 C19.9425429,1.84044842 21.0440188,2.95771174 21.0440188,4.33546742 C21.0440188,5.7132231 19.9425429,6.83048641 18.5842179,6.83048641 M117.789306,10.6382898 L117.789306,11.0967321 L115.793413,11.0967321 L115.793413,10.0869446 L117.297468,10.0869446 C117.588928,10.0869446 117.789306,10.2818585 117.789306,10.6382898 M117.208208,13.877139 L115.793413,13.877139 L115.793413,12.8667443 L117.789306,12.8667443 L117.789306,13.3282227 C117.789306,13.6646161 117.61443,13.877139 117.208208,13.877139 M110.946676,13.349475 L110.946676,12.8667443 L113.047009,12.8667443 L113.047009,13.877139 L111.544169,13.877139 C111.192595,13.877139 110.946676,13.6646161 110.946676,13.349475 M111.453087,10.0869446 L113.047009,10.0869446 L113.047009,11.0967321 L110.946676,11.0967321 L110.946676,10.7202629 C110.946676,10.3516875 111.147662,10.0869446 111.453087,10.0869446 M126.621151,3.84119984 L124.963473,3.84119984 L124.963473,1.52591451 C124.963473,0.683109362 124.280363,7.10542736e-15 123.437558,7.10542736e-15 C122.59536,7.10542736e-15 121.912251,0.683109362 121.912251,1.52591451 L121.912251,3.84119984 L115.945822,3.84119984 L115.945822,2.89941974 L119.283039,2.89941974 C120.041442,2.89941974 120.655937,2.28431771 120.655937,1.52591451 C120.655937,0.767511319 120.041442,0.152409289 119.283039,0.152409289 L109.924744,0.152409289 C109.166341,0.152409289 108.551846,0.767511319 108.551846,1.52591451 C108.551846,2.28431771 109.166341,2.89941974 109.924744,2.89941974 L112.8946,2.89941974 L112.8946,3.84119984 L109.997002,3.84119984 C109.15359,3.84119984 108.47048,4.52430921 108.47048,5.36711436 C108.47048,6.2093123 109.15359,6.89242166 109.997002,6.89242166 L112.8946,6.89242166 L112.8946,7.81537831 L110.335824,7.81537831 C109.291426,7.81537831 108.1942,8.49423721 108.1942,9.81430811 L108.1942,14.2408568 C108.1942,15.1164512 109.144481,16.1632783 110.335824,16.1632783 L112.8946,16.1632783 L112.8946,17.0564818 L109.763834,17.0564818 C109.089225,17.0564818 108.542738,17.6035765 108.542738,18.2775777 C108.542738,18.9515789 109.089225,19.4980664 109.763834,19.4980664 L112.8946,19.4980664 L112.8946,20.502389 L109.763834,20.502389 C108.920422,20.502389 108.237312,21.1854983 108.237312,22.0283035 C108.237312,22.8705014 108.920422,23.5536108 109.763834,23.5536108 L119.077802,23.5536108 C119.920608,23.5536108 120.603717,22.8705014 120.603717,22.0283035 C120.603717,21.1854983 119.920608,20.502389 119.077802,20.502389 L115.945822,20.502389 L115.945822,19.4980664 L119.283039,19.4980664 C119.95704,19.4980664 120.503528,18.9515789 120.503528,18.2775777 C120.503528,17.6035765 119.95704,17.0564818 119.283039,17.0564818 L115.945822,17.0564818 L115.945822,16.1632783 L118.210102,16.1632783 C119.445771,16.1632783 120.58125,15.4400932 120.58125,14.095734 L120.58125,9.87624335 C120.58125,8.72922683 119.710513,7.81537831 118.570783,7.81537831 L115.945822,7.81537831 L115.945822,6.89242166 L121.912251,6.89242166 L121.912251,17.4778843 C121.912251,18.3200823 122.59536,19.0037988 123.437558,19.0037988 C124.280363,19.0037988 124.963473,18.3200823 124.963473,17.4778843 L124.963473,6.89242166 L126.621151,6.89242166 C126.969689,6.89242166 127.042554,7.21727811 127.042554,7.48930744 C127.042554,8.16938076 127.024338,11.0754798 127.005514,13.9141787 C126.988512,16.6338648 126.971511,19.3960554 126.971511,19.9899052 C126.971511,20.6207946 126.217965,20.6894091 125.894323,20.689...

Reviews

No reviews yet.