Mudanças entre as edições de "MediaWiki:Common.css"

De Doctor View Wiki
Ir para: navegação, pesquisa
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('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;1,700;1,800;1,900&family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');
 
      
 
      
 
/** CSS  da  Pagina  Inicial */   
 
/** CSS  da  Pagina  Inicial */   
Linha 13: Linha 14:
 
         text-align: center;
 
         text-align: center;
 
         color: #002244;
 
         color: #002244;
        font-family: 'Poppins', sans-serif;
+
        font-family: 'Poppins', sans-serif;
 
          
 
          
 
        
 
        

Edição das 09h02min de 18 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;1,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 {
        display: grid;
        text-align: center;
        color: #002244;
        font-family: 'Poppins', sans-serif;
         
       
}

.cabecalho h1 {text-align: center;
         color: #002244;
         font-family: 'Poppins', sans-serif;
         font-size: 35px;
         font-weight: 700;
       
}
.cabecalho p {text-align: center;
         color: #002244;
         font-family: 'Poppins', sans-serif;
         font-size: 16px;       
}


                               /** Divs Banners e Novidades */


.banner {
        grid-template-columns: repeat(3);
        display: grid;
        grid-row-gap: 5px;
        grid-column-gap: 5px;
        
        
       
}


.card1 {
       
        grid-area: 1 / 1 / 2/ 2;
        display: grid;

        
      
}
.card2 { 
        
        grid-area: 1 / 2 / 2 /3;
        display: grid;

        
             
       
}


.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{
        grid-area: 4 / 1 / 5 /3;
        display: grid;
        grid-template-columns: repeat(2);
        grid-template-rows: repeat(3);
        grid-row-gap: 5px;
        grid-column-gap: 5px;


       
}
.guesschild{
        grid-area: 1 / 1 / 2 /4;
        display: grid;
}

guesschild h2{

               color: #002244;
               font-family: 'Poppins', sans-serif;
       
}
.guesschild1{
        grid-area: 2 / 1 / 3 /2;
        display: grid;
        border-radius: 10px;
       
}
.guesschild2{
        grid-area: 2 / 2 / 3 /3;
        display: grid;
        border-radius: 10px;

       
}
.guesschild3{
        grid-area: 2 / 3 / 3 /4;
        display: grid;
        border-radius: 10px;
      
       
}
.guesschild4{
        display: grid;
        border-radius: 10px;
      
       
}



                   /** 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;
}


.cardAnim{

  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
  transition: transform 0.3s ease, box-shadow 0.3s ease;     
       
}

 /** CSS  para colocar cards pra frenete */

.cardAnim:hover{
           transform: translateY(-5px); 
           box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.25);
      
       
}


.divisoria {
  border-top: 1px solid #ddd;
  width: 100%; 
  margin: 20px 0; 
}


.linha-embaixo {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid #ccc;
  padding-bottom: 5px; 
}

.mw-parser-output {
  text-align: center;
}

.carousel {
  width: 50px;
  margin: 0 auto;
}

.autoplay button {
    display: none !important;
}