MediaWiki:Vector.css - 版の履歴

Mntone: MediaWiki 1.38同梱の構造に対応

2022-06-04T18:00:56Z

MediaWiki 1.38同梱の構造に対応

← 古い版		2022年6月5日 (日) 03:00時点における版
227行目:		227行目:
	border-right-width: 0;		border-right-width: 0;
	}		}
	#mw-head .vector-menu-dropdown h3 {		#mw-head .vector-menu-dropdown .vector-menu-heading {
	margin-right: 0;		margin-right: 0;
	background-image: none;		background-image: none;
	}		}
	.vector-menu-portal h3 {		.vector-menu-portal .vector-menu-heading {
	margin-left: 0;		margin-left: 0;
	}		}

Mntone: サイドバーを畳む用のスタイルを最適化

2021-10-06T06:39:05Z

サイドバーを畳む用のスタイルを最適化

@@ 296行目: / 296行目: @@
 		margin-left: 0;
 		border-left-width: 0;
+	}
 	.mw-sidebar-collapsed #p-logo {
@@ 322行目: / 326行目: @@
 		top: 6rem;
 		left: calc(10rem - 12px);
 		border: 1px solid #a7d7f9;
 		border-radius: 4px;
@@ 335行目: / 341行目: @@
 		top: calc(5rem - 12px);
 		left: 1rem;
 		width: 34px;
 		height: 22px;
@@ 341行目: / 349行目: @@
 	#mw-sidebar-collapsible-button:before { content: '‹'; }
 	.mw-sidebar-collapsed #mw-sidebar-collapsible-button:before { content: '›'; }
+}
 @media screen and (min-width: 982px) and (min-height: 440px) {

Mntone: スマートフォン向けのレスポンシブスタイルの最適化

2021-10-06T06:36:25Z

スマートフォン向けのレスポンシブスタイルの最適化

← 古い版		2021年10月6日 (水) 15:36時点における版
166行目:		166行目:
	top: -6px;		top: -6px;
	left: 6px;		left: 6px;
			left: calc(6px + constant(safe-area-inset-left));
			left: calc(6px + env(safe-area-inset-left));
	width: 60px;		width: 60px;
	height: 60px;		height: 60px;
192行目:		194行目:
	padding-left: 0;		padding-left: 0;
	}		}
			#left-navigation,
	#right-navigation {		#right-navigation {
	position: absolute;		position: absolute;
	top: inherit;		top: inherit;
	~~right: 0;~~
	~~margin-top: 0;~~
	}		}
	#left-navigation {		#left-navigation {
	~~position~~: ~~absolute~~;		left: constant(safe-area-inset-left);
	~~top~~: ~~inherit;~~		left: env(safe-area-inset-left);
	~~margin: 0;~~		margin-left: 0;
	}
	#p-~~namespaces,~~
	#p-~~views,~~
	#p-~~variants {~~
	~~position: relative~~;
	~~top: 2.5em;~~
	}
	~~#p-namespaces {~~
	~~padding~~-left: 0;
	}		}
			#right-navigation { right: 0 }
	#p-cactions {		#p-cactions {
	~~top: 2.5em;~~
	float: right;		float: right;
	}		}
	#p-search {		#p-search {
	position: absolute;		position: absolute;
			top: -2.5em;
	right: 6px;		right: 6px;
	width: calc(100vw - 78px);		width: calc(100vw - 78px);
