「MediaWiki:Common.css」の版間の差分

← 古い編集新しい編集 →

@@ 1行目: / 1行目: @@
 /* MediaWiki:Common.css */
-/* ライトモード/ダークモード対応版（CSS変数なし） */
+/* ライトモード/ダークモード対応版 */
 /* ここに記述したCSSはすべての外装に反映されます */
@@ 138行目: / 138行目: @@
 }
-/* SyntaxHighlight - ライトモード時のキーワード色（オプション） */
+/* ===================================
+   SyntaxHighlight - ライトモード
+   =================================== */
+/* SyntaxHighlight - ライトモード時のキーワード色 */
 .mw-highlight .k,     /* Keyword */
 .mw-highlight .kd,    /* Keyword.Declaration */
@@ 145行目: / 149行目: @@
 .mw-highlight .kp,    /* Keyword.Pseudo */
 .mw-highlight .kr {   /* Keyword.Reserved */
-	/* ライトモード時はデフォルトの色を使用（通常は濃い青でOK） */
+	/* ライトモード時はデフォルトの色を使用（通常は濃い青） */
-	/* 必要に応じてここで調整可能 */
+}
+/* プリプロセッサディレクティブ (#include, #define等) - ライトモード */
+.mw-highlight .cp {   /* Comment.Preproc */
+	color: #e83e8c !important;
+	background-color: rgba(232, 62, 140, 0.08) !important;
+	font-weight: 600 !important;
+	font-style: normal !important;
+	padding: 2px 6px !important;
+	border-radius: 3px !important;
+	border-left: 3px solid rgba(232, 62, 140, 0.4) !important;
+	display: inline-block !important;
+	margin: 0 2px !important;
+}
+/* プリプロセッサが複数行にわたる場合 */
+.mw-highlight .cp + .cp {
+	margin-top: 2px !important;
+}
+/* プリプロセッサのホバー効果 - ライトモード */
+.mw-highlight .cp:hover {
+	background-color: rgba(232, 62, 140, 0.15) !important;
+	box-shadow: 0 0 5px rgba(232, 62, 140, 0.3) !important;
+	transition: all 0.2s ease !important;
 }
@@ 429行目: / 457行目: @@
 	transform: translateX(4px) scale(0.98);
 	transition: all 0.1s ease;
-}
-/* 目次全体にグラスモーフィズム効果を追加 */
-.toc::before {
-	content: '';
-	position: absolute;
-	top: 0;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	border-radius: 16px;
-	backdrop-filter: blur(8px);
-	z-index: -1;
 }
@@ 547行目: / 562行目: @@
 @media (prefers-color-scheme: dark) {
+	/* ===================================
+	   SyntaxHighlight - ダークモード
+	   =================================== */
 	/* SyntaxHighlight - キーワードの色を明るく */
 	.mw-highlight .k,     /* Keyword */
@@ 578行目: / 597行目: @@
 	.mw-highlight .c,     /* Comment */
 	.mw-highlight .cm,    /* Comment.Multiline */
-	.mw-highlight .cp,    /* Comment.Preproc */
 	.mw-highlight .c1,    /* Comment.Single */
 	.mw-highlight .cs {   /* Comment.Special */
 		color: #9ca3af !important;  /* 明るいグレー */
 		font-style: italic;
+	}
+	/* プリプロセッサディレクティブ - ダークモード */
+	.mw-highlight .cp {   /* Comment.Preproc */
+		color: #ff6ec7 !important;
+		background-color: rgba(255, 110, 199, 0.12) !important;
+		font-weight: 600 !important;
+		font-style: normal !important;
+		padding: 2px 6px !important;
+		border-radius: 3px !important;
+		border-left: 3px solid rgba(255, 110, 199, 0.4) !important;
+		display: inline-block !important;
+		margin: 0 2px !important;
+	}
+	/* プリプロセッサのホバー効果 - ダークモード */
+	.mw-highlight .cp:hover {
+		background-color: rgba(255, 110, 199, 0.2) !important;
+		box-shadow: 0 0 5px rgba(255, 110, 199, 0.4) !important;
+		transition: all 0.2s ease !important;
 	}
@@ 592行目: / 630行目: @@
 	.mw-highlight .sc,    /* String.Char */
 	.mw-highlight .sd {   /* String.Doc */
-		color: #a5d6a7 !important;  /* 明るい緑（既に見やすいが念のため） */
+		color: #a5d6a7 !important;  /* 明るい緑 */
 	}