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

羽井出 (トーク | 投稿記録)
ダークモードいろいろ調整
羽井出 (トーク | 投稿記録)
ダークモード調整
596行目: 596行目:


@media screen {
@media screen {
html.skin-theme-clientpref-night .mbox {
  html.skin-theme-clientpref-night .infobox, html.skin-theme-clientpref-night .mbox, html.skin-theme-clientpref-night .ambox {
        /* ダークモードの一般的な背景と文字色 */
        background-color: #1f1f23;
        color: #f8f9fa;
        border-color: #54595d;
    }
    /* 情報 (notice) のダークモードスタイル */
    html.skin-theme-clientpref-night .mbox-notice {
        background-color: #2a2a30;
        border-color: #444;
    }
    /* 警告 (warning) のダークモードスタイル */
    html.skin-theme-clientpref-night .mbox-warning {
        background-color: #4a4a30; /* 少し暗めの黄色系背景 */
        border-color: #7d7d52;
        color: #f8f9fa; /* テキストを明るい色に変更 */
    }
    /* mbox内のリンクの色も調整 */
    html.skin-theme-clientpref-night .mbox a {
        color: #5b92e5;
    }
html.skin-theme-clientpref-night .infobox {
         background-color: #1f1f23; /* 暗い背景色 */
         background-color: #1f1f23; /* 暗い背景色 */
         color: #f8f9fa; /* 明るい文字色 */
         color: #f8f9fa; /* 明るい文字色 */
627行目: 605行目:
         color: #f8f9fa;
         color: #f8f9fa;
     }
     }
     html.skin-theme-clientpref-night .infobox a {
     html.skin-theme-clientpref-night .infobox a, html.skin-theme-clientpref-night .mbox a, html.skin-theme-clientpref-night .ambox a {
         color: #5b92e5;
         color: #5b92e5;
    }
   
        /* ambox の種類別の色分けをダークモード向けに調整 */
    html.skin-theme-clientpref-night .ambox-content {
        background-color: #4a382e; /* オレンジ系を暗く */
        border-color: #8f5c35;
    }
    html.skin-theme-clientpref-night .ambox-style {
        background-color: #4a4a30; /* 黄色系を暗く */
        border-color: #7d7d52;
    }
    html.skin-theme-clientpref-night .ambox-notice {
        background-color: #2a2a30; /* 青系を暗く */
        border-color: #44447a;
     }
     }
}
}
636行目: 628行目:
}
}
.mbox {
.infobox, .mbox, .ambox {
        /* ダークモードの一般的な背景と文字色 */
        background-color: #1f1f23;
        color: #f8f9fa;
        border-color: #54595d;
    }
    /* 情報 (notice) のダークモードスタイル */
    .mbox-notice {
        background-color: #2a2a30;
        border-color: #444;
    }
    /* 警告 (warning) のダークモードスタイル */
    .mbox-warning {
        background-color: #4a4a30; /* 少し暗めの黄色系背景 */
        border-color: #7d7d52;
        color: #f8f9fa; /* テキストを明るい色に変更 */
    }
    /* mbox内のリンクの色も調整 */
    .mbox a {
        color: #5b92e5;
    }
.infobox {
         background-color: #1f1f23; /* 暗い背景色 */
         background-color: #1f1f23; /* 暗い背景色 */
         color: #f8f9fa; /* 明るい文字色 */
         color: #f8f9fa; /* 明るい文字色 */
667行目: 637行目:
         color: #f8f9fa;
         color: #f8f9fa;
     }
     }
     .infobox a {
     .infobox a, .mbox a, .ambox a {
         color: #5b92e5;
         color: #5b92e5;
    }
   
    /* ambox の種類別の色分けをダークモード向けに調整 */
    .ambox-content {
        background-color: #4a382e; /* オレンジ系を暗く */
        border-color: #8f5c35;
    }
    .ambox-style {
        background-color: #4a4a30; /* 黄色系を暗く */
        border-color: #7d7d52;
    }
    .ambox-notice {
        background-color: #2a2a30; /* 青系を暗く */
        border-color: #44447a;
     }
     }
}
}