« MediaWiki:Common.css » : différence entre les versions

Page de l’interface de MediaWiki
(Résolution du texte qui sort des cards)
(Affichage en gros des catégories sur les petits écrans)
Ligne 62 : Ligne 62 :
     -webkit-mask-image:none!important;
     -webkit-mask-image:none!important;
     -mask-image:none!important;
     -mask-image:none!important;
  }
  .mw-category-columns {
    display: grid;
    justify-content: center;
    zoom: 2;
   }
   }
}
}

Version du 12 février 2024 à 13:24

/*############ Custom CSS for WikiThionville. ############*/
/* Responsive content zoom */
@media only screen and (max-width: 270px) {
  #bodyContent {
    zoom: 0.2;
  }
}
@media only screen and (min-width: 270px) {
  #bodyContent {
    zoom: 0.3;        
  }
}
@media only screen and (min-width: 340px) {
  #bodyContent {
    zoom: 0.4;        
  }
}
@media only screen and (min-width: 415px) {
  #bodyContent {
    zoom: 0.5;        
  }
}
@media only screen and (min-width: 570px) {
  #bodyContent {
    zoom: 0.7;        
  }
}
@media only screen and (min-width: 730px) {
  #bodyContent {
    zoom: 0.9;        
  }
}
@media only screen and (min-width: 850px) {
  #bodyContent {
    zoom: 1;
  }
}
/* Rules for small screen devices like smartphones */
@media only screen and (max-width: 570px) {
  tr {
    display: flex!important;
    flex-direction: column!important;
    align-items: center!important;
  }
  tr td {
    max-width: 98%
  }
  .citizen-section-collapsible{
    zoom: 1.5;
  } 
  .citizen-table-wrapper {
    overflow: hidden!important;
    border-radius: 25px!important;
  }
  font {
    font-size: 1.3rem!important;
  }
  .mw-headline {
    font-size: 2.5rem!important;
  }
  .citizen-overflow--right {
    -webkit-mask-image:none!important;
    -mask-image:none!important;
  }
  .mw-category-columns {
    display: grid;
    justify-content: center;
    zoom: 2;
  }
}
/* General CSS rules */
tr {
  display: flex;
  flex-direction: row;
  align-items: center
}

.citizen-table-wrapper {
  border-radius: 15px;
}

table {
 border: none!important;
 overflow: hidden!important;
}