228行目:		221行目:
	max-width: 360px;		max-width: 360px;
	}		}
			#left-navigation .vector-menu-tabs { padding-left: 0 }
	.vector-menu-dropdown .vector-menu-content {		.vector-menu-dropdown .vector-menu-content {
	left: inherit;		left: inherit;
243行目:		237行目:
	margin-left: 0;		margin-left: 0;
	}		}
	.mw-body {		.mw-body {
	/* Hide the 1px blue border on the left side */		margin-left: 0;
			border-left: 0; /* Hide the 1px blue border on the left side */
	~~border~~-left: 0;		padding-left: calc(1em + constant(safe-area-inset-left));
	~~margin~~-left: 0;		padding-left: calc(1em + env(safe-area-inset-left));
	}		}
	#mw-data-after-content {		#mw-data-after-content {
	margin-left: 0;		margin-left: 0;
	}		}
			#mw-navigation {
			margin-right: constant(safe-area-inset-right);
			margin-right: env(safe-area-inset-right);
			}
			#mw-navigation, .mw-footer {
			margin-left: constant(safe-area-inset-left);
			margin-left: env(safe-area-inset-left);
			}
	}		}
	@media screen and (max-width: 799px) and (any-pointer: coarse), screen and (max-height: 439px) and (any-pointer: coarse) {		@media screen and (max-width: 799px) and (any-pointer: coarse), screen and (max-height: 439px) and (any-pointer: coarse) {
258行目:		260行目:
	margin-right: 1em;		margin-right: 1em;
	font-size: 150%;		font-size: 150%;
	}
	}
	~~@supports (left: constant(safe-area-inset-left)) {~~
	~~@media screen and (max-width: 799px), screen and (max-height: 439px) {~~
	~~#mw-navigation {~~
	~~margin-left: constant(safe-area-inset-left);~~
	~~margin-right: constant(safe-area-inset-right);~~
	}
	~~#p-logo {~~
	~~left: calc(6px + constant(safe-area-inset-left));~~
	}
	~~.mw-footer {~~
	~~margin-left: constant(safe-area-inset-left);~~
	}
	~~#left-navigation {~~
	~~left: constant(safe-area-inset-left);~~
	}
	~~.mw-body {~~
	~~padding-left: calc(1em + constant(safe-area-inset-left));~~
	}
	}
	}
	~~@supports (left: env(safe-area-inset-left)) {~~
	~~@media screen and (max-width: 799px), screen and (max-height: 439px) {~~
	~~#mw-navigation {~~
	~~margin-left: env(safe-area-inset-left);~~
	~~margin-right: env(safe-area-inset-right);~~
	}
	~~#p-logo {~~
	~~left: calc(6px + env(safe-area-inset-left));~~
	}
	~~.mw-footer {~~
	~~margin-left: env(safe-area-inset-left);~~
	}
	~~#left-navigation {~~
	~~left: env(safe-area-inset-left);~~
	}
	~~.mw-body {~~
	~~padding-left: calc(1em + env(safe-area-inset-left));~~
	}
	}		}
	}		}

Mntone: 一部のスタイルが印刷に反映されていた問題の修正

2021-10-05T06:02:40Z

一部のスタイルが印刷に反映されていた問題の修正

