Greasy Fork is available in English.

ピクトセンス 七六八

『ピクトセンス』において、表示領域の高さが小さい場合でも、必要な情報が表示領域内に入るようにします。

このスクリプトの質問や評価の投稿はこちら通報はこちらへお寄せください。
/* ==UserStyle==
@name           ピクトセンス 七六八
@description    『ピクトセンス』において、表示領域の高さが小さい場合でも、必要な情報が表示領域内に入るようにします。
@namespace      https://greasyfork.org/users/137
@version        2.0.1
@license        CC-BY-4.0
@contributionURL https://www.amazon.co.jp/registry/wishlist/E7PJ5C3K7AM2
@compatible     Edge
@compatible     Firefox 推奨 (Recommended)
@compatible     Opera
@compatible     Chrome
@author         100の人
@homepageURL    https://greasyfork.org/users/137
==/UserStyle== */

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

@-moz-document domain("pictsense.com") {
	/*------------------------------------
		ページ全体
	*/
	#base {
		display: inline-block;
		width: auto !important;
		min-width: 825px !important;    /* 全体の初期幅 */
		margin-left: 175px !important;  /* 左側の広告の幅 */
		margin-right: 175px !important; /* 右側の広告の幅 */
	}
	#gameScreen {
		/* 入室後のページ */
		width: 100vw !important;
		max-width: 1450px !important;   /* キャンバス・パレットの幅 + 全体の初期幅 */
		margin-top: 45px !important;    /* 各設定ボタンの高さ */
		position: relative !important;
		/* 人数が増えた時に参加者名が広告に隠れないように */
		z-index: 1;
	}
	#gameScreen::after {
		/* clearfix */
		content: "";
		display: block;
		clear: both;
	}

	/*------------------------------------
		設定
	*/
	#messageScrollModeSelect,
	#roomDataButton,
	#muteButton,
	#tweetButton,
	#leaveButton,
	#joinButton,
	#gameStartButton {
		position: absolute;
		top: -45px;             /* -(各設定ボタンの高さ) */
	}
	#messageScrollModeSelect {
		/* コメントのマーキーに関する設定 */
		left: 0;
	}
	#roomDataButton {
		/* 「部屋情報」ボタン */
		left: 150px;            /* ボタンの幅 */
		margin-top: 5px !important;
	}
	#muteButton {
		/* 「音声ミュート」ボタン */
		left: 300px;            /* ボタンの幅×2 */
	}
	#tweetButton {
		/* 「部屋をツイート」ボタン */
		left: 450px;            /* ボタンの幅×3 */
	}
	#leaveButton {
		/* 「退室」ボタン */
		left: 600px;            /* ボタンの幅×4 */
	}
	#joinButton,
	#gameStartButton {
		/* 「ゲームに参加する」、または「ゲームスタート」ボタン */
		left: 800px;            /* ボタンの幅×4 + 左マージン */
		margin-top: 5px !important;
	}
	#gameStart > p {
		/* 「ゲームスタート」ボタンの説明文 */
		display: none;
	}

	/*------------------------------------
		残り時間とお題
	*/
	#gameScreenTitle {
		max-width: 825px;       /* 全体の初期幅 */
		position: absolute !important;
		left: 625px;            /* キャンバス・パレットの幅 */
		right: 30px;            /* スクロールバーの幅 */
		text-align: left;
	}
	#countDown {
		/* 残り時間 */
		margin-left: 10px;
		text-align: center;
	}

	/*------------------------------------
		チャット
	*/
	#chatField {
		width: auto !important;
		max-width: 824px;       /* 全体の初期幅 */
		position: absolute;
		top: 42px;              /* お題の高さ */
		left: 625px;            /* キャンバス・パレットの幅 */
		right: 30px;            /* スクロールバーの幅 */
	}

	/*------------------------------------
		コメント送信フォーム
	*/
	#chatForm {
		padding-left: 10px !important;
		text-align: left;
	}
	#chatText {
		/* コメント入力欄 */
		max-width: calc(100% - 100px);  /* コメント送信フォームの幅 - 「回答/発言」ボタンの幅 */
	}
	#chatSubmitButton {
		/* 「回答/発言」ボタン */
		width: auto !important;
	}

	/*------------------------------------
		参加者数・閲覧者数
	*/
	#userListField > h2 {
		position: absolute;
		left: 625px;
		top: 300px;
	}

	/*------------------------------------
		参加者一覧
	*/
	#userList {
		width: auto !important;
		display: block;
		max-width: 825px;       /* 全体の初期幅 */
		position: absolute;
		top: 320px;             /* お題の高さ + チャット欄の高さ + count height */
		left: 625px;            /* キャンバス・パレットの幅 */
		right: 30px;            /* スクロールバーの幅 */
		margin-left: 0 !important;
		border: none !important;
		text-align: left;
	}
	#userList tbody {
		display: block;
	}
	#userList tr {
		/* 参加者 */
		width: 200px;           /* 右カラムの初期幅 */
		display: inline-table;
		margin-right: 4px !important;
		margin-bottom: 4px !important;
	}
}