Diferencia entre revisiones de «MediaWiki:Mobile.css»

Revisión actual - 17:09 2 nov 2022

/* Todos los CSS colocados aquí serán cargados para los usuarios del sitio móvil */

.schedulesplit { display: block; }

/* Color de links */
a:link, a:active, div#mw-panel div.portal div.body ul li a, div.vectorTabs li.selected a, div.vectorTabs li.selected a, div.vectorTabs li a {
  text-decoration: none;
  color: #378B00;
}

/* Color de links visitados */
a:visited, div#mw-panel div.portal div.body ul li a:visited, div.vectorTabs li.selected a:visited, div.vectorTabs li.selected a:visited {
  text-decoration: none;
  color: #008B2A;
}

/* Cosas atemporales de la piel */

#p-banner.mw-wiki-title {
  font-variant: normal;
  font-weight: bold;
  color: #7B1188;
}

/* Color de la barra superior */
.color-left,
.color-middle,
.color-right {
  background: #E7B928;
}

.mw-body h1, .mw-body h2, .mw-body h3, .mw-body h4, .mw-body h5, .mw-body h6,
.mw-body #firstHeading,
.mw-body #siteSub,
#p-banner.mw-wiki-title,
#personal h2,
#mw-content-text dt {
  font-family: 'Helvetica Neue','Nimbus Sans','Helvetica','Arial',sans-serif;
}

#mw-content-text dt {
  font-weight: bold;
}

/* Color de la cabecera de la barra lateral */
.sidebar-chunk h3#p-navigation-label { border-bottom: solid 2px #007edc; }
.sidebar-chunk h3#p-Splatoon-label { border-bottom: solid 2px #D6260E; }
.sidebar-chunk h3#p-Explore-label { border-bottom: solid 2px #CF4E06; }
.sidebar-chunk h3#p-Community-label { border-bottom: solid 2px #830b9c; }
.sidebar-chunk h3#p-tb-label { border-bottom: solid 2px #007edc; }
.sidebar-chunk h3#p-cactions-label { border-bottom: solid 2px #D6260E; }
.sidebar-chunk h3#p-userpagetools-label { border-bottom: solid 2px #CF4E06; }
.sidebar-chunk h3#p-pagemisc-label { border-bottom: solid 2px #830b9c; }
.sidebar-chunk h3#p-lang-label { border-bottom: solid 2px #007edc; }
.sidebar-chunk h3#p-normal-catlinks-label { border-bottom: solid 2px #CF4E06; }

#mw-content-container {
  border-bottom-color: #E7B928;
  padding-bottom: 0;
}

#mw-content {
  padding: .8em;
}

/* Corrige el problema de que aparezca un espacio vacío debajo del pie de página en algunos tamaños de pantalla */
@media (max-width: 1099px) {
  #mw-footer {
    padding-bottom: 0.5em;
  }
}

#mw-footer-container {
  background-image: url("//cdn.wikimg.net/en/splatoonwiki/images/b/b4/Featured-bg.png");
  background-repeat: repeat;
}

#mw-footer-container li,
#mw-footer-container a {
  color: #333;
}

@media(max-width: 850px) {
  table {
    display: block;
    overflow-x: auto;
    padding: 0 !important;
  }
}

/* Arregla el fallo visual en la leyenda de cambios recientes */
.mw-changeslist-legend .mw-collapsible-content dt {
  margin: 0 0.5em 0 0;
}

/* Corrige la posición de la flecha desplegable en las cabeceras de las secciones */
div.mw-ui-icon.mw-ui-icon-element {
  display: inline-block;
  line-height: 1em;
  min-height: 1em;
  min-width: 1em;
  width: 1em;
}
div.mw-ui-icon.mw-ui-icon-element::before {
  margin: 0;
}

/* Mejorar la visualización de los cambios recientes en el móvil */
#content .rcoptions {
  padding: 1em;
}
.rcfilters-head {
  overflow-x: auto;
}
td.mw-enhanced-rc {
  min-width: 73px;
  text-align: right;
  vertical-align: top;
}
.mw-changeslist {
  line-height: 1.5;
}

/*==================================================
  3D/2D Viewer
==================================================*/

