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

Edição atual tal como às 20h00min de 6 de abril de 2024

Exibir código-fonte para MediaWiki:Mobile.css
← MediaWiki:Mobile.css
Ir para navegaçãoIr para pesquisar
Você não possui permissão para editar esta página, pelos motivos a seguir:

A ação que você tentou executar está limitada a usuários do grupo: Usuários.
Esta página fornece texto de interface ao software deste wiki, se encontrando protegida para prevenir abusos. Para adicionar ou alterar traduções em todos os wikis, utilize o translatewiki.net, projeto de traduções do MediaWiki.
Não tem permissão para editar esta página de CSS porque ela pode afetar todos os visitantes.
Você pode ver e copiar o código desta página.

/** o código CSS colocado aqui será aplicado a todos os temas */

/* Main page */


.container {
    margin: 0 auto;
    display: block;
}

.main {
    margin: 1em;
}

.banner {
    margin-top: 60px;
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.5);
    --border-width: 3px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    color: white;
    background: linear-gradient(60deg,#0562ae 0%, #007ee5 46%,#289eff 100%);
    background-size: 300% 300%;
    background-position: 0 50%;
    animation: moveGradient 30s alternate infinite;
    border-radius: 10px;
}

.banner img {
    width: 450px;
}

.most-acessed, .quick-access {
    margin-top: 2em;
    position: relative;
    width: 100%;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
    border-radius: 10px;
}

