MediaWiki:Common.css: mudanças entre as edições
Sem resumo de edição |
Sem resumo de edição |
||
| (277 revisões intermediárias pelo mesmo usuário não estão sendo mostradas) | |||
| Linha 1: | Linha 1: | ||
/** o código CSS colocado aqui será aplicado a todos os temas */ | /** o código CSS colocado aqui será aplicado a todos os temas */ | ||
@import url("https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.css"); | |||
@import url("https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick-theme.min.css"); | |||
@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;,700;1,800;1,900&family=Rubik:ital,wght@0,300..900;1,300..900&display=swap"); | |||
/** CSS da Pagina Inicial */ | |||
/** NAVB E NOME E LOGO*/ | |||
.mw-wiki-logo, .mw-logo-wordmark { | |||
background-image: url('https://www.doctorview.com.br/wiki/images/b/be/Logodv.png') !important; | |||
background-repeat: no-repeat !important; | |||
background-position: left center !important; | |||
background-size: 30px auto !important; /* Ajusta o tamanho da logo (mude o 30px se quiser maior/menor) */ | |||
padding-left: 38px !important; /* Esse valor precisa ser um pouco maior que a largura da logo */ | |||
display: inline-block !important; | |||
line-height: 32px !important; | |||
color : #191970; | |||
} | |||
/** Divs cabeçalho cabecalho */ | |||
.cabecalho { | |||
background-color: #fcfcfc; | |||
display: grid; | |||
text-align: center; | |||
} | |||
.cabecalho h1 { | |||
text-align: center; | |||
color: #002244; | |||
font-family: "Poppins", sans-serif; | |||
font-size: 30px; | |||
font-weight: 700; | |||
} | |||
.cabecalho p { | |||
text-align: center; | |||
color: #444444; | |||
font-family: "Poppins", sans-serif; | |||
font-size: 17px; | |||
} | } | ||
/** Divs Banners e Novidades */ | |||
.banner { | .banner { | ||
background-color: #fcfcfc; | |||
grid-template-columns: repeat(3); | |||
display: grid; | |||
grid-row-gap: 5px; | |||
grid-column-gap: 5px; | |||
} | } | ||
.card1 { | .card1 { | ||
width: fit-content !important; | |||
max-width: 100% !important; | |||
max-height: 100% !important; | |||
display: inline-block !important; | |||
display: grid; | |||
grid-area: 1 / 1 / 2/ 2; | |||
} | } | ||
.card2 { | .card2 { | ||
display: grid; | |||
width: fit-content !important; | |||
max-width: 100% !important; | |||
max-height: 100% !important; | |||
display: inline-block !important; | |||
grid-area: 1 / 2 / 2 /3; | |||
} | |||
.card3 { | |||
display: grid; | |||
grid-area: 1 / 3 / 2 /4; | |||
width: 250px; | |||
} | |||
.center { | |||
align-items: center; | |||
text-align: center; | |||
} | |||
.arredondar iframe{ | |||
border-radius: 10px; | |||
} | |||
/** Divs footer de Sugestoes de mais clicados */ | |||
.guess { | |||
background-color: #fcfcfc; | |||
display: grid; | |||
grid-row-gap: 5px; | |||
grid-column-gap: 5px; | |||
text-align: left; | |||
} | |||
.guess h2 { | |||
grid-area: 1 / 1 / 2 /4; | |||
color: #002244; | |||
font-family: "Poppins", sans-serif; | |||
font-weight: 600; | |||
} | |||
.guesschild1 { | |||
grid-area: 2 / 1 / 3 /2; | |||
border-radius: 10px; | |||
} | |||
.guesschild1 a { | |||
font-family: "Inter", sans-serif; | |||
font-size: 16px; | |||
color: #2b4162; | |||
} | |||
.guesschild2 { | |||
grid-area: 2 / 2 / 3 /3; | |||
border-radius: 10px; | |||
} | |||
.guesschild2 a { | |||
font-family: "Inter", sans-serif; | |||
font-size: 16px; | |||
color: #2b4162; | |||
} | |||
.guesschild3 { | |||
grid-area: 2 / 3 / 3 /4; | |||
border-radius: 10px; | |||
} | |||
.guesschild3 a { | |||
font-family: "Inter", sans-serif; | |||
font-size: 16px; | |||
color: #2b4162; | |||
} | |||
/** CSS PARA TOPICOS EM LISTA */ | |||
.topics { | |||
display: inline-flex; | |||
row-gap: 10px; | |||
flex-wrap: wrap; | |||
column-gap: 10px; | |||
} | |||
.cardsBorder{ | |||
display: block; | |||
border-radius: 10px; | |||
width: max-content; | |||
height: auto; | |||
text-align: center; | |||
flex-basis: calc(20% - 8px); | |||
} | |||
.cardsBorder li{ | |||
margin-top: 10px; | |||
} | |||
/** CSS PARA DEMAIS PAGINAS */ | |||
.topo { | |||
background-color: #fcfcfc; | |||
display: grid; | |||
text-align: center; | |||
align-items: center; | |||
} | |||
.topo h2 {display: inline; | |||
text-align: center; | |||
color: #444444; | |||
font-family: "Poppins", sans-serif; | |||
font-size: 35px; | |||
} | |||
.topo div { | |||
grid-area: 2 / 2 /3 /3; | |||
} | |||
.imagensTm { | |||
background-color: #fcfcfc; | |||
display: grid; | |||
text-align: center; | |||
} | |||
.instrucoes { | |||
background-color: #fcfcfc; | |||
text-align: center; | |||
} | |||
.BdyTexto{ | |||
text-align: center; | |||
color: #444444; | |||
font-family: "Poppins", sans-serif; | |||
font-size: 17px; | |||
line-height: 1.5 | |||
align-items: center; | |||
} | } | ||
. | .BdyList ul{ | ||
align-items: left; | |||
text-align: left; | |||
font-size: 12px; | |||
} | } | ||
. | |||
.BordasRdImg img{ | |||
border-radius: 15px | |||
} | } | ||
.StandardAlert{ | |||
border: 1px solid #dde2d3; | |||
padding:10px; | |||
background: #ffeddc; | |||
width:auto; | |||
} | |||
/** CSS de Efeitos das imagens e linhas */ | |||
.imagem-zoom { | |||
height: auto; | |||
transition: transform 0.3s ease-in-out; | |||
} | |||
.imagem-zoom:hover { | .imagem-zoom:hover { | ||
transform: scale(1.1); | transform: scale(1.1); | ||
} | |||
.thumbcaption { | |||
display: none !important; | |||
} | |||
/** CSS para colocar cards pra frente */ | |||
.cardAnim { | |||
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2); | |||
transition: transform 0.3s ease, box-shadow 0.3s ease; | |||
} | |||
.cardAnim:hover { | |||
transform: translateY(-5px); | |||
box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.25); | |||
} | |||
/** CSS para Remover quadro da imagem */ | |||
.mw-parser-output { | |||
text-align: center; | |||
} | |||
.carousel { | |||
width: 50px; | |||
margin: 0 auto; | |||
} | |||
.autoplay button { | |||
display: none !important; | |||
} | |||
/** CSS para versão mobile*/ | |||
@media (max-width: 768px) | |||
{ | |||
.banner { | |||
grid-template-columns: 1fr; | |||
grid-row-gap: 0px; | |||
grid-column-gap: 0px; | |||
text-align: center; | |||
align-items: center; | |||
} | |||
.card1 { | |||
align-items: center; | |||
text-align: center; | |||
width: fit-content !important; | |||
max-width: 100% !important; | |||
max-height: 100% !important; | |||
display: inline-block !important; | |||
grid-area: 1 / 1 / 2/ 2; | |||
margin-left: auto; | |||
margin-right: auto; | |||
} | |||
.card2 { | |||
grid-area: 2 / 1 / 3 /2; | |||
width: fit-content !important; | |||
max-width: 100% !important; | |||
max-height: 100% !important; | |||
display: inline-block !important; | |||
margin-left: auto; | |||
margin-right: auto; | |||
} | |||
.card3 { | |||
align-items: center; | |||
text-align: center; | |||
grid-area: 3 / 1 / 4 /2; | |||
width: 250px; | |||
margin-left: auto; | |||
margin-right: auto; | |||
} | |||
/** Mais procurados mobile */ | |||
.guess h2 { | |||
grid-area: 1 / 1 / 2 /2; | |||
} | |||
.guesschild1 { | |||
grid-area: 2 / 1 / 3 /2; | |||
border-radius: 10px; | |||
} | |||
.guesschild2 { | |||
grid-area: 3 / 1 / 4 /2; | |||
border-radius: 10px; | |||
} | |||
.guesschild3 { | |||
grid-area: 4 / 1 / 5 /2; | |||
border-radius: 10px; | |||
} | |||
/** listas de tópicos mobile */ | |||
.cardsBorder{ | |||
flex-basis: calc(40% + 10px); | |||
font-size: 16px; | |||
margin-left: auto; | |||
margin-right: auto; | |||
} | |||
.vdo { | |||
width: 100%; | |||
max-width: 100%; | |||
display: block; | |||
} | |||
.vdo iframe, | |||
.vdo embed, | |||
.vdo object, | |||
.vdo .embedvideo { | |||
width: 100% !important; | |||
height: auto !important; | |||
aspect-ratio: 16 / 9; | |||
} | |||
.minerva-header .site-branding a { | |||
border: 1px solid red !important; | |||
} | |||
} | } | ||