MediaWiki:Common.css
De WikiCafe
Nota: tras guardar, quizás necesites actualizar la caché de tu navegador para ver los cambios.
- Firefox/Safari: Mantén presionada la tecla Mayús mientras pulsas el botón Actualizar, o presiona Ctrl+F5 o Ctrl+R (⌘+R en Mac)
- Google Chrome: presiona Ctrl+Shift+R (⌘+Mayús+R en Mac)
- Internet Explorer: mantén presionada Ctrl mientras pulsas Actualizar, o presiona Ctrl+F5
- Opera: dirígete a Menú → Configuración (Opera → Preferencias en Mac) y luego a Privacidad y seguridad → Borrar datos de navegación → Imágenes y archivos en caché.
/* Los estilos CSS colocados aquí se aplicarán a todas las apariencias */
/*Contenido*/
#mw-content {
background: #f8f9fa;
border: solid #eaecf0;
border-top-width: medium;
border-right-width: medium;
border-bottom-width: medium;
border-left-width: medium;
border-width: 1px 1px 0.2em;
padding: 1.25em 1.75em;
box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.02);
background: #ffffff;
padding: 1em 2em 3em;
margin-top: 10%;
}
#mw-content-container {
background: #e4e4e4;
border-bottom: solid 4px #681a27;
background-image: url(http://wikicafe.promecafe.net/skins/Timeless/resources/images/Coffeebkgfond.svg?16711);
background-repeat: repeat;
background-size: 1700px, 800px;
background-position-x: 85%;
background-position-y: 0%;
}
/*Contenedor con usuario y busqueda*/
container {
height: 0;
position: fixed;
z-index: 100;
top: 0;
width: 100%;
background: #ffffff;
color: #000000;
padding: 0.5em 0 0;
min-height: 3.125em;
box-sizing: border-box;
margin-top: 5%;
}
/*Nombre de usuario*/
#user-tools {
-webkit-box-pack: justify;
-moz-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-flex: 0;
-moz-box-flex: 0;
width: auto;
-ms-flex: 0 1 auto;
flex: 0 1 auto;
-webkit-box-ordinal-group: 3;
-moz-box-ordinal-group: 3;
-ms-flex-order: 3;
order: 3;
display: inline-block;
margin-right: -6%;
}
/*Navegación derfecha*/
#mw-related-navigation .sidebar-chunk {
background: #f8f9fa;
border: solid #eaecf0;
border-top-width: medium;
border-right-width: medium;
border-bottom-width: medium;
border-left-width: medium;
border-width: 1px 1px 0.2em;
padding: 1.25em 1.75em;
box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.02);
padding: 1.5em 1.5em 0;
margin: 1em 0;
margin-top: 1em;
line-height: 1.125;
word-wrap: break-word;
font-size: 0.95em;
margin-top: 50%;
}
/*Texto con nombre*/
#p-logo-text a {
padding: 0.1em 1em 0.2em;
color: #fff;
font-family: 'Linux Libertine', 'Times New Roman', 'Liberation Serif', 'Nimbus Roman', 'Noto Serif', 'Times', serif;
font-variant: small-caps;
font-size: 1.85em;
display: block;
z-index: auto;
margin-right: -5;
}
/*Segundo ajuste encabezado*/
#mw-header {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flexbox;
display: flex;
margin-left: -50%;
}
/*Colores de afuera*/
html,
body {
margin: 0;
padding: 0;
background-color: #e4e4e4;
}
/*Barra divisora*/
.color-left {
height: 0.35em;
background: #b32424;
width: 50%;
float: left;
display: none;
}
#mw-header-nav-hack,
#mw-header-hack {
position: fixed;
z-index: 97;
display: none;
box-shadow: 0 3px 3px 2px rgba(0, 0, 0, 0.075), 0 0 2px rgba(0, 0, 0, 0.2);
}
/*Logotipo*/
.mw-wiki-logo.fallback {
content: '';
width: 200px;
height: 90px;
background-repeat: no-repeat;
background-position: center center;
margin-top: -8%;
}
.mw-wiki-logo {
background-image: url(http://wikicafe.promecafe.net/resources/assets/logored1.png?86a63);
position:relative;
}
#p-logo-text {
min-width: 14em;
visibility: hidden;
}
#mw-header-container {
height: 0;
position: absolute;
z-index: 100;
top: 0;
width: 40%;
background: #e4e4e4;
color: #000000;
padding: 0.5em 0 0;
min-height: 3.125em;
box-sizing: border-box;
margin-top: 5%;
float: right;
margin-left: 50%;
}
#searchInput {
margin: 0;
height: 2.1em;
padding: 0.4em 4.5em 0.2em 2em;
box-shadow: none;
background: transparent;
width: 100%;
min-height: 0;
font-family: inherit;
border: #717171;
}
/*Fondo total*/
/*Ver inicio*/
/*Adornos busqsueda y usuario*/
#simpleSearch {
box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.05);
background: #ffffff;
position: relative;
border: solid 20px #71717163;
margin-top: -8%;
margin-left: -85%;
margin-right: -10%;
}
/*Herramientas personales*/
#personal {
display: inline-block;
position: relative;
padding-left: 1.5em;
line-height: 1;
margin-left:40%;
margin-right:-50%;
margin-top: -20%;
}
/*Bonton de busqueda*/
#searchButton,
#mw-searchButton {
position: absolute;
top: 0;
margin: 0;
margin-right: 0px;
padding: 0;
right: 1.2em;
width: 3.5em;
height: 2.1em;
text-indent: -99999px;
border: 0;
background-color: #609c42;
background-repeat: no-repeat;
background-image: url(/mediawiki/skins/Timeless/resources/images/search-ltr.png?2f518);
background-image: linear-gradient(transparent, transparent), url(http://wikicafe.promecafe.net/skins/Timeless/resources/images/search-ltr.svg?26600);
background-position: center 40%;
box-shadow: none;
margin-right: -3%;
}
/*Barra*/
.mw-body h1.firstHeading {
margin: 0.25em 0 0.5em;
border-bottom: solid 4px #b88c43;
}
/*Links*/
a {
color: #681a27;
}
a:hover {
color: #563c2d;
}
a:visited {
color: #b88c43;
}
.mw-parser-output a.external {
color: #681a27;
}
.tools-inline li.selected {
border-bottom-color: #b88c43;
}
#mw-site-navigation{
overflow:visible;
}
#mw-site-navigation .sidebar-chunk {
background: #f8f9fa;
border: solid #eaecf0;
border-top-width: medium;
border-right-width: medium;
border-bottom-width: medium;
border-left-width: medium;
border-width: 1px 1px 0.2em;
padding: 1.25em 1.75em;
box-shadow: 0 1px 2px 1px rgba(0,0,0,0.02);
padding: 1.5em 1.5em 0;
margin: 1em 0;
margin-top: 1em;
line-height: 1.125;
word-wrap: break-word;
font-size: 0.95em;
margin-top: 14%;
}
#p-logo {
text-align: center;
margin-left: 1%;
z-index:100;
}
/*Pie original*/
.mw-footer {
padding-top: 0.5em;
padding-bottom: 1em;
background-color: #681a27;
color:#fff;
}
/*´Pie de página*/
@import url('http://fonts.googleapis.com/css?family=Open+Sans:400,700');
footer{
position: fixed;
bottom: 0;
}
@media (max-height:800px){
footer { position: static; }
header { padding-top:40px; }
}
.footer-distributed{
box-sizing: border-box;
width: 100%;
text-align: left;
font: bold 16px sans-serif;
padding: 25px 25px 25px 25px;
margin-top: -5px;
}
.footer-distributed .footer-left,
.footer-distributed .footer-center,
.footer-distributed .footer-right{
display: inline-block;
vertical-align: top;
}
/* Footer left */
.footer-distributed .footer-left{
width: 31%;
}
.footer-distributed h3{
color: #ffffff;
font: normal 36px;
margin: 0;
}
/* The company logo */
.footer-distributed .footer-left img{
width: 30%;
}
.footer-distributed h3 span{
color: #e0ac1c;
}
/* Footer links */
.footer-distributed .footer-links{
color: #ffffff;
margin: 20px 0 12px;
}
.footer-distributed .footer-links a{
display:inline-block;
line-height: 1.8;
text-decoration: none;
color: inherit;
}
.footer-distributed .footer-company-name{
color: #fff;
font-size: 14px;
font-weight: normal;
margin: 0;
}
/* Footer Center */
.footer-distributed .footer-center{
width: 30%;
}
.footer-distributed .footer-center i{
color: #ffffff;
font-size: 25px;
width: 38px;
height: 38px;
border-radius: 50%;
text-align: center;
line-height: 42px;
margin: 1px 1px;
margin-left: 50px;
vertical-align: middle;
}
.footer-distributed .footer-center table{
margin-top: -5%;
}
.footer-distributed .footer-center i.fa-envelope{
font-size: 17px;
line-height: 38px;
}
.footer-distributed .footer-center p{
display: inline-block;
color: #ffffff;
vertical-align: top;
text-align: center;
margin-left: 50%;
}
.footer-distributed .footer-center p span{
display:block;
font-weight: normal;
font-size:14px;
line-height:2;
}
.footer-distributed .footer-center p a{
color: #e0ac1c;
text-decoration: none;;
}
/* Footer Right */
.footer-distributed .footer-right{
width:35%;
}
.footer-distributed .footer-company-about{
line-height: 20px;
color: #92999f;
font-size: 13px;
font-weight: normal;
margin: 0;
}
.footer-distributed .footer-company-about span{
display: block;
color: #ffffff;
font-size: 18px;
font-weight: bold;
margin-bottom: 20px;
}
.footer-distributed .footer-icons{
margin-top: 25px;
}
.footer-distributed .footer-icons a{
display: inline-block;
width: 35px;
height: 35px;
cursor: pointer;
border-radius: 2px;
font-size: 20px;
color: #ffffff;
text-align: center;
line-height: 35px;
margin-right: 3px;
margin-bottom: 5px;
}
/* Here is the code for Responsive Footer */
/* You can remove below code if you don't want Footer to be responsive */
@media (max-width: 880px) {
.footer-distributed .footer-left,
.footer-distributed .footer-center,
.footer-distributed .footer-right{
display: block;
width: 100%;
margin-bottom: 40px;
text-align: center;
}
.footer-distributed .footer-left img{
width: 100%;
max-width:150px;
}
.footer-distributed .footer-right img{
width: 93%;
max-width:150px;
margin-top: 25px;
margin-left: 18px;
margin-right: 35px;
}
#simpleSearch {
width: 275px;
margin-left: -95%;
border: solid 5px #71717163;
margin-top: -5%;
}
#personal h2 {
background-position: -5px 9px;
margin-left: -28%;
}
#personal {
margin-left: -650%;
margin-top: -150%;
margin-bottom: 500%;
}
#user-tools{
margin-right: 10%;
}
#mw-header{
background-color: #ffff;
height: 100%;
}
#searchButton{
margin-right: -7%;
}
.footer-distributed .footer-center i{
margin-left: 0;
}
}