MediaWiki:Common.css: mudanças entre as edições

De bROWiki
Ir para navegação Ir para pesquisar
mSem resumo de edição
Sem resumo de edição
 
(Uma revisão intermediária pelo mesmo usuário não está sendo mostrada)
Linha 43: Linha 43:
margin: 1em 0em 0em;
margin: 1em 0em 0em;
padding: 2px;
padding: 2px;
text-align: center;
width: 100%;
width: 100%;
}
}
Linha 159: Linha 158:




/* Tabelas */


.tile-row {
display: flex;
flex-flow: row wrap;
margin-bottom: 1em;
}


.tile-halves {
display: flex;
flex-flow: row wrap;
border: 1px solid #e4eaee;
background: #ffffff;
box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.1);
}


.tile-halves h2 {
font-size: 1.4em;
font-weight: bold;
border: none;
margin: 0 0 0.4em;
}

.tile-halves .byline + h2 {
margin-top: -0.5em;
}

.tile-top {
width: 100%;
padding: 1.3rem 1.5rem 0.6rem;
}

.tile-top.tile-image {
display: flex;
align-items: center;
background-color: #949eaa;
overflow: hidden;
padding: 0;
height: 13vw;
max-height: 12em;
}

.tile-top.tile-image a {
width: 100%;
}

.tile-top.tile-image img {
width: 100%;
height: auto;
transition: 0.4s ease-out;
}

.tile-bottom {
background: #ffffff;
border-top: 1px solid #e4eaee;
width: 100%;
padding: 1rem 1.5rem 0.6rem;
}

.tile-bottom.link-button {
align-self: flex-end;
padding: 0;
}

.tile-bottom.link-button a {
display: block;
text-align: center;
padding: 0.75em 1.5em 0.8em;
text-decoration: none;
}

.tile-bottom.read-more {
background: #f9fafa;
transition: 0.3s ease-out;
}

.tile-bottom.read-more a {
color: #949eaa;
font-weight: bold;
text-align: right;
}

.tile-bottom.read-more:hover {
background: #f2f4f4;
}

.tile-bottom.read-more:hover .arrow {
transform: translateX(50%);
}

.tile-bottom.read-more .arrow {
filter: invert(43%) sepia(50%) hue-rotate(175deg);
margin-left: 0.4em;
transition: 0.3s ease-out;
}

.mainpage-recent-updates .tile-halves {
flex: 1;
align-content: flex-start;
margin-right: 0.9rem;
}

.mainpage-recent-updates .tile-halves:hover .tile-top img {
transform: scale(1.04);
}

.mainpage-recent-updates .tile-halves:last-child {
margin-right: 0;
}

body.wgl-readermode .mainpage-recent-updates .tile-image {
max-height: 10.5em;
}

.mainpage-recent-updates .tile-bottom.link-button a {
text-align: left;
padding: 1rem 1.5rem 0.75rem;
}

.mainpage-recent-updates h2 {
margin: -0.5em 0 0.3em;
}

.mainpage-recent-updates p:not(.byline) {
font-size: 0.9em;
line-height: 1.75em;
color: #444e5a;
}

.mainpage-recent-updates .jagex-promotion .byline {
color: #855cd8;
}

.mainpage-contents .tile-halves {
flex: 1;
margin-right: 0.9rem;
}

.mainpage-contents .tile-halves:hover .tile-top img {
transform: scale(1.04);
}

.mainpage-contents .tile-halves:last-child {
margin-right: 0;
}

.mainpage-contents .tile-top {
height: 4.5rem;
position: relative;
}

.mainpage-contents .tile-top h2 a {
display: block;
text-align: center;
text-decoration: none;
line-height: 4.5rem;
padding-left: 0.45rem;
}

.mainpage-contents h2 {
margin: 0;
padding: 0;
}





Edição atual tal como às 14h51min de 30 de agosto de 2021

