ميډياويکي:Gadget-NewMainPageTest.css

/*  _____________________________________________________________________________
 * |                                                                             |
 * |                    === WARNING: GLOBAL GADGET FILE ===                      |
 * |                  Changes to this page affect many users.                    |
 * | Please discuss changes on the talk page or on [[WT:Gadget]] before editing. |
 * |_____________________________________________________________________________|
 *
 * Styling for the 2015 redesigned Main Page
 */

/* Hide stuff from Main Page (do not copy to Common.css) */
.page-Wikipedia_Main_Page_2015_redesign h1.firstHeading,
.page-Wikipedia_Main_Page_2015_redesign #mp-enable,
.page-Wikipedia_Main_Page_2015_redesign #siteSub,
.page-Wikipedia_Main_Page_2015_redesign #contentSub,
.page-Wikipedia_Main_Page_2015_redesign #catlinks {
    display: none;
}

/* Move TFA image to right (temporary hack) */
#mp-tfa-img {
    float: right !important;
    margin: 0.5em 0 0.4em 0.9em !important;
}

/**
 * Start of Main Page styling. Positional layout CSS is inline.
 */

/* Set maximum width */
#mw-content-text {
    margin: 0 auto;
    max-width: 125em;
}

/* Basic panel styling */
.mp-panel {
    margin-top: 1em;
    padding: 1em;
    overflow: hidden;
    -moz-box-shadow: 0.25em 0.25em 0.5em rgba(0, 0, 0, 0.05);
    -webkit-box-shadow:  0.25em 0.25em 0.5em rgba(0, 0, 0, 0.05);
    box-shadow:  0.25em 0.25em 0.5em rgba(0, 0, 0, 0.05);
    border-style: solid;
    border-width: 1px;
    border-color: #E0E0E0 #B1B1B1 #B1B1B1 #E0E0E0;
    background-color: #FAFAFA;
    background-image: -moz-linear-gradient(top right, #F2F2F2, #FAFAFA);
    background-image: -o-linear-gradient(top right, #F2F2F2, #FAFAFA);
    background-image: -webkit-linear-gradient(top right, #F2F2F2, #FAFAFA);
    background-image: linear-gradient(to bottom left, #F2F2F2, #FAFAFA);
}

/* Basic header styling */
.mw-body .mp-h2 {
    border-bottom: none;
    margin: -1em -1em .5em -1em;
    padding: .4em 1em .1em 1em;
    line-height: 1.3em;
    text-shadow: 0.1em 0.1em 0.2em rgba(0, 0, 0, 0.1);
    background-color: #E0E0E0;
    background-image: -moz-linear-gradient(left, #E0E0E0, #F2F2F2);
    background-image: -o-linear-gradient(left, #E0E0E0, #F2F2F2);
    background-image: -webkit-linear-gradient(left, #E0E0E0, #F2F2F2);
    background-image: linear-gradient(to right, #E0E0E0, #F2F2F2);
}
/* H150 */
#mp-tfa-h2,
#mp-tfl-h2,
#mp-tfp-h2 {
    background-color: #CEF2E0;
    background-image: -moz-linear-gradient(left, #CEF2E0, #F2F2F2);
    background-image: -o-linear-gradient(left, #CEF2E0, #F2F2F2);
    background-image: -webkit-linear-gradient(left, #CEF2E0, #F2F2F2);
    background-image: linear-gradient(to right, #CEF2E0, #F2F2F2);
}
/* H210 */
#mp-itn-h2,
#mp-otd-h2 {
    background-color: #CEDFF2;
    background-image: -moz-linear-gradient(left, #CEDFF2, #F2F2F2);
    background-image: -o-linear-gradient(left, #CEDFF2, #F2F2F2);
    background-image: -webkit-linear-gradient(left, #CEDFF2, #F2F2F2);
    background-image: linear-gradient(to right, #CEDFF2, #F2F2F2);
}
/* H270 */
#mp-dyk-h2 {
    background-color: #E0CEF2;
    background-image: -moz-linear-gradient(left, #E0CEF2, #F2F2F2);
    background-image: -o-linear-gradient(left, #E0CEF2, #F2F2F2);
    background-image: -webkit-linear-gradient(left, #E0CEF2, #F2F2F2);
    background-image: linear-gradient(to right, #E0CEF2, #F2F2F2);
}
/* H30 */
#mp-bae-h2 {
    background-color: #F2E0CE;
    background-image: -moz-linear-gradient(left, #F2E0CE, #F2F2F2);
    background-image: -o-linear-gradient(left, #F2E0CE, #F2F2F2);
    background-image: -webkit-linear-gradient(left, #F2E0CE, #F2F2F2);
    background-image: linear-gradient(to right, #F2E0CE, #F2F2F2);
}

/* Top banner */
#mp-topbanner {
    padding: 0;
}
#mp-topbanner-inner {
    max-width: 960px;
    margin: 0 auto;
    padding: 1em;
    overflow: hidden;
    background-image: url(//upload.wikimedia.org/wikipedia/en/thumb/6/62/Wikipedia%27s_W_10.svg/250px-Wikipedia%27s_W_10.svg.png);
    background-position: 1em -5em;
    background-repeat: no-repeat;
    background-size: 250px auto;
}
@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx) {
    #mp-topbanner-inner {
        background-image: url(//upload.wikimedia.org/wikipedia/en/thumb/6/62/Wikipedia%27s_W_10.svg/250px-Wikipedia%27s_W_10.svg.png)
    }
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
    #mp-topbanner-inner {
        background-image: url(//upload.wikimedia.org/wikipedia/en/thumb/6/62/Wikipedia%27s_W_10.svg/250px-Wikipedia%27s_W_10.svg.png)
    }
}
#mp-topbanner-left,
#mp-topbanner-right {
    font-family: "Linux Libertine", "Nimbus Roman No9 L", "Times New Roman", Times, serif;
    font-size: 17px;
    line-height: 1.3;
}
#mp-topbanner-left img {
    opacity: .8;
}

/* Stack panels when screen width is 1024px or less. TO DO: Fix IE9 */
@media only screen and (max-width: 1024px), only screen and (max-device-width: 1024px) {
    .mp-flex {
        display: block !important;
    }
    #mp-topbanner-left,
    #mp-topbanner-right,
    .mp-float-left,
    .mp-float-right {
        float: none !important;
        width: auto !important;
    }
    .mp-margin-left {
        margin-left: 0 !important;
    }        
}