niconico Video Search Result Borders

Adds borders to each video in the search result page as a throwback design.

/* ==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.1.0
@license        MPL-2.0
@contributionURL https://www.amazon.co.jp/registry/wishlist/E7PJ5C3K7AM2
@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 > .list {
		display: flex;
		flex-wrap: wrap;
	}
	
	/*------------------------------------
		style 39127 との互換処置
	*/
	/*[[borders]]*/ .container .inner,
	/*[[borders]]*/ .container.column700-300 .main,
	/*[[borders]]*/ .container .video {
		max-width: 1040px !important;
	}
	
	/*------------------------------------
		動画
	*/
	/*[[borders]]*/ .video > .list > .item {
		overflow: hidden !important;
		background: #E6E6E6 !important;
		border: solid 1px #CCCCCC !important;
		padding: 5px !important;
	}
	
	/*------------------------------------
		2列表示、4列表示
	*/
	/*[[borders]]*/ .video.videoList01 > .list > .item:nth-child(n),
	/*[[borders]]*/ .video:not(.videoList01) > .list > .item:nth-child(n) {
		margin-right: 8px !important;
		margin-bottom: 8px !important;
	}
	
	/*------------------------------------
		ログイン前に表示される定番動画
	*/
	/*[[borders]]*/ .teibanVideos > .video:not(.videoList01):not(.videoList02) > .list > .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;
	}
}