MediaWiki:Mobile.css

De Wikimedica

Note : après avoir enregistré vos modifications, il se peut que vous deviez forcer le rechargement complet du cache de votre navigateur pour voir les changements.

/* Le CSS placé ici n’affectera que les utilisateurs du site mobile */

/* Fix bug with branding box. */
.minerva-header .branding-box { min-width: auto; }

/* Make the text smaller for mobile to fit more info on the screens. Those users that want bigger font can get them with the configuration menu.*/
@media (max-width:720px)
{
	#content .content {
		font-size: 75%;
		line-height: 1.1;
	}
}

/* Fix heading positionning. */
.page-heading {
	padding-top: 1em;
}

.wikimedica-box
{
    padding: 10px;
    border-style: solid;
    overflow: hidden;
    font-size: 100%;
    background-color: #f8f9fa;
    border: 1px solid #a2a9b1;
}

.wikimedica-sidebox  { width: auto; }

@media (min-width:720px)
{
	/* This style is actually set in Mobile.js because it can't override the skin styles unless it's part of the element. */
	.mw-capiunto-infobox table
	{ 
	    float: right; 
	    margin:0.5em 0 0.5em 1em !important; 
	    clear: right;
	    width: 22em !important;
	}

    .wikimedica-sidebox 
    { 
        float: right; 
        margin:0.5em 0 0.5em 1em; 
        clear: right;
        width: 22em;
    }
    
    .wikimedica-sidebox-typed
    { 
        width: 21.5em;
    }
}
@media (max-width:720px)
{
	.mw-capiunto-infobox
    { 
        width: auto !important;
    }
}

.mw-capiunto-infobox {
    border: 1px solid #aaa;
    background-color: #f9f9f9;
    color: #000;
    padding: 0.2em;
    text-align: left;
    font-size: 88%;
    line-height: 1.5em;
    border-spacing: 3px;
}
.mw-capiunto-infobox caption { display:none; }
.mw-capiunto-infobox-spanning { text-align: center; }
.mw-capiunto-infobox-header { text-align: center; }

.toccolours /* Utilisé par plusieurs modèles et désactivé par MobileFrontend. */
{
    border: 1px solid #aaa;
    background-color: #f9f9f9;
    padding: 5px;
    font-size: 95%;
}

.question /* Pour s'assurer que les flashcards, questions à choix multiples occupent toute la largeur de l'écran. */
{
    width: 100%;
    margin: 0px;
}

/* Pour le modèle Information concept. Ne peut être placé à même le modèle (Voir Wikimedica:Tâches/Liste/48) */
.information th, .information td { vertical-align: top; text-align:left; }
.information ul, .information ol { margin-top: 0px; }
.information table { border-spacing: 3px; }
.information img { width: 100%; height: auto; }

/* Show elements which are given this class (they are shown again by Common.css). */
.mobileonly { display: block; }

/* Hide elements which are given this class */
.nomobile { display: none; }

/* For elements that should only be visible in print.*/
.printonly
{
	display: none;
}

.content li
{
	margin-bottom: 2px; /* To allow easier reading, the mobile skin sets huge margins on li items. Actually, its annoying...*/
	font-size: 90%; /* Some styling is making the list larger, correct that. */
}

/* This creates a weird space in Accueil because of padding. */
.pre-content { padding: 0;}

.section-ontologique 
{
	font-size: 75%;
}

/* Style des titres et sous-titres (voir Wikimedica:Tâches/Liste/106) */
@media (max-width:720px){ .mw-body h1 { font-size:1.3em; } }
.mw-body h2 { font-size:1.5em; }
.mw-body h3 { font-size:1.2em; font-style:italic; font-weight:bold; text-decoration: underline; }
.mw-body h4 { font-size:1.1em; font-style:normal; font-weight:bold; text-decoration: underline; }
.mw-body h5 { font-size:1.0em; font-style:normal; font-weight:bold; text-decoration: normal; }
.mw-body h6 { font-style: normal; font-weight:normal; text-decoration: underline; }

.errorbox { 
	width: 90%;
    padding: 10px;
    border-style: solid;
    margin: 3em 1em 1em 1em;
    overflow: hidden;
    background-color: #ffcfcf;
    color: #d33;
    border: 1px solid #d33;
}

.flow-board-header-footer p {
	display: none; /* Hide this section because it only displays the copyright. */
}

.header .branding-box { opacity: 1; }
.header .branding-box img { width: 160px; }
@media (min-width:720px)
{
	.header .branding-box { padding-right: 30px; }
}

.ext-mermaid-wrapper { zoom: 75%; }

.searchboxInput { margin-top: 10px; margin-bottom: 10px; }

/* Hide these in the sidebar, they are displayed elsewhere in the interface. */
#mw-mf-page-left ul.hlist { display: none; }

/* Squeeze the menu icons because the logo with wordmark makes the header to large. */
#minerva-user-menu-toggle { padding: 0.5em; }
#user-notifications { padding: 0.5em; }
#searchIcon { padding: 0.5em; }

/* Do not display links to non existing categories in red. */
#mw-normal-catlinks > ul > li > a { color: #0645ad; }
#mw-normal-catlinks > ul > li > a:visited { color: #0b0080; }

#catlinks { zoom: 50%; } /* Shrink category box. */