/** o código CSS colocado aqui será aplicado a todos os temas
    * Antes de realizar quaisquer alterações deve-se informar aos desenvolvedores do site
    * Alterações aqui realizadas afetarão no desempenho da wiki, cuidado, realize sempre um backup da página 


 *********** Tabela de conteúdo ***************
 1 - Menu principal, barra esquerda
 2 - Função Collapsible (Mostrar/esconder tabelas)
 3 - NavBox 
 4 - Wikitablec
 5 - Metrolook
**************************************************
*/

/*  1 - MENU PRINCIPAL, BARRA ESQUERDA */

div.barraprincipal {
    background-image:url(/w/images/b/b1/Seilá.png);
    background-repeat:no-repeat;
}


/*  2 - FUNÇÃO COLLAPSIBLE (MOSTRAR/ESCONDER TABELAS) */

table.collapsed tr.collapsible {
        display: none;
}
 
.collapseButton {               /* Mostrar/esconder botões em tabelas de conteúdos */
        float: right;           /* JavaScript de Collapsible está localizado em [[MediaWiki:Common.js]] */
        font-weight: normal;    /* O estilo destas tabelas são permitidas */
        text-align: right;
        width: auto;
}

/* 3 - NAVBOX */

table.navbox {
    background-color: #f9f9f9;
    border: 1px solid #aaa;
    clear: both;
    font-size: 90%;
    margin: 1em 0em 0em;
    padding: 2px;
    width: 100%;
}

table.navbox th {
    background-color: #90EE90;
    padding-left: 1em;
    padding-right: 1em;
}

table.navbox tr:not(:first-child) th {
    background-color: #90EE90;
}


.collapseButton {
    float: right;
    font-weight: normal;
    text-align: right;
    width: auto;
}

@media print {
    .navbox {
        display: none;
    }
}

/*   Wikitablek */

table.wikitablec,
table.prettytable {
  margin: 1em 1em 1em 0;
  background: #f9f9f9;
  border: 1px #aaa solid;
  border-collapse: collapse;
}

table.wikitablecenter, 
table.prettytable {
  margin-left: auto;
  margin-right: auto;
  background: #f9f9f9;
  border: 1px #aaa solid;
  border-collapse: collapse;
} 

table.wikitablec th, table.wikitablec td,
table.prettytable th, table.prettytable td {
  border: 1px #aaa solid;
  padding: 0.2em;
  text-align: center;
}

table.wikitablec th,
table.prettytable th {
  background: #f2f2f2;
  text-align: center;
}

table.wikitablec caption,
table.prettytable caption {
  margin-left: inherit;
  margin-right: inherit;
  font-weight: bold;
}

table.prettytablec code,
table.wikitablec code {
  background-color: transparent;
}

table.wikitablecenter th, table.wikitablecenter td,
table.prettytable th, table.prettytable td {
  border: 1px #aaa solid;
  padding: 0.2em;
  text-align: center;
}

table.wikitablecenter th,
table.prettytable th {
  background: #f2f2f2;
  text-align: center;
}

table.wikitablecenter caption,
table.prettytable caption {
  margin-left: inherit;
  margin-right: inherit;
  font-weight: bold;
}

table.prettytablecenter code,
table.wikitablecenter code {
  background-color: transparent;
}

table.elements {}

table.elements th, table.elements td {
	padding: 0.5em;
}

td.effective {
	background-color: #BFFFBF;
}

td.ineffective {
	background-color: #FFBF7F;
}

td.nullified {
	background-color: #FFBFBF;
}


/*   Tabelas */

.tile-row {
    display: flex;
    flex-flow: row wrap;
    margin-bottom: 1em;
}

.tile-halves {
    display: flex;
    flex-flow: row wrap;
    border: 1px solid #e4eaee;
    background: #ffffff;
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.1);
}

.tile-halves h2 {
    font-size: 1.4em;
    font-weight: bold;
    border: none;
    margin: 0 0 0.4em;
}

.tile-halves .byline + h2 {
    margin-top: -0.5em;
}

.tile-top {
    width: 100%;
    padding: 1.3rem 1.5rem 0.6rem;
}

