Jump to content

MediaWiki:Common.css: Difference between revisions

No edit summary
No edit summary
Line 41: Line 41:
/* Category Tiles Grid */
/* Category Tiles Grid */
.category-tiles-container {
.category-tiles-container {
  --tile-min-width: 200px;
   --tile-image-size: 120px;
   --tile-image-size: 120px;
   --tile-font-size: 1.1em;
   --tile-font-size: 1.1em;
Line 47: Line 46:
    
    
   display: grid;
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(var(--tile-min-width), 1fr));
   grid-template-columns: repeat(auto-fit, minmax(calc(var(--tile-image-size) + 2px), 1fr));
   gap: var(--tile-gap);
   gap: var(--tile-gap);
   margin: 0 auto;
   margin: 0 auto;
Line 55: Line 54:
/* Size Variants - Override CSS Variables */
/* Size Variants - Override CSS Variables */
.category-tiles-size-small {
.category-tiles-size-small {
  --tile-min-width: 150px;
   --tile-image-size: 80px;
   --tile-image-size: 80px;
   --tile-font-size: 0.9em;
   --tile-font-size: 0.9em;
Line 61: Line 59:


.category-tiles-size-large {
.category-tiles-size-large {
  --tile-min-width: 280px;
   --tile-image-size: 180px;
   --tile-image-size: 180px;
   --tile-font-size: 1.3em;
   --tile-font-size: 1.3em;
Line 109: Line 106:
    
    
   .category-tiles-size-small {
   .category-tiles-size-small {
    --tile-min-width: 120px;
     --tile-image-size: 60px;
     --tile-image-size: 60px;
   }
   }
    
    
   .category-tiles-size-large {
   .category-tiles-size-large {
    --tile-min-width: 180px;
     --tile-image-size: 120px;
     --tile-image-size: 120px;
   }
   }