|
|
| Line 1: |
Line 1: |
| /* CSS placed here will be applied to all skins */ | | /* CSS placed here will be applied to all skins */ |
|
| |
| /* CSS used for https://www.mediawiki.org/wiki/MediaWiki/Homepage_improvements_2018 : */
| |
| .mainpage_row {
| |
| display: flex;
| |
| flex-direction: row;
| |
| flex-flow: row wrap;
| |
| justify-content: space-between;
| |
| padding: 0;
| |
| margin: 0 -5px 0 -5px;
| |
| }
| |
| .mainpage_box {
| |
| flex: 1;
| |
| margin: 5px;
| |
| min-width: 210px;
| |
| border: 1px solid #a2a9b1;
| |
| padding: 0 10px 10px 10px;
| |
| box-shadow: 0 2px 2px rgba( 0, 0, 0, 0.2 );
| |
| }
| |
| .mainpage_box h3 {
| |
| /* Reset padding so is equal across skins */
| |
| padding-right: 0;
| |
| padding-top: 0;
| |
| padding-bottom: 0;
| |
| /* Padding left gets overridden by headanchor gadget */
| |
| margin: 0.5em 0;
| |
| }
| |
| /* Set padding left only if headanchor gadget is not enabled */
| |
| .mainpage_box h3:not(.tpl-vheadanchor-heading) {
| |
| padding-left: 0;
| |
| }
| |
| .mainpage_box h3 .header_icon {
| |
| float: left;
| |
| margin-right: 5px;
| |
| }
| |
| .mainpage_box .items {
| |
| border-top: 1px solid #CCC;
| |
| padding-top: 0.5em;
| |
| }
| |
| .mainpage_box p:last-child {
| |
| margin-bottom: 0;
| |
| }
| |
| .mainpage_boxcontents_small {
| |
| font-size: 95%;
| |
| }
| |
| /* Style the "other languages" box the same way as other boxes on the main page */
| |
| .mw-pt-languages {
| |
| display: block;
| |
| background: none;
| |
| border: 1px solid #CCC;
| |
| box-shadow: 0 2px 2px rgba(0,0,0,0.1);
| |
| width: auto;
| |
| }
| |
| .mw-pt-languages-label {
| |
| background: none;
| |
| border-right: none;
| |
| }
| |
|
| |
| @media screen and (max-width: 719px) {
| |
| .thumb {
| |
| float: none;
| |
| }
| |
| .thumb, .thumbinner {
| |
| margin-left: auto;
| |
| margin-right: auto;
| |
| }
| |
| }
| |
|
| |
| /* This offset is specifically tailored to the hackathon particiapnts photo */
| |
| /* It's a little bigger in the default skin than required, because timeless has */
| |
| /* larger than average margin for thumbs */
| |
| @media screen and (min-width: 1400px) {
| |
| html:not(.vector-feature-page-tools-pinned-enabled) .mainpage_row {
| |
| margin-right: 384px;
| |
| }
| |
| }
| |
|
| |
| @media screen and (min-width: 1680px) {
| |
| .mainpage_row {
| |
| margin-right: 384px;
| |
| }
| |
| }
| |
|
| |
| /* Night mode styles */
| |
| @media screen {
| |
| html.skin-theme-clientpref-night .header_icon img {
| |
| filter: invert( 1 );
| |
| }
| |
| }
| |
|
| |
| @media screen and (prefers-color-scheme: dark) {
| |
| html.skin-theme-clientpref-os .header_icon img {
| |
| filter: invert( 1 );
| |
| }
| |
| }
| |
