Greasy Fork is available in English.

ニコニコ動画(9) 検索結果に枠

ニコニコ動画の検索結果などを、枠があった頃のデザインに変更します。

このスクリプトの質問や評価の投稿はこちら通報はこちらへお寄せください。
/* ==UserStyle==
@name           niconico Video Search Result Borders 
@name:ja        ニコニコ動画(9) 検索結果に枠
@description    Adds borders to each video in the search result page as a throwback design.
@description:ja ニコニコ動画の検索結果などを、枠があった頃のデザインに変更します。
@namespace      https://greasyfork.org/users/137
@version        3.2.0
@license        MPL-2.0
@contributionURL https://github.com/sponsors/esperecyan
@compatible     Edge
@compatible     Firefox 推奨 (Recommended)
@compatible     Opera
@compatible     Chrome
@preprocessor   uso
@var            select borders "枠の表示 (Show borders)" {
	"表示する (Show)*": "",
	"表示しない (Not show)": "dummy"
}
@var            select harajuku "デザイン (Design)" {
	"原宿バージョン (Harajuku version)*": "",
	"そのまま (Not change)": "dummy"
}
@author         100の人
@homepageURL    https://greasyfork.org/scripts/412460
==/UserStyle== */

@namespace url(http://www.w3.org/1999/xhtml);

/* GINZAバージョン */
@-moz-document
		url-prefix("https://www.nicovideo.jp/search/"),
		url-prefix("https://www.nicovideo.jp/tag/") {
	/*====================================
		GINZAバージョンのサムネイルの修正
	*/
	/*------------------------------------
		動画情報の左カラム
	*/
	.video .item > div:first-of-type {
		width: 134px;
	}
	
	/*------------------------------------
		ラッパー
	*/
	.video .item .itemThumbBox {
		width: auto; /* 4列表示 */
		height: 104px;
	}
	.video .item .itemThumb {
		display: block;
		width: auto;
		height: 100%;
	}
	
	/*------------------------------------
		リンク
	*/
	.video .item .itemThumb .itemThumbWrap {
		display: flex;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: solid 2px #393F3F;
		overflow: hidden;
		justify-content: center;
	}
	
	/*------------------------------------
		画像
	*/
	.video .item .itemThumb .noImage {
		/* 遅延読み込み前 */
		height: 100%;
		max-height: initial !important;
	}
	.video .item .itemThumb .thumb {
		/* 320px (240px) × 180px */
		width: auto !important;
		max-height: initial !important;
	}
	
	/*------------------------------------
		サムネイルの特殊枠
	*/
	.video .item .itemThumbWrap::before {
		width: 100%;
		height: 100%;
		background-size: 100% 100%;
	}

	/*------------------------------------
		4列表示の投稿日時
	*/
	.video .item .itemTime {
		white-space: nowrap !important;
	}
	
	
	
	/*====================================
		GINZAバージョン
	*/
	/*------------------------------------
		リスト
	*/
	/*[[borders]]*/ .video > .videoListInner {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
		justify-content: unset;
	}
	
	/*------------------------------------
		style 39127 との互換処置
	*/
	/*[[borders]]*/ .container .inner,
	/*[[borders]]*/ .container.column700-300 .main,
	/*[[borders]]*/ .container .video {
		max-width: 1040px !important;
	}
	
	/*------------------------------------
		動画
	*/
	/*[[borders]]*/ .video > .videoListInner > .item {
		overflow: hidden !important;
		background: #E6E6E6 !important;
		border: solid 1px #CCCCCC !important;
		padding: 5px !important;
	}
	
	/*------------------------------------
		2列表示、4列表示
	*/
	/*[[borders]]*/ .video.videoList01 > .videoListInner > .item:nth-child(n),
	/*[[borders]]*/ .video:not(.videoList01) > .videoListInner > .item:nth-child(n) {
		margin-bottom: 0 !important;
	}
	
	/*------------------------------------
		ログイン前に表示される定番動画
	*/
	/*[[borders]]*/ .teibanVideos > .video:not(.videoList01):not(.videoList02) > .videoListInner > .item {
		height: 170px !important;
	}
	
	/*------------------------------------
		コメント
	*/
	/*[[borders]]*/ .video .itemComment {
		border-color: #C8C8C8 !important;
		background: #F5F5F5 !important;
	}
	
	
	
	/*====================================
		GINZAバージョンのデザインを原宿バージョンに
	*/
	/*------------------------------------
		投稿日時
	*/
	/*[[harajuku]]*/ .video .item .itemTime .time:not(.new) {
		font-weight: bold !important;
		color: #393F3F !important;
	}
	
	/*------------------------------------
		2列表示の再生時間
	*/
	/*[[harajuku]]*/ .video.videoList02 .item .itemTime {
		white-space: nowrap !important;
		position: absolute !important;
		left: 147px !important;
	}

	/*------------------------------------
		2列表示の有料
	*/
	/*[[harajuku]]*/ .video.videoList02 .item .iconPayment {
		left: 290px;
		right: unset;
		white-space: nowrap;
	}
	
	/*------------------------------------
		再生時間
	*/
	/*[[harajuku]]*/ .video .videoLength {
		font-weight: bold !important;
		right: 0 !important;
		bottom: 0 !important;
	}
	
	/*------------------------------------
		再生数等の情報
	*/
	/*[[harajuku]]*/ .video .itemData .count {
		color: #393F3F !important;
	}
	/*[[harajuku]]*/ .video .itemData .value::before {
		content: ":" !important;
		font-weight: normal !important;
	}
	/*[[harajuku]]*/ .video .itemData .value {
		font-weight: bold !important;
	}
	
	/*------------------------------------
		タイトル
	*/
	/*[[harajuku]]*/ .video .itemTitle a {
		text-decoration: underline !important;
	}
	
	/*------------------------------------
		コメント
	*/
	/*[[harajuku]]*/ .video .itemComment {
		font-weight: normal !important;
		border: solid 1px #999F9F !important;
		border-radius: 0 !important;
	}
}



/*====================================
	原宿バージョン
*/
@-moz-document
		url-prefix("https://www.nicovideo.jp/recommendations"),
		url-prefix("https://www.nicovideo.jp/recent"),
		url-prefix("https://www.nicovideo.jp/newarrival"),
		url-prefix("https://www.nicovideo.jp/hotlist") {
	/*[[harajuku]]*/ .rec_movlist,
	/*[[harajuku]]*/ .content_672 > div[style*="624px"] {
		width: auto !important;
		padding-left: 4px !important;
		padding-right: 0 !important;
		margin-right: -10px !important;
	}
	/*[[harajuku]]*/ .rec_movlist > li,
	/*[[harajuku]]*/ .content_672 .thumb_col_1,
	/*[[harajuku]]*/ .content_672 .thumb_col_2,
	/*[[harajuku]]*/ .content_672 .thumb_col_4 {
		overflow: hidden !important;
		background: #F7F7F7 !important;
		border: solid 1px #CCCCCC !important;
		margin-right: 3px !important;
	}
	.rec_movlist > li {
		padding: 1px;
	}
	
	/*------------------------------------
		オススメ動画
	*/
	/*[[harajuku]]*/ .rec_movlist {
		display: flex;
	}
	/*[[harajuku]]*/ .rec_movlist > li {
	}
	/*[[harajuku]]*/ .tag_title {
		display: none;
	}
	/*[[harajuku]]*/ .rec_tag {
		clear: left;
	}
	/*[[harajuku]]*/ .rec_movlist .update {
		color: #696F6F !important;
	}
	/*[[harajuku]]*/ .rec_movlist .update strong {
		color: #393F3F;
	}
	
	/*------------------------------------
		1列表示
	*/
	/*[[harajuku]]*/ .content_672 .thumb_col_1 {
		width: auto !important;
	}
	/*[[harajuku]]*/ .content_672 .thumb_col_1 td {
		background: transparent !important;
	}
	
	/*------------------------------------
		2列表示
	*/
	/*[[harajuku]]*/ .content_672 .thumb_col_2 {
		width: 318px !important;
		height: 154px !important;
	}
	
	/*------------------------------------
		4列表示
	*/
	/*[[harajuku]]*/ .content_672 .thumb_col_4 { 
		width: 152px !important;
		height: 232px !important;
	}
}