User:SnorlaxMonster/GalleryTest.css: Difference between revisions

From Bulbapedia, the community-driven Pokémon encyclopedia.
Jump to navigationJump to search
(Created page with ".gallery-80 { border-radius: 20px; background-color: hsl(78, 69.77%, 80%); border: 1px solid #C4E673; } .gallery-light { border-radius: 20px; background-color: hsl(78, 69.77%, 83%); →‎{{bulba color light}}: border: 1px solid #C4E673; } .gallery-85 { border-radius: 20px; background-color: hsl(78, 69.77%, 85%); border: 1px solid #C4E673; } .gallery-90 { border-radius: 20px; background-color: hsl(78, 69.77%, 90%); border...")
 
mNo edit summary
 
(6 intermediate revisions by the same user not shown)
Line 1: Line 1:
.gallery-80 {
li.gallerybox div.thumb {
     border-radius: 20px;
     border-radius: 20px;
}
/* Traditional galleries */
.mw-gallery-traditional.gallery-80 li.gallerybox div.thumb {
     background-color: hsl(78, 69.77%, 80%);
     background-color: hsl(78, 69.77%, 80%);
     border: 1px solid #C4E673;
     border: 2px solid #C4E673;
}
}


.gallery-light {
.mw-gallery-traditional.gallery-light li.gallerybox div.thumb {
    border-radius: 20px;
     background-color: hsl(78, 69.77%, 83%); /* {{bulba color light}} */
     background-color: hsl(78, 69.77%, 83%); /* {{bulba color light}} */
     border: 1px solid #C4E673;
     border: 2px solid #C4E673;
}
}


.gallery-85 {
.mw-gallery-traditional.gallery-85 li.gallerybox div.thumb {
    border-radius: 20px;
     background-color: hsl(78, 69.77%, 85%);
     background-color: hsl(78, 69.77%, 85%);
     border: 1px solid #C4E673;
     border: 2px solid #C4E673;
}
}


.gallery-90 {
.mw-gallery-traditional.gallery-90 li.gallerybox div.thumb {
    border-radius: 20px;
     background-color: hsl(78, 69.77%, 90%);
     background-color: hsl(78, 69.77%, 90%);
     border: 1px solid #C4E673;
     border: 2px solid #C4E673;
}
 
.mw-gallery-traditional.gallery-95 li.gallerybox div.thumb {
    background-color: hsl(78, 69.77%, 95%);
    border: 2px solid #C4E673;
}
 
/* Packed galleries */
ul.mw-gallery-packed.fancy-packed {
  /* Remove default gallery styling */
  margin: unset;
  list-style: unset;
 
  border-radius: 20px;
  border: 2px solid #8E250D;
  background-color: #DA3914;
  color: #FFF;
  padding: 5px;
 
  display: flex;
  flex-wrap: wrap;
  column-gap: 5px;
  row-gap: 5px;
}
 
ul.mw-gallery-packed.fancy-packed li.gallerybox {
  /* Remove default gallery styling */
  width: unset !important;
  margin: unset;
 
  flex: 1;
  flex-basis: min-content;
}
 
ul.mw-gallery-packed.fancy-packed li.gallerybox > div {
  /* Remove default gallery styling */
  width: unset !important;
}
 
ul.mw-gallery-packed.fancy-packed li.gallerybox div.thumb {
  /* Remove default gallery styling */
  width: unset !important;
  margin: unset;
 
  border: 2px solid #8E250D;
  border-radius: 20px;
  background-color: #E77E66;
  padding: 8px;
}
 
ul.mw-gallery-packed.fancy-packed li.gallerybox div.thumb img {
  /* Override default gallery styling */
  max-width: unset !important;
  width: auto !important;
  height: 220px !important;
}
 
ul.mw-gallery-packed.fancy-packed li.gallerybox .gallerytext p {
  margin: unset;
}
}

Latest revision as of 13:03, 16 November 2024

li.gallerybox div.thumb {
    border-radius: 20px;
}

/* Traditional galleries */
.mw-gallery-traditional.gallery-80 li.gallerybox div.thumb {
    background-color: hsl(78, 69.77%, 80%);
    border: 2px solid #C4E673;
}

.mw-gallery-traditional.gallery-light li.gallerybox div.thumb {
    background-color: hsl(78, 69.77%, 83%); /* {{bulba color light}} */
    border: 2px solid #C4E673;
}

.mw-gallery-traditional.gallery-85 li.gallerybox div.thumb {
    background-color: hsl(78, 69.77%, 85%);
    border: 2px solid #C4E673;
}

.mw-gallery-traditional.gallery-90 li.gallerybox div.thumb {
    background-color: hsl(78, 69.77%, 90%);
    border: 2px solid #C4E673;
}

.mw-gallery-traditional.gallery-95 li.gallerybox div.thumb {
    background-color: hsl(78, 69.77%, 95%);
    border: 2px solid #C4E673;
}

/* Packed galleries */
ul.mw-gallery-packed.fancy-packed {
  /* Remove default gallery styling */
  margin: unset;
  list-style: unset;
  
  border-radius: 20px;
  border: 2px solid #8E250D;
  background-color: #DA3914;
  color: #FFF;
  padding: 5px;
  
  display: flex;
  flex-wrap: wrap;
  column-gap: 5px;
  row-gap: 5px;
}

ul.mw-gallery-packed.fancy-packed li.gallerybox {
  /* Remove default gallery styling */
  width: unset !important;
  margin: unset;
  
  flex: 1;
  flex-basis: min-content;
}

ul.mw-gallery-packed.fancy-packed li.gallerybox > div {
  /* Remove default gallery styling */
  width: unset !important;
}

ul.mw-gallery-packed.fancy-packed li.gallerybox div.thumb {
  /* Remove default gallery styling */
  width: unset !important;
  margin: unset;
  
  border: 2px solid #8E250D;
  border-radius: 20px;
  background-color: #E77E66;
  padding: 8px;
}

ul.mw-gallery-packed.fancy-packed li.gallerybox div.thumb img {
  /* Override default gallery styling */
  max-width: unset !important;
  width: auto !important;
  height: 220px !important;
}

ul.mw-gallery-packed.fancy-packed li.gallerybox .gallerytext p {
  margin: unset;
}