Mudanças entre as edições de "MediaWiki:Common.css"
De Doctor View Wiki
Linha 2: | Linha 2: | ||
@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.min.css"); | ||
@import url("https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick-theme.min.css"); | @import url("https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick-theme.min.css"); | ||
− | @import url( | + | @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 */ | ||
− | + | /** Divs cabeçalho cabecalho */ | |
− | + | .cabecalho { | |
− | .cabecalho {background-color: #fcfcfc; | + | background-color: #fcfcfc; |
− | + | display: grid; | |
− | + | text-align: center; | |
− | |||
− | |||
} | } | ||
− | .cabecalho h1 {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; | + | .cabecalho p { |
− | + | text-align: center; | |
− | + | color: #444444; | |
− | + | font-family: "Poppins", sans-serif; | |
+ | font-size: 17px; | ||
} | } | ||
+ | /** Divs Banners e Novidades */ | ||
− | + | .banner { | |
− | + | background-color: #fcfcfc; | |
− | + | grid-template-columns: repeat(3); | |
− | .banner {background-color: #fcfcfc; | + | display: grid; |
− | + | grid-row-gap: 5px; | |
− | + | grid-column-gap: 5px; | |
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
− | + | .card1 { | |
− | .card1 { display: grid; | + | display: grid; |
− | + | grid-area: 1 / 1 / 2/ 2; | |
− | |||
− | |||
− | |||
− | |||
} | } | ||
− | .card2 { | + | .card2 { |
− | + | display: grid; | |
− | + | grid-area: 1 / 2 / 2 /3; | |
− | |||
} | } | ||
+ | .card3 { | ||
+ | display: grid; | ||
+ | grid-area: 1 / 3 / 2 /4; | ||
+ | width: 250px; | ||
+ | } | ||
− | . | + | .center { |
− | + | align-items: center; | |
− | + | text-align: center; | |
− | |||
} | } | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | /** Divs footer de Sugestoes de mais clicados */ | + | /** Divs footer de Sugestoes de mais clicados */ |
− | .guess{ background-color: #fcfcfc; | + | .guess { |
− | + | background-color: #fcfcfc; | |
− | + | display: grid; | |
− | + | grid-row-gap: 5px; | |
− | + | grid-column-gap: 5px; | |
− | |||
− | |||
− | |||
} | } | ||
− | + | .guess h2 { | |
− | .guess h2{grid-area: 1 / 1 / 2 /4; | + | grid-area: 1 / 1 / 2 /4; |
− | + | color: #002244; | |
− | + | font-family: "Poppins", sans-serif; | |
− | + | font-weight: 600; | |
− | |||
− | |||
} | } | ||
− | + | .guesschild1 { | |
− | .guesschild1{ | + | grid-area: 2 / 1 / 3 /2; |
− | + | border-radius: 10px; | |
− | |||
− | |||
− | |||
− | |||
} | } | ||
− | .guesschild1 a{ | + | .guesschild1 a { |
− | + | font-family: "Inter", sans-serif; | |
− | + | font-size: 16px; | |
− | + | color: #2b4162; | |
− | |||
− | |||
} | } | ||
− | + | .guesschild2 { | |
− | + | grid-area: 2 / 2 / 3 /3; | |
− | .guesschild2{ | + | border-radius: 10px; |
− | |||
− | |||
− | |||
− | |||
} | } | ||
− | .guesschild2 a{ font-family: | + | .guesschild2 a { |
− | + | font-family: "Inter", sans-serif; | |
− | + | font-size: 16px; | |
− | + | color: #2b4162; | |
− | |||
} | } | ||
− | + | .guesschild3 { | |
− | .guesschild3{ | + | grid-area: 2 / 3 / 3 /4; |
− | + | border-radius: 10px; | |
− | |||
− | |||
} | } | ||
− | .guesschild3 a{ | + | .guesschild3 a { |
− | + | font-family: "Inter", sans-serif; | |
− | + | font-size: 16px; | |
− | + | color: #2b4162; | |
} | } | ||
+ | /** CSS PARA DEMAIS PAGINAS */ | ||
− | + | .topo { | |
− | + | background-color: #fcfcfc; | |
− | + | display: grid; | |
− | .topo {background-color: #fcfcfc; | + | text-align: center; |
− | + | align-items: center; | |
− | |||
− | |||
− | |||
− | |||
} | } | ||
− | .topo h2 | + | .topo h2 { |
− | + | grid-area: 1 / 1 /2 /3; | |
− | text-align: center; | + | text-align: center; |
− | + | color: #444444; | |
− | + | font-family: "Poppins", sans-serif; | |
− | + | font-size: 17px; | |
− | |||
} | } | ||
− | .topo div | + | .topo div { |
− | + | grid-area: 2 / 2 /3 /3; | |
} | } | ||
− | .imagensTm {background-color: #fcfcfc; | + | .imagensTm { |
− | + | background-color: #fcfcfc; | |
− | + | display: grid; | |
− | + | text-align: center; | |
− | |||
} | } | ||
− | .instrucoes {background-color: #fcfcfc; | + | .instrucoes { |
− | + | background-color: #fcfcfc; | |
− | + | text-align: center; | |
− | |||
} | } | ||
+ | /** CSS de Efeitos das imagens e linhas */ | ||
− | + | .imagem-zoom { | |
− | + | height: auto; | |
− | |||
− | |||
− | |||
− | |||
− | .imagem-zoom{ | ||
− | height: auto; | ||
transition: transform 0.3s ease-in-out; | transition: transform 0.3s ease-in-out; | ||
− | |||
} | } | ||
− | |||
.imagem-zoom:hover { | .imagem-zoom:hover { | ||
Linha 194: | Linha 149: | ||
.thumbcaption { | .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{ | ||
− | |||
− | |||
− | |||
} | } | ||
− | + | .cardAnim:hover { | |
− | + | transform: translateY(-5px); | |
− | .cardAnim:hover{ | + | box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.25); |
− | |||
− | |||
− | |||
} | } | ||
− | + | /** CSS para Remover quadro da imagem */ | |
− | |||
.mw-parser-output { | .mw-parser-output { | ||
Linha 228: | Linha 176: | ||
.autoplay button { | .autoplay button { | ||
− | + | display: none !important; | |
} | } |
Edição das 15h28min de 25 de setembro de 2025
/** 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 */
/** 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 {
background-color: #fcfcfc;
grid-template-columns: repeat(3);
display: grid;
grid-row-gap: 5px;
grid-column-gap: 5px;
}
.card1 {
display: grid;
grid-area: 1 / 1 / 2/ 2;
}
.card2 {
display: grid;
grid-area: 1 / 2 / 2 /3;
}
.card3 {
display: grid;
grid-area: 1 / 3 / 2 /4;
width: 250px;
}
.center {
align-items: center;
text-align: center;
}
/** Divs footer de Sugestoes de mais clicados */
.guess {
background-color: #fcfcfc;
display: grid;
grid-row-gap: 5px;
grid-column-gap: 5px;
}
.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 DEMAIS PAGINAS */
.topo {
background-color: #fcfcfc;
display: grid;
text-align: center;
align-items: center;
}
.topo h2 {
grid-area: 1 / 1 /2 /3;
text-align: center;
color: #444444;
font-family: "Poppins", sans-serif;
font-size: 17px;
}
.topo div {
grid-area: 2 / 2 /3 /3;
}
.imagensTm {
background-color: #fcfcfc;
display: grid;
text-align: center;
}
.instrucoes {
background-color: #fcfcfc;
text-align: center;
}
/** CSS de Efeitos das imagens e linhas */
.imagem-zoom {
height: auto;
transition: transform 0.3s ease-in-out;
}
.imagem-zoom:hover {
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;
}