/* 3D/2D viewer */
.container-2d {
  display: block;
  position: relative;
}

.viewer-2d {
  position: relative;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.switch-to-3d {
  position: absolute;
  top: 0;
  right: 0;
  background: url("https://cdn.wikimg.net/en/splatoonwiki/images/6/65/2D_icon.png");
  width: 92px;
  height: 48px;
  z-index: 999;
  opacity: 0.5;
  cursor :pointer;
  cursor: hand;
  transition: opacity 0.2s;
}

.switch-to-2d {
  position: absolute;
  top: 0;
  right: 0;
  background: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/7e/3D_icon.png");
  width: 92px;
  height: 48px;
  z-index: 999;
  opacity: 0.5;
  cursor: pointer;
  cursor: hand;
  transition: opacity 0.2s;
}

.switch-to-3d:hover, .switch-to-2d:hover {
  opacity: 1.0;
}

/* 3D model viewer */
.viewer-3d span {
    display: none;
}
.viewer-3d {
    margin: 4px;
    display: block;
    cursor: move;
    position: relative;
}
.viewer-3d-frame {
    position: absolute;
}
.viewer-3d-overlay {
    background: url("https://cdn.wikimg.net/en/splatoonwiki/images/e/ed/3D_rotation_icon.png") bottom right no-repeat;
    width: 100%;
    height: 100%;
    opacity: 0.5;
    position: relative;
}
/* End 3D model viewer */

/* New 3D viewer specific CSS */
.viewer-3d-container {
  display: block;
  padding: 2px;
  margin-left: auto;
  margin-right: auto;
  width: 288px;
}

.viewer-3d-container ul {
  padding: 0px;
  margin: 0px;
}
.viewer-3d-container ul li {
  display: block;
  margin: 0px;
  margin-top: 2px; /* For vertical spacing of the buttons */
  list-style: none;
  text-align: center;
}
.viewer-3d-container ul a {
  display: block;
  width: 134px;
  padding: 4px;
  text-decoration: none;
  font-size: 1.25em;
  opacity: .75;
}

.viewer-3d-container ul a:hover {
  opacity: 1;
}

.view-selector-default-left {
    border-radius: 10px;
    float: left;
    background: #e2e2e2;
}
.view-selector-default-right {
    border-radius: 10px;
    float: right;
    background: #e2e2e2;
}
.view-selector-default-full {
    border-radius: 10px;
    width: 100%;
    float: left;
    clear: both;
    background: #e2e2e2;
}
.view-selector-default-full a {
    width: 100% !important;
}

/* End new 3D viewer */

/******************************* Button icons ********************************/

/* Base icon element style */
.pro-icon,
.switch-icon {
	background       : currentcolor;
	display          : inline-block;
	height           : 28px;
	mask-size        : contain;
	vertical-align   : middle;
	width            : 28px;
	-webkit-mask-size: contain;
}

/* Icon URLs */
:root {
	--pro-icon-controller-outline: url("https://cdn.wikimg.net/en/splatoonwiki/images/3/35/Pro_Icon_Controller_Outline.svg");
	--pro-icon-d-pad-down: url("https://cdn.wikimg.net/en/splatoonwiki/images/d/df/Pro_Icon_D-Pad_Down.svg");
	--pro-icon-d-pad-left: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/7e/Pro_Icon_D-Pad_Left.svg");
	--pro-icon-d-pad-right: url("https://cdn.wikimg.net/en/splatoonwiki/images/2/2a/Pro_Icon_D-Pad_Right.svg");
	--pro-icon-d-pad-up: url("https://cdn.wikimg.net/en/splatoonwiki/images/8/89/Pro_Icon_D-Pad_Up.svg");
	--pro-icon-d-pad: url("https://cdn.wikimg.net/en/splatoonwiki/images/e/e8/Pro_Icon_D-Pad.svg");
	--pro-icon-gyro-pitch: url("https://cdn.wikimg.net/en/splatoonwiki/images/9/9c/Pro_Icon_Gyro_Pitch.svg");
	--pro-icon-gyro-roll: url("https://cdn.wikimg.net/en/splatoonwiki/images/5/55/Pro_Icon_Gyro_Roll.svg");
	--pro-icon-gyro-yaw: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/7d/Pro_Icon_Gyro_Yaw.svg");
	--switch-icon-a: url("https://cdn.wikimg.net/en/splatoonwiki/images/5/5a/Switch_Icon_A.svg");
	--switch-icon-b: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/7f/Switch_Icon_B.svg");
	--switch-icon-capture: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/77/Switch_Icon_Capture.svg");
	--switch-icon-home: url("https://cdn.wikimg.net/en/splatoonwiki/images/d/da/Switch_Icon_Home.svg");
	--switch-icon-l: url("https://cdn.wikimg.net/en/splatoonwiki/images/3/3e/Switch_Icon_L.svg");
	--switch-icon-left-stick-all: url("https://cdn.wikimg.net/en/splatoonwiki/images/0/0b/Switch_Icon_Left_Stick_All.svg");
	--switch-icon-left-stick-click: url("https://cdn.wikimg.net/en/splatoonwiki/images/5/58/Switch_Icon_Left_Stick_Click.svg");
	--switch-icon-left-stick-down: url("https://cdn.wikimg.net/en/splatoonwiki/images/e/e2/Switch_Icon_Left_Stick_Down.svg");
	--switch-icon-left-stick-left-right: url("https://cdn.wikimg.net/en/splatoonwiki/images/4/49/Switch_Icon_Left_Stick_Left-Right.svg");
	--switch-icon-left-stick-left: url("https://cdn.wikimg.net/en/splatoonwiki/images/9/95/Switch_Icon_Left_Stick_Left.svg");
	--switch-icon-left-stick-right: url("https://cdn.wikimg.net/en/splatoonwiki/images/1/14/Switch_Icon_Left_Stick_Right.svg");
	--switch-icon-left-stick-up-down: url("https://cdn.wikimg.net/en/splatoonwiki/images/0/06/Switch_Icon_Left_Stick_Up-Down.svg");
	--switch-icon-left-stick-up: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/7c/Switch_Icon_Left_Stick_Up.svg");
	--switch-icon-left-stick: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/73/Switch_Icon_Left_Stick.svg");
	--switch-icon-minus: url("https://cdn.wikimg.net/en/splatoonwiki/images/6/6d/Switch_Icon_Minus.svg");
	--switch-icon-plus: url("https://cdn.wikimg.net/en/splatoonwiki/images/c/c9/Switch_Icon_Plus.svg");
	--switch-icon-r: url("https://cdn.wikimg.net/en/splatoonwiki/images/d/d0/Switch_Icon_R.svg");
	--switch-icon-right-stick-all: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/73/Switch_Icon_Right_Stick_All.svg");
	--switch-icon-right-stick-click: url("https://cdn.wikimg.net/en/splatoonwiki/images/d/d8/Switch_Icon_Right_Stick_Click.svg");
	--switch-icon-right-stick-down: url("https://cdn.wikimg.net/en/splatoonwiki/images/4/47/Switch_Icon_Right_Stick_Down.svg");
	--switch-icon-right-stick-left-right: url("https://cdn.wikimg.net/en/splatoonwiki/images/a/a2/Switch_Icon_Right_Stick_Left-Right.svg");
	--switch-icon-right-stick-left: url("https://cdn.wikimg.net/en/splatoonwiki/images/b/b1/Switch_Icon_Right_Stick_Left.svg");
	--switch-icon-right-stick-right: url("https://cdn.wikimg.net/en/splatoonwiki/images/f/f2/Switch_Icon_Right_Stick_Right.svg");
	--switch-icon-right-stick-up-down: url("https://cdn.wikimg.net/en/splatoonwiki/images/c/c1/Switch_Icon_Right_Stick_Up-Down.svg");
	--switch-icon-right-stick-up: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/78/Switch_Icon_Right_Stick_Up.svg");
	--switch-icon-right-stick: url("https://cdn.wikimg.net/en/splatoonwiki/images/f/f6/Switch_Icon_Right_Stick.svg");
	--switch-icon-sl: url("https://cdn.wikimg.net/en/splatoonwiki/images/3/35/Switch_Icon_SL.svg");
	--switch-icon-sr: url("https://cdn.wikimg.net/en/splatoonwiki/images/c/c3/Switch_Icon_SR.svg");
	--switch-icon-x: url("https://cdn.wikimg.net/en/splatoonwiki/images/2/24/Switch_Icon_X.svg");
	--switch-icon-y: url("https://cdn.wikimg.net/en/splatoonwiki/images/c/c5/Switch_Icon_Y.svg");
	--switch-icon-zl: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/79/Switch_Icon_ZL.svg");
	--switch-icon-zr: url("https://cdn.wikimg.net/en/splatoonwiki/images/1/1e/Switch_Icon_ZR.svg");
}

/* Icon styles */
.pro-icon.controller-outline { mask-image: var(--pro-icon-controller-outline); -webkit-mask-image: var(--pro-icon-controller-outline); }
.pro-icon.d-pad-down { mask-image: var(--pro-icon-d-pad-down); -webkit-mask-image: var(--pro-icon-d-pad-down); }
.pro-icon.d-pad-left { mask-image: var(--pro-icon-d-pad-left); -webkit-mask-image: var(--pro-icon-d-pad-left); }
.pro-icon.d-pad-right { mask-image: var(--pro-icon-d-pad-right); -webkit-mask-image: var(--pro-icon-d-pad-right); }
.pro-icon.d-pad-up { mask-image: var(--pro-icon-d-pad-up); -webkit-mask-image: var(--pro-icon-d-pad-up); }
.pro-icon.d-pad { mask-image: var(--pro-icon-d-pad); -webkit-mask-image: var(--pro-icon-d-pad); }
.pro-icon.gyro-pitch { mask-image: var(--pro-icon-gyro-pitch); -webkit-mask-image: var(--pro-icon-gyro-pitch); }
.pro-icon.gyro-roll { mask-image: var(--pro-icon-gyro-roll); -webkit-mask-image: var(--pro-icon-gyro-roll); }
.pro-icon.gyro-yaw { mask-image: var(--pro-icon-gyro-yaw); -webkit-mask-image: var(--pro-icon-gyro-yaw); }
.switch-icon.a { mask-image: var(--switch-icon-a); -webkit-mask-image: var(--switch-icon-a); }
.switch-icon.b { mask-image: var(--switch-icon-b); -webkit-mask-image: var(--switch-icon-b); }
.switch-icon.capture { mask-image: var(--switch-icon-capture); -webkit-mask-image: var(--switch-icon-capture); }
.switch-icon.home { mask-image: var(--switch-icon-home); -webkit-mask-image: var(--switch-icon-home); }
.switch-icon.l { mask-image: var(--switch-icon-l); -webkit-mask-image: var(--switch-icon-l); }
.switch-icon.left-stick-all { mask-image: var(--switch-icon-left-stick-all); -webkit-mask-image: var(--switch-icon-left-stick-all); }
.switch-icon.left-stick-click { mask-image: var(--switch-icon-left-stick-click); -webkit-mask-image: var(--switch-icon-left-stick-click); }
.switch-icon.left-stick-down { mask-image: var(--switch-icon-left-stick-down); -webkit-mask-image: var(--switch-icon-left-stick-down); }
.switch-icon.left-stick-left-right { mask-image: var(--switch-icon-left-stick-left-right); -webkit-mask-image: var(--switch-icon-left-stick-left-right); }
.switch-icon.left-stick-left { mask-image: var(--switch-icon-left-stick-right); -webkit-mask-image: var(--switch-icon-left-stick-right); }
.switch-icon.left-stick-right { mask-image: var(--switch-icon-left-stick-right); -webkit-mask-image: var(--switch-icon-left-stick-right); }
.switch-icon.left-stick-up-down { mask-image: var(--switch-icon-left-stick-up-down); -webkit-mask-image: var(--switch-icon-left-stick-up-down); }
.switch-icon.left-stick-up { mask-image: var(--switch-icon-left-stick-up); -webkit-mask-image: var(--switch-icon-left-stick-up); }
.switch-icon.left-stick { mask-image: var(--switch-icon-left-stick); -webkit-mask-image: var(--switch-icon-left-stick); }
.switch-icon.minus { mask-image: var(--switch-icon-minus); -webkit-mask-image: var(--switch-icon-minus); }
.switch-icon.plus { mask-image: var(--switch-icon-plus ); -webkit-mask-image: var(--switch-icon-plus ); }
.switch-icon.r { mask-image: var(--switch-icon-r); -webkit-mask-image: var(--switch-icon-r); }
.switch-icon.right-stick-all { mask-image: var(--switch-icon-right-stick-all); -webkit-mask-image: var(--switch-icon-right-stick-all); }
.switch-icon.right-stick-click { mask-image: var(--switch-icon-right-stick-click); -webkit-mask-image: var(--switch-icon-right-stick-click); }
.switch-icon.right-stick-down { mask-image: var(--switch-icon-right-stick-down); -webkit-mask-image: var(--switch-icon-right-stick-down); }
.switch-icon.right-stick-left-right { mask-image: var(--switch-icon-right-stick-left-right); -webkit-mask-image: var(--switch-icon-right-stick-left-right); }
.switch-icon.right-stick-left { mask-image: var(--switch-icon-right-stick-left); -webkit-mask-image: var(--switch-icon-right-stick-left); }
.switch-icon.right-stick-right { mask-image: var(--switch-icon-right-stick-right); -webkit-mask-image: var(--switch-icon-right-stick-right); }
.switch-icon.right-stick-up-down { mask-image: var(--switch-icon-right-stick-up-down); -webkit-mask-image: var(--switch-icon-right-stick-up-down); }
.switch-icon.right-stick-up { mask-image: var(--switch-icon-right-stick-up); -webkit-mask-image: var(--switch-icon-right-stick-up); }
.switch-icon.right-stick { mask-image: var(--switch-icon-right-stick); -webkit-mask-image: var(--switch-icon-right-stick); }
.switch-icon.sl { mask-image: var(--switch-icon-sl); -webkit-mask-image: var(--switch-icon-sl); }
.switch-icon.sr { mask-image: var(--switch-icon-sr); -webkit-mask-image: var(--switch-icon-sr); }
.switch-icon.x { mask-image: var(--switch-icon-x); -webkit-mask-image: var(--switch-icon-x); }
.switch-icon.y { mask-image: var(--switch-icon-y); -webkit-mask-image: var(--switch-icon-y); }
.switch-icon.zl { mask-image: var(--switch-icon-zl); -webkit-mask-image: var(--switch-icon-zl); }
.switch-icon.zr { mask-image: var(--switch-icon-zr); -webkit-mask-image: var(--switch-icon-zr); }



/******************************* Infobox styles *******************************/

/* Supporting CSS for Template:GearCategory */
:root {
	--gear-icon-clothing: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/78/S2_Icon_Clothing.png");
	--gear-icon-headgear: url("https://cdn.wikimg.net/en/splatoonwiki/images/1/12/S2_Icon_Headgear.png");
	--gear-icon-shoes: url("https://cdn.wikimg.net/en/splatoonwiki/images/a/a5/S2_Icon_Shoes.png");
}
.gear-category {
	display: inline-block;
	position: relative;
	vertical-align: middle;
}
.gear-category a,
.gear-category a:hover{
	display: block;
	height: 100%;
	left: 0;
	position: absolute;
	text-decoration: none;
	top: 0;
	width: 100%;
}
.gear-category::before {
	background: currentcolor;
	content: "";
	height: 100%;
	left: 0;
	mask-position: center;
	mask-repeat: no-repeat;
	mask-size: contain;
	opacity: 0.6;
	position: absolute;
	top: 0;
	width: 100%;
	-webkit-mask-position: center;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: contain;
}
.gear-category.Clothing::before {
	mask-image: var(--gear-icon-clothing);
	-webkit-mask-image: var(--gear-icon-clothing);
}
.gear-category.Headgear::before {
	mask-image: var(--gear-icon-headgear);
	-webkit-mask-image: var(--gear-icon-headgear);
}
.gear-category.Shoes::before {
	mask-image: var(--gear-icon-shoes);
	-webkit-mask-image: var(--gear-icon-shoes);
}

/* New infobox implementation styles */
.infobox {
	box-shadow: 0 0 16px var(--page, #ffffff) inset;
}