← 古い版		2021年10月5日 (火) 15:02時点における版
51行目:		51行目:
	}		}
	@supports (top: constant(safe-area-inset-top)) {		@supports (top: constant(safe-area-inset-top)) {
	.mw-body,		@media screen {
	.parsoid-body {		.mw-body,
	padding-right: calc(1em + constant(safe-area-inset-right));		.parsoid-body {
	}		padding-right: calc(1em + constant(safe-area-inset-right));
	#p-personal {		}
	right: calc(.75em + constant(safe-area-inset-right));		#p-personal {
	}		right: calc(.75em + constant(safe-area-inset-right));
	.mw-body,		}
	#mw-data-after-content,		.mw-body,
	#mw-head-base,		#mw-data-after-content,
	#left-navigation,		#mw-head-base,
	.mw-footer {		#left-navigation,
	margin-left: calc(10em + constant(safe-area-inset-left));		.mw-footer {
	}		margin-left: calc(10em + constant(safe-area-inset-left));
	#right-navigation,		}
	.mw-footer {		#right-navigation,
	margin-right: constant(safe-area-inset-right);		.mw-footer {
	}		margin-right: constant(safe-area-inset-right);
	#mw-panel {		}
	left: constant(safe-area-inset-left);		#mw-panel {
	}		left: constant(safe-area-inset-left);
	.mw-footer {		}
	margin-bottom: constant(safe-area-inset-bottom);		.mw-footer {
			margin-bottom: constant(safe-area-inset-bottom);
			}
	}		}
	@media screen and (min-width: 982px) {		@media screen and (min-width: 982px) {
95行目:		97行目:
	}		}
	@supports (top: env(safe-area-inset-top)) {		@supports (top: env(safe-area-inset-top)) {
	.mw-body,		@media screen {
	.parsoid-body {		.mw-body,
	padding-right: calc(1em + env(safe-area-inset-right));		.parsoid-body {
	}		padding-right: calc(1em + env(safe-area-inset-right));
	#p-personal {		}
	right: calc(.75em + env(safe-area-inset-right));		#p-personal {
	}		right: calc(.75em + env(safe-area-inset-right));
	.mw-body,		}
	#mw-data-after-content,		.mw-body,
	#mw-head-base,		#mw-data-after-content,
	#left-navigation,		#mw-head-base,
	.mw-footer {		#left-navigation,
	margin-left: calc(10em + env(safe-area-inset-left));		.mw-footer {
	}		margin-left: calc(10em + env(safe-area-inset-left));
	#right-navigation,		}
	.mw-footer {		#right-navigation,
	margin-right: env(safe-area-inset-right);		.mw-footer {
	}		margin-right: env(safe-area-inset-right);
	#mw-panel {		}
	left: env(safe-area-inset-left);		#mw-panel {
	}		left: env(safe-area-inset-left);
	.mw-footer {		}
	margin-bottom: env(safe-area-inset-bottom);		.mw-footer {
			margin-bottom: env(safe-area-inset-bottom);
			}
	}		}
	@media screen and (min-width: 982px) {		@media screen and (min-width: 982px) {

Mntone: 一部の要素でscreenに限定していなかった問題の修正

2021-10-05T05:54:35Z

一部の要素でscreenに限定していなかった問題の修正

← 古い版		2021年10月5日 (火) 14:54時点における版
75行目:		75行目:
	margin-bottom: constant(safe-area-inset-bottom);		margin-bottom: constant(safe-area-inset-bottom);
	}		}
	@media (min-width: 982px) {		@media screen and (min-width: 982px) {
	.mw-body,		.mw-body,
	#mw-head-base,		#mw-head-base,
119行目:		119行目:
	margin-bottom: env(safe-area-inset-bottom);		margin-bottom: env(safe-area-inset-bottom);
	}		}
	@media (min-width: 982px) {		@media screen and (min-width: 982px) {
	.mw-body,		.mw-body,
	#mw-head-base,		#mw-head-base,

Mntone: サイドバーボタンの配置がsafe-areaを考慮していなかった問題の修正

2021-08-31T00:21:47Z

サイドバーボタンの配置がsafe-areaを考慮していなかった問題の修正

← 古い版		2021年8月31日 (火) 09:21時点における版
378行目:		378行目:
	@supports (margin-left: constant(safe-area-inset-left)) {		@supports (margin-left: constant(safe-area-inset-left)) {
	@media screen and (min-width: 800px) and (min-height: 440px) {		@media screen and (min-width: 800px) and (min-height: 440px) {
			#mw-sidebar-collapsible-button {
			left: calc(constant(safe-area-inset-left) + 10rem - 12px);
			}
			.mw-sidebar-collapsed #mw-sidebar-collapsible-button {
			left: calc(constant(safe-area-inset-left) + 1rem);
			}
	.mw-sidebar-collapsed .mw-footer {		.mw-sidebar-collapsed .mw-footer {
	margin-left: constant(safe-area-inset-left);		margin-left: constant(safe-area-inset-left);
385行目:		391行目:
	@supports (margin-left: env(safe-area-inset-left)) {		@supports (margin-left: env(safe-area-inset-left)) {
	@media screen and (min-width: 800px) and (min-height: 440px) {		@media screen and (min-width: 800px) and (min-height: 440px) {
			#mw-sidebar-collapsible-button {
			left: calc(env(safe-area-inset-left) + 10rem - 12px);
			}
			.mw-sidebar-collapsed #mw-sidebar-collapsible-button {
			left: calc(env(safe-area-inset-left) + 1rem);
			}
	.mw-sidebar-collapsed .mw-footer {		.mw-sidebar-collapsed .mw-footer {
	margin-left: env(safe-area-inset-left);		margin-left: env(safe-area-inset-left);

Mntone: サイドバーを閉じているときサイドバーが見えない状態になっているだけで下にある要素がクリックできなくなる問題の修正

2021-08-28T02:36:37Z

サイドバーを閉じているときサイドバーが見えない状態になっているだけで下にある要素がクリックできなくなる問題の修正

← 古い版		2021年8月28日 (土) 11:36時点における版
309行目:		309行目:

	/* mw-sidebar-collapsible-button */		/* mw-sidebar-collapsible-button */
			@-webkit-keyframes show-sidebar {
			0% { opacity: 0; }
			40% {
			display: block;
			opacity: 0;
			}
			100% { opacity: 1; }
			}
			@keyframes show-sidebar {
			0% { opacity: 0; }
			40% {
			display: block;
			opacity: 0;
			}
			100% { opacity: 1; }
			}
	#mw-sidebar-collapsible-button { display: none; }		#mw-sidebar-collapsible-button { display: none; }
	@media screen and (min-width: 800px) and (min-height: 440px) {		@media screen and (min-width: 800px) and (min-height: 440px) {
318行目:		334行目:
	margin-left: 1rem;		margin-left: 1rem;
	width: 5rem;		width: 5rem;
			height: 80px;
	}		}
	.mw-sidebar-collapsed #p-logo a {		.mw-sidebar-collapsed #p-logo a {
325行目:		342行目:
	}		}

	#mw-panel > .mw-portlet {		.mw-sidebar-animatable #mw-panel > .mw-portlet {
	-webkit-~~transition~~: ~~visibility 0s, opacity 133ms 200ms linear~~;		-webkit-animation: 333ms show-sidebar;
	~~transition~~: ~~visibility 0s, opacity 133ms 200ms linear~~;		animation: 333ms show-sidebar;
	}		}
	.mw-sidebar-collapsed #mw-panel > .mw-portlet {		.mw-sidebar-collapsed #mw-panel > .mw-portlet {
	~~visibility~~: ~~hidden~~;		display: none;
	opacity: 0;		opacity: 0;
	}		}

Mntone: サイドバーボタンのスタイルを最適化

2021-08-28T02:06:55Z

サイドバーボタンのスタイルを最適化

← 古い版		2021年8月28日 (土) 11:06時点における版
326行目:		326行目:

	#mw-panel > .mw-portlet {		#mw-panel > .mw-portlet {
			-webkit-transition: visibility 0s, opacity 133ms 200ms linear;
	transition: visibility 0s, opacity 133ms 200ms linear;		transition: visibility 0s, opacity 133ms 200ms linear;
	}		}
338行目:		339行目:
	top: 6rem;		top: 6rem;
	left: calc(10rem - 12px);		left: calc(10rem - 12px);
	~~box-sizing: border-box;~~
	border: 1px solid #a7d7f9;		border: 1px solid #a7d7f9;
	border-radius: 4px;		border-radius: 4px;
	width: ~~24px~~;		width: 22px;
	height: ~~36px~~;		height: 34px;
	background-color: #ffffff;		background-color: #ffffff;
	font-size: 20px;		font-size: 20px;
352行目:		352行目:
	top: calc(5rem - 12px);		top: calc(5rem - 12px);
	left: 1rem;		left: 1rem;
	width: ~~36px~~;		width: 34px;
	height: ~~24px~~;		height: 22px;
	line-height: 20px;		line-height: 20px;
	}		}

Mntone: サイドバーボタンの表示する設定の範囲が間違えていた問題の修正

2021-08-27T11:08:53Z

サイドバーボタンの表示する設定の範囲が間違えていた問題の修正

← 古い版		2021年8月27日 (金) 20:08時点における版
310行目:		310行目:
	/* mw-sidebar-collapsible-button */		/* mw-sidebar-collapsible-button */
	#mw-sidebar-collapsible-button { display: none; }		#mw-sidebar-collapsible-button { display: none; }
	@media screen and (min-width: ~~481px~~) and (min-height: 440px) {		@media screen and (min-width: 800px) and (min-height: 440px) {
	.mw-sidebar-collapsed .mw-body {		.mw-sidebar-collapsed .mw-body {
	margin-left: 0;		margin-left: 0;

Mntone: サイドバーを閉じることができるボタンの追加

2021-08-27T05:52:31Z

サイドバーを閉じることができるボタンの追加

@@ 306行目: / 306行目: @@
              column-gap: .5em;
+   }
+}