.tile-top.tile-image {
    display: flex;
    align-items: center;
    background-color: #949eaa;
    overflow: hidden;
    padding: 0;
    height: 13vw;
    max-height: 12em;
}

.tile-top.tile-image a {
    width: 100%;
}

.tile-top.tile-image img {
    width: 100%;
    height: auto;
    transition: 0.4s ease-out;
}

.tile-bottom {
    background: #ffffff;
    border-top: 1px solid #e4eaee;
    width: 100%;
    padding: 1rem 1.5rem 0.6rem;
}

.tile-bottom.link-button {
    align-self: flex-end;
    padding: 0;
}

.tile-bottom.link-button a {
    display: block;
    text-align: center;
    padding: 0.75em 1.5em 0.8em;
    text-decoration: none;
}

.tile-bottom.read-more {
    background: #f9fafa;
    transition: 0.3s ease-out;
}

.tile-bottom.read-more a {
    color: #949eaa;
    font-weight: bold;
    text-align: right;
}

.tile-bottom.read-more:hover {
    background: #f2f4f4;
}

.tile-bottom.read-more:hover .arrow {
    transform: translateX(50%);
}

.tile-bottom.read-more .arrow {
    filter: invert(43%) sepia(50%) hue-rotate(175deg);
    margin-left: 0.4em;
    transition: 0.3s ease-out;
}

.mainpage-recent-updates .tile-halves {
    flex: 1;
    align-content: flex-start;
    margin-right: 0.9rem;
}

.mainpage-recent-updates .tile-halves:hover .tile-top img {
    transform: scale(1.04);
}

.mainpage-recent-updates .tile-halves:last-child {
    margin-right: 0;
}

body.wgl-readermode .mainpage-recent-updates .tile-image {
    max-height: 10.5em;
}

.mainpage-recent-updates .tile-bottom.link-button a {
    text-align: left;
    padding: 1rem 1.5rem 0.75rem;
}

.mainpage-recent-updates h2 {
    margin: -0.5em 0 0.3em;
}

.mainpage-recent-updates p:not(.byline) {
    font-size: 0.9em;
    line-height: 1.75em;
    color: #444e5a;
}

.mainpage-recent-updates .jagex-promotion .byline {
    color: #855cd8;
}

.mainpage-contents .tile-halves {
    flex: 1;
    margin-right: 0.9rem;
}

.mainpage-contents .tile-halves:hover .tile-top img {
    transform: scale(1.04);
}

.mainpage-contents .tile-halves:last-child {
    margin-right: 0;
}

.mainpage-contents .tile-top {
    height: 4.5rem;
    position: relative;
}

.mainpage-contents .tile-top h2 a {
    display: block;
    text-align: center;
    text-decoration: none;
    line-height: 4.5rem;
    padding-left: 0.45rem;
}

.mainpage-contents h2 {
    margin: 0;
    padding: 0;
}



/* 5 - METROLOOK */



/*

@import "mediawiki.mixins";

#mw-page-base {
	background-color: darkseagreen !important;
	background-image: none;
}

@media (max-width:768px) {
#mw-page-base {
	background-color: darkseagreen;
}
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
#mw-page-base {
	background-color: darkseagreen;
}
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
#mw-page-base {
	background-color: darkseagreen;
}
}

div.vectorTabs a:hover {
	background-color: mediumseagreen;
}

div.onhoverbg:hover {
	background-color: mediumseagreen;
}

img.downarrow:hover{
	background-color: mediumseagreen;
}

div.vectorMenu:hover h5 a {
	background-color: mediumseagreen;
}

div.vectorMenu h5 a {
	background-color: darkseagreen; 
}

div.vectorMenu:hover {
	background-color: mediumseagreen;
}

div.vectorMenu ul {
	border: solid 2px darkseagreen;
	border-top: none;

}


@media (max-width: 768px) {
#hamburgerIcon:hover {
	background-color: mediumseagreen;
}

img.editbutton:hover {
	background-color: mediumseagreen;
}

div.actionmenu ul {
	border-top: solid 2px darkseagreen;
}

#left-navigation {
	background-color: darkseagreen;
}
}*/