|
|
| (同じ利用者による、間の27版が非表示) |
| 1行目: |
1行目: |
| /* ============================================
| |
| WikiEditorツールバーのアイコン色修正
| |
| ライトモードでアイコンを黒く表示
| |
| ============================================ */
| |
|
| |
|
| /* ライトモード（デフォルト）でのアイコン設定 */
| |
| /* OOUIアイコンの色を黒に変更 */
| |
| .wikiEditor-ui-toolbar .oo-ui-icon-bold,
| |
| .wikiEditor-ui-toolbar .oo-ui-icon-italic,
| |
| .wikiEditor-ui-toolbar .oo-ui-icon-link,
| |
| .wikiEditor-ui-toolbar .oo-ui-icon-reference,
| |
| .wikiEditor-ui-toolbar .oo-ui-icon-image,
| |
| .wikiEditor-ui-toolbar .oo-ui-iconElement-icon {
| |
| /* アイコンのマスク画像を反転させて黒く表示 */
| |
| filter: brightness(0) saturate(100%) !important;
| |
| opacity: 0.87 !important;
| |
| }
| |
|
| |
| /* ボタンテキストの色も黒に */
| |
| .wikiEditor-ui-toolbar .oo-ui-buttonElement-button {
| |
| color: #202124 !important;
| |
| }
| |
|
| |
| /* ホバー時の視認性向上 */
| |
| .wikiEditor-ui-toolbar .oo-ui-buttonElement:hover .oo-ui-iconElement-icon {
| |
| opacity: 1 !important;
| |
| }
| |
|
| |
| /* ============================================
| |
| ダークモード用の設定
| |
| ============================================ */
| |
|
| |
| /* ダークモードではアイコンを白く表示 */
| |
| body.theme-dark .wikiEditor-ui-toolbar .oo-ui-icon-bold,
| |
| body.theme-dark .wikiEditor-ui-toolbar .oo-ui-icon-italic,
| |
| body.theme-dark .wikiEditor-ui-toolbar .oo-ui-icon-link,
| |
| body.theme-dark .wikiEditor-ui-toolbar .oo-ui-icon-reference,
| |
| body.theme-dark .wikiEditor-ui-toolbar .oo-ui-icon-image,
| |
| body.theme-dark .wikiEditor-ui-toolbar .oo-ui-iconElement-icon,
| |
| html.theme-dark .wikiEditor-ui-toolbar .oo-ui-iconElement-icon {
| |
| filter: none !important;
| |
| opacity: 0.87 !important;
| |
| }
| |
|
| |
| /* ダークモードではボタンテキストを白に */
| |
| body.theme-dark .wikiEditor-ui-toolbar .oo-ui-buttonElement-button,
| |
| html.theme-dark .wikiEditor-ui-toolbar .oo-ui-buttonElement-button {
| |
| color: #e0e0e0 !important;
| |
| }
| |
|
| |
| /* ============================================
| |
| 自動モード（OSの設定に従う）
| |
| ============================================ */
| |
|
| |
| /* 自動モード + ライトテーマの場合 */
| |
| @media (prefers-color-scheme: light) {
| |
| body.theme-auto .wikiEditor-ui-toolbar .oo-ui-iconElement-icon,
| |
| html.theme-auto .wikiEditor-ui-toolbar .oo-ui-iconElement-icon {
| |
| filter: brightness(0) saturate(100%) !important;
| |
| opacity: 0.87 !important;
| |
| }
| |
|
| |
| body.theme-auto .wikiEditor-ui-toolbar .oo-ui-buttonElement-button,
| |
| html.theme-auto .wikiEditor-ui-toolbar .oo-ui-buttonElement-button {
| |
| color: #202124 !important;
| |
| }
| |
| }
| |
|
| |
| /* 自動モード + ダークテーマの場合 */
| |
| @media (prefers-color-scheme: dark) {
| |
| body.theme-auto .wikiEditor-ui-toolbar .oo-ui-iconElement-icon,
| |
| html.theme-auto .wikiEditor-ui-toolbar .oo-ui-iconElement-icon {
| |
| filter: none !important;
| |
| opacity: 0.87 !important;
| |
| }
| |
|
| |
| body.theme-auto .wikiEditor-ui-toolbar .oo-ui-buttonElement-button,
| |
| html.theme-auto .wikiEditor-ui-toolbar .oo-ui-buttonElement-button {
| |
| color: #e0e0e0 !important;
| |
| }
| |
| }
| |
|
| |
| /* ============================================
| |
| 追加の調整: グループとツール全体
| |
| ============================================ */
| |
|
| |
| /* ツールバー全体のグループにも適用 */
| |
| .wikiEditor-ui-toolbar .group .tool {
| |
| color: inherit;
| |
| }
| |
|
| |
| /* アクティブ状態のボタン */
| |
| .wikiEditor-ui-toolbar .oo-ui-buttonElement-active .oo-ui-buttonElement-button {
| |
| background-color: rgba(0, 0, 0, 0.05) !important;
| |
| }
| |
|
| |
| body.theme-dark .wikiEditor-ui-toolbar .oo-ui-buttonElement-active .oo-ui-buttonElement-button,
| |
| html.theme-dark .wikiEditor-ui-toolbar .oo-ui-buttonElement-active .oo-ui-buttonElement-button {
| |
| background-color: rgba(255, 255, 255, 0.1) !important;
| |
| }
| |
|
| |
| /* ============================================
| |
| より具体的なセレクタ（優先度を上げるため）
| |
| ============================================ */
| |
|
| |
| /* すべてのOOUIアイコン要素に強制適用 */
| |
| .wikiEditor-ui-toolbar .group .tool .oo-ui-iconElement-icon,
| |
| .wikiEditor-ui-toolbar .group-insert .tool .oo-ui-iconElement-icon,
| |
| .wikiEditor-ui-toolbar .group-format .tool .oo-ui-iconElement-icon {
| |
| filter: brightness(0) saturate(100%) !important;
| |
| }
| |
|
| |
| /* ダークモード用の強制適用 */
| |
| body.theme-dark .wikiEditor-ui-toolbar .group .tool .oo-ui-iconElement-icon,
| |
| body.theme-dark .wikiEditor-ui-toolbar .group-insert .tool .oo-ui-iconElement-icon,
| |
| body.theme-dark .wikiEditor-ui-toolbar .group-format .tool .oo-ui-iconElement-icon,
| |
| html.theme-dark .wikiEditor-ui-toolbar .group .tool .oo-ui-iconElement-icon,
| |
| html.theme-dark .wikiEditor-ui-toolbar .group-insert .tool .oo-ui-iconElement-icon,
| |
| html.theme-dark .wikiEditor-ui-toolbar .group-format .tool .oo-ui-iconElement-icon {
| |
| filter: none !important;
| |
| }
| |
