« MediaWiki:Common.css » : différence entre les versions
Aller à la navigation
mAucun résumé des modifications |
mAucun résumé des modifications |
||
Ligne 1 : | Ligne 1 : | ||
/* ***************************************************** */ | |||
/* Le CSS placé ici sera appliqué à tous les habillages. */ | /* Le CSS placé ici sera appliqué à tous les habillages. */ | ||
/* ***************************************************** */ | |||
/* change l'opacité de l'image au survol de la souris */ | /* change l'opacité de l'image au survol de la souris */ | ||
Ligne 16 : | Ligne 18 : | ||
transition: all 3s ease; | transition: all 3s ease; | ||
} | } | ||
.tilt:hover { | .tilt:hover { | ||
-webkit-transform: rotate(-360deg); | -webkit-transform: rotate(-360deg); | ||
Ligne 24 : | Ligne 25 : | ||
transform: rotate(-360deg); | transform: rotate(-360deg); | ||
} | } | ||
.pulse:hover { | .pulse:hover { | ||
animation-name: pulse; | animation-name: pulse; | ||
Ligne 57 : | Ligne 57 : | ||
opacity: 0.7;} | opacity: 0.7;} | ||
} | } | ||
/* **** Propriétés de la classe infobulle **** */ | |||
.infobulle { | |||
border-bottom: 1px dotted #000000; | |||
color: #000000; | |||
outline: none; | |||
cursor: help; | |||
text-decoration: none; | |||
position: relative; | |||
} | |||
.infobulle span { | |||
margin-left: -999em; | |||
position: absolute; | |||
} | |||
.infobulle:hover span { | |||
border-radius: 5px 5px; | |||
-moz-border-radius: 5px; | |||
-webkit-border-radius: 5px; | |||
box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); | |||
-webkit-box-shadow: 5px 5px rgba(0, 0, 0, 0.1); | |||
-moz-box-shadow: 5px 5px rgba(0, 0, 0, 0.1); | |||
font-family: Calibri, Tahoma, Geneva, sans-serif; | |||
position: absolute; | |||
left: 1em; | |||
top: 2em; | |||
z-index: 99; | |||
margin-left: 0; width: 250px; | |||
} | |||
.infobulle:hover img { | |||
border: 0; | |||
margin: -10px 0 0 -55px; | |||
float: left; | |||
position: absolute; | |||
} | |||
.infobulle :hover em { | |||
font-family: Candara, Tahoma, Geneva, sans-serif; | |||
font-size: 1.2em; | |||
font-weight: bold; | |||
display: block; | |||
padding: 0.2em 0 0.6em 0; | |||
} | |||
.basic { padding: 0.8em 1em; } | |||
.custom { padding: 0.5em 0.8em 0.8em 2em; } | |||
* html a:hover { background: transparent; } | |||
.classic {background: #FFFFAA; border: 1px solid #FFAD33; } | |||
.critic { background: #FFCCAA; border: 1px solid #FF3334; } | |||
.aide { background: #9FDAEE; border: 1px solid #2BB0D7; } | |||
.info { background: #9FDAEE; border: 1px solid #2BB0D7; } | |||
.avert { background: #FFFFAA; border: 1px solid #FFAD33; } |
Version du 6 janvier 2015 à 16:44
/* ***************************************************** */ /* Le CSS placé ici sera appliqué à tous les habillages. */ /* ***************************************************** */ /* change l'opacité de l'image au survol de la souris */ div.survol:hover { opacity:0.75; filter:alpha(opacity=75); } /* Pour des effets de clignotements */ .tilt { -webkit-transition: all 3s ease; -moz-transition: all 3s ease; -o-transition: all 3s ease; -ms-transition: all 3s ease; transition: all 3s ease; } .tilt:hover { -webkit-transform: rotate(-360deg); -moz-transform: rotate(-360deg); -o-transform: rotate(-360deg); -ms-transform: rotate(-360deg); transform: rotate(-360deg); } .pulse:hover { animation-name: pulse; -webkit-animation-name: pulse; animation-duration: 1s; -webkit-animation-duration: 1s; animation-iteration-count: infinite; -webkit-animation-iteration-count: infinite; } @keyframes pulse { 0% { transform: scale(0.95); opacity: 0.7;} 50% { transform: scale(1); opacity: 1;} 100% { transform: scale(0.95); opacity: 0.7;} } @-webkit-keyframes pulse { 0% { -webkit-transform: scale(0.95); opacity: 0.7;} 50% { -webkit-transform: scale(1); opacity: 1;} 100% { -webkit-transform: scale(0.95); opacity: 0.7;} } /* **** Propriétés de la classe infobulle **** */ .infobulle { border-bottom: 1px dotted #000000; color: #000000; outline: none; cursor: help; text-decoration: none; position: relative; } .infobulle span { margin-left: -999em; position: absolute; } .infobulle:hover span { border-radius: 5px 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 5px 5px rgba(0, 0, 0, 0.1); -moz-box-shadow: 5px 5px rgba(0, 0, 0, 0.1); font-family: Calibri, Tahoma, Geneva, sans-serif; position: absolute; left: 1em; top: 2em; z-index: 99; margin-left: 0; width: 250px; } .infobulle:hover img { border: 0; margin: -10px 0 0 -55px; float: left; position: absolute; } .infobulle :hover em { font-family: Candara, Tahoma, Geneva, sans-serif; font-size: 1.2em; font-weight: bold; display: block; padding: 0.2em 0 0.6em 0; } .basic { padding: 0.8em 1em; } .custom { padding: 0.5em 0.8em 0.8em 2em; } * html a:hover { background: transparent; } .classic {background: #FFFFAA; border: 1px solid #FFAD33; } .critic { background: #FFCCAA; border: 1px solid #FF3334; } .aide { background: #9FDAEE; border: 1px solid #2BB0D7; } .info { background: #9FDAEE; border: 1px solid #2BB0D7; } .avert { background: #FFFFAA; border: 1px solid #FFAD33; }