.ma-title,.qa-title {
    border-radius: 10px 10px 0px 0px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    color: white;
    height: auto;
    padding: 5px 0px;
    background: linear-gradient(60deg,#0562af,#0273cf,#0380e7,#1992f5,#5fb6ff,#1864c7,#034d89);
}

.sub-most-acessed{
    display: flex;
}
.ma-card-item {
    text-align: center;
    height: auto;
    padding: 1em;
}

.ma-card-item a{
    text-decoration: none;
}

.ma-item {
    height: 100%;
    transition: 1s;
}

.ma-item:hover{
    filter: drop-shadow(2px 2px 2px rgba(34, 34, 34, 0.2));
}

.ma-text{    
    width: 50%;
    margin: 5px;
    transform: scale(2.7);
}

.ma-title-icon, .qa-title-icon {
    width: 30px;
    height: 30px;
}

.column {
    text-align: center;
    margin: 1em;
}

.social-media {   
    position: absolute; 
    top: -60px;
    text-align: center;
    height: 50px;
}

.sc-icon {
    filter: grayscale(20%) contrast(100%);
    display: inline-block;
    width: 12%;
    margin: -1px;
    height: auto;
    transition: 1s;
}



.box-update {
    margin: 1em;
    width: auto;
    height: auto;
    padding: 10px;
    border-radius: 10px;
    border: 1px solid rgba(0, 17, 0, 0.10);
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
}

.box-update h3{
    margin-top: 10px;
}

.box-update img {
    margin: 0.5em 0em;
    filter: grayscale(15%);
    transform: scale(.95);
    width: 100%;
    border-radius: 5px;
    transition: 1s;
}

.box-update img:hover {
    filter: grayscale(0%);
    transform: scale(0.98);
    transition: 1s;
}

.update-image {
    box-shadow: 0 0 0.6 3em #BBB;
}

.destaque-box {
    width: 100%;
    text-align: center;
    position: relative;
    transition: 1s;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    font-weight: bold;
}

.destaque-box:hover{
    transition: 1s;
    transform: scale(1.01);
}

.destaque-box img{
    vertical-align: middle;
    width: 100%;
    border-radius: 6px;
    border-top: 10px solid #3498db;
    object-fit: cover;
}

.destaque-box a{
    width: 100%;
}

.qa-line {
    display: flex;
    border-bottom: 1px solid rgba(0, 0, 0, 0.150);
    padding: 1rem;
}

.qa-line-icon {
    display: none;
}

.qa-line-icon img {
    width: 50px;
    height: 50px;
    margin: 1rem;
    border-radius: 12px;
}

.qa-line-text {
    margin: 0.5rem 0;
    width: 100%;
}

.qa-line-title {
    margin: 0.5em 0;
    font-weight: bold;
}

pre, .mw-code {
    color: #000; 
    background-color: rgb(234 236 240 / 0%);
    border: 1px solid rgb(234 236 240 / 0%);
    padding: 0; */
    white-space: pre-wrap;
}

.post-title{
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.5);
    --border-width: 3px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 90%;
    margin: auto;
    font-weight: bold;
    font-family: Lato, sans-serif;
    font-size: 1rem;
    color: white;
    background: linear-gradient(90deg,#0562af,#0273cf,#0380e7,#1992f5,#5fb6ff,#1864c7,#034d89);
    background-size: 300% 300%;
    background-position: 0 50%;
    animation: moveGradient 30s alternate infinite;
    border-radius: 10px;
}

.card__heading a {
    color: white;
}

.sc-icon {
    display: inline-block;
    width: 12%;
    margin: -1px;
    height: auto;
    transition: 1s;
}

.sc-icon:hover {
    filter: grayscale(0%) contrast(115%);
    transition: 1s;
    transform: scale(1.10);
}

p.card__heading {
    font-size: 1.2em;
    font-weight: bold;
}


:root{
  --background-dark: #2d3548;
  --text-light: rgba(255,255,255,0.6);
  --text-lighter: rgba(255,255,255,0.9);
  --spacing-s: 8px;
  --spacing-m: 16px;
  --spacing-l: 24px;
  --spacing-xl: 32px;
  --spacing-xxl: 64px;
  --width-container: 1200px;
}

.hero-section{    
    margin: 5%;
    padding-bottom: 53%;
}

.hero-section2{    
    margin: 5%;
    padding-bottom: 88%;
}

.card-grid{
  display: grid;
  width: 100%;
}

.card{
  list-style: none;
  position: relative;
}

.card:before{
  content: '';
  display: block;
  width: 100%;
}

.card__background{
  width: 100%;
  height: auto;
  background-size: cover;
  background-position: center;
  bottom: 0;
  filter: brightness(0.95) saturate(1) contrast(0.95);
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transform-origin: center;
  trsnsform: scale(1) translateZ(0);
  transition: 
    filter 1s,
    transform 1s;
}

.card:hover .card__background{
  transform: scale(1.05) translateZ(0);
}

.card__content{
  left: 0;
  margin: var(--spacing-l);
  position: absolute;
  top: 0;
  text-align: left;
}

.card__category{
  color: var(--text-light);
  font-size: 0.9rem;
  margin-bottom: var(--spacing-s);
  text-transform: uppercase;
}

.card__heading{
  color: var(--text-lighter);
  font-size: 1.9rem;
  text-shadow: 2px 2px 20px rgba(0,0,0,0.2);
  line-height: 1.4;
}

h3.card__heading {
    margin-top: -10px;
}


/* Keyframes */
@keyframes moveGradient {
    50% {
        background-position: 100% 50%;
    }
}


/* Media Query */

@media (min-width: 450px) {
  .banner {
    margin-top: 80px; 
  }
  .social-media {
    top: -80px;
  }
}

@media (min-width: 600px) {
  .banner {
    margin-top: 110px; 
  }
  .social-media {
    top: -110px;
  }
}

@media (min-width: 910px) {
  .banner {
    margin-top: 140px; 
  }
  .social-media {
    top: -140px;
  }
}

/* Página Instagram */

.insta-main{
    width: 100%;
    margin: 1em;
    margin: auto;
}
.post{
    width: 100%;
    height: auto;
    background: #fff;
    border: 1px solid #dfdfdf;
    margin-top: 40px;
    border-radius: 10px;
}

.info{
    width: 100%;
    height: 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 5px 15px;
}

.info .username{
    width: auto;
    font-weight: bold;
    color: #000;
    font-size: 14px;
    margin-left: 10px;
}

.info .options{ 
    cursor: pointer;
    margin-right: 20px;
    scale: 0.8;
}

.info .user{
    display: flex;
    align-items: center;
}

.info .profile-pic{
    height: 40px;
    width: 40px;
    padding: 0;
    background: none;
}

.info .profile-pic img{
    border-radius: 20px;
}

.post-image{
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin-top: -10px;
width: 100%;
    height: 100%;
    /* object-fit: cover; */
    margin-top: -10px;
}

.post-content{
    width: 100%;
    padding: 20px;
}

.likes{
    font-weight: bold;
}

.description{
    width: 96%;
    font-size: 14px;
    line-height: 20px;
}

.description span{
    font-weight: bold;
    margin-right: 10px;
}

.post-time{
    color: rgba(0, 0, 0, 0.5);
    font-size: 12px;
}

.comment-wrapper{
    width: 100%;
    height: 50px;
    border-radius: 1px solid #dfdfdf;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.comment-wrapper .icon{
    height: 30px;
}

.comment-box{
    width: 80%;
    height: 100%;
    border: none;
    outline: none;
    font-size: 14px;
}

.comment-btn,
.action-btn{
    width: 70px;
    height: 100%;
    background: none;
    border: none;
    outline: none;
    text-transform: capitalize;
    font-size: 16px;
    color: rgb(0, 162, 255);
    opacity: 0.5;
}

.reaction-wrapper{
    width: 100%;
    height: 50px;
    display: flex;
    margin-top: -25px;
    align-items: center;
}

.reaction-wrapper .icon{
    margin-right: 15px;
}

/* Testes */
.box{
    text-align: center;
    box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.5);
    border-radius: 10px;
    padding-bottom: 10px;
}

.box-title{	
    border: 1px solid #570101;
    width: 100%;
    height: 54px;
    margin-top: 2rem;
    background-color: #0562ae;
    border-radius: 10px 10px 0px 0px;

}

.box-title p{
    font-size: 22px;
    color: white;
    position: relative;
    top: 35%;
    transform: translateY(-50%); 
}
.update-box{
    margin-bottom: 20px
}

.update-box, .update-box-2{
    width: 90%;
    text-align: center;    
    position: relative;
    margin: 20px auto;
    transition: 1s;
    border-radius: 20px;
    display: flex; 
    justify-content: center;
    font-weight: bold;

}
.update-box-2:hover, .update-box:hover{
    transition: 1s;
    transform: scale(1.05);
}

.update-box img, .update-box-2 img{
    border: 0;
    vertical-align: middle;
    width: 100%;
    height: 100%;
}

.update-box-2 a, .update-box a{
    width: 100%;
    
}
.update-title{    
    width: 100%;
    height: 42px;
    position: absolute;
    top: 0;
    font-size: 15px;
    border-radius: 20px 20px 0px 0px;
}

.update-title a{    
    color: white;
}

.update-subtitle{
    width: 100%;
    height: 50px;
    position: absolute;
    bottom: 0;
    font-size: 15px;
    border-radius: 0px 0px 20px 20px;
}

.update-box-subtitle{
    position: relative;
    top: 50%;
    color: white;
    font-size: 1.2em;
    transform: translateY(-50%); 
}

.patch-notes{
    padding: 20px;
    background-color: #ffffff;
    border-radius: 30px;
    border: 1px solid #cccccc;
    margin-bottom: 20px;
}

.patch-notes img{
    float: right;
    width: 100px;
    height: 100px;
    border-radius: 50px;
}


.container-tab table{
    text-align: center;
	width: 100%;
	border-collapse: collapse;
    display: inline-table;
	overflow: hidden;
	box-shadow: 0 0 20px rgba(0,0,0,0.1);
    border: 1px solid gray;
}

.container-tab th,
.container-tab td {
    padding: 15px 5px;
	background-color: rgba(255,255,255,0.2);
    border: 1px solid gray;
    text-align: center;
}

.container-tab th {
	text-align: center;
    border: 1px solid gray;
}

.container-tab tbody {
	tr {
		&:hover {
			background-color:  rgb(10 234 58 / 20%);
		}
	}
	td {
		position: relative;
		&:hover {
			&:before {
				content: "";
				position: absolute;
				left: 0;
				right: 0;
				top: -9999px;
				bottom: -9999px;
				background-color: rgb(234 10 10 / 20%);
				z-index: -1;
			}
		}
	}
}

.celula-neutra {
    backdrop-filter: invert(30%);
}

table {
    border-collapse: separate;
}
/* DarkMode */

Retornar para MediaWiki:Mobile.css.

Menu de navegação
Entrar
Ver histórico
Pesquisa
Pesquisar em PokeZBr Wiki
Página principal
Jogue otPokémon
Inicial
Baixar Jogo
Criar Conta
Doações
Gerenciar Conta
Regras
Suporte
Vip Shop
Jogabilidade
Clãs
Daily Boss
Day Care
Elite Four
Experience Groups
Gym Leaders
Held Item
Horde Leader
Itens de Evolução
Mega Evolução
Migrating Pokemon
NPCs
Pesca
Pokédex
Pokémon Encyclopedia
Quests
Sistemas
Ability
Bike
Bless
Boost Stone
Plantação
House
Party
Stage Changes
Shiny Stone
TMs
Comunidade
Lar Doce Lar
Melhores do Ano
OtPokémon Awards
Política de privacidadeSobre PokeZBr WikiTermo de responsabilidadeVersão móvelPowered by MediaWiki