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

2026年2月18日 (水) 16:51時点における版

/* ==========================================
   1. 全デバイス共通：ロゴの基本設定
   ========================================== */
#p-logo {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

#p-logo a {
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    display: block !important;
}

/* ==========================================
   2. PC用（1000px以上）：広告抹殺 ＆ ロゴ200px
   ========================================== */
@media screen and (min-width: 1000px) {
    /* ページ上部の余白と広告を消す */
    html, body {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    #mw-head ins.adsbygoogle,
    #mw-navigation ins.adsbygoogle,
    #p-logo ins.adsbygoogle,
    #p-search ins.adsbygoogle,
    #p-personal ins.adsbygoogle,
    .google-auto-placed,
    div[class*="google-auto-placed"],
    ins[data-vignette-loaded="true"] {
        display: none !important;
        height: 0 !important;
        width: 0 !important;
        overflow: hidden !important;
        visibility: hidden !important;
    }

    /* ヘッダー要素を広告より前に出す */
    #mw-head, #p-logo, #p-search, #p-personal {
        position: relative !important;
        z-index: 999999 !important;
        background: white !important; /* 透け防止 */
    }

    /* 【PC版ロゴ】枠ごとサイズを強制指定 */
    div#p-logo {
        width: 200px !important; 
        height: 200px !important;
        min-width: 200px !important;
    }
    div#p-logo a {
        width: 200px !important;
        height: 200px !important;
    }
    
    /* ロゴを小さくした分、コンテンツの左余白を調整（必要に応じて） */
    #mw-panel { width: 200px !important; }
    #content, #footer, #mw-head-base, #left-navigation { margin-left: 200px !important; }
}

/* ==========================================
   3. モバイル用（999px以下）：ロゴ100px
   ========================================== */
@media screen and (max-width: 999px) {
    /* 【モバイル版ロゴ】 */
    #p-logo, #p-logo a {
        width: 100px !important;
        height: 100px !important;
        min-width: 100px !important;
    }
}