mediawiki-skins-Citizen/skinStyles/mediawiki/mediawiki.page.gallery.styles.less
alistair3149 00b2495c1a
feat(core): use px for border-radius
- Move border radius calculation to CSS variable instead of LESS
- Rename CSS variable according to Codex, soft-deprecating the existing border radius
2024-07-05 13:24:31 -04:00

71 lines
1.5 KiB
Plaintext

/*
* Citizen - Gallery Styles
* https://starcitizen.tools
*/
// T326017
ul.gallery.gallery.gallery {
padding: 0;
margin: var( --space-xxs ) 0;
}
// Sync with caption styles
div.gallerytext {
padding: 0;
padding-right: var( --border-radius-base );
padding-left: var( --border-radius-base );
font-size: var( --font-size-x-small );
color: var( --color-subtle );
letter-spacing: 0.025em;
p {
margin: var( --space-xxs ) 0; // reset default style
}
}
ul.mw-gallery-packed-hover li.gallerybox:hover div.gallerytextwrapper,
ul.mw-gallery-packed-overlay li.gallerybox div.gallerytextwrapper,
ul.mw-gallery-packed-hover li.gallerybox.mw-gallery-focused div.gallerytextwrapper {
right: 0;
width: auto !important;
padding: var( --space-xs );
margin: var( --space-xs );
margin-right: 0; // MAGIC
font-weight: var( --font-weight-normal ); // should use the same weight as caption
background: var( --background-color-backdrop-light );
}
/* Slideshow */
ul.gallery.mw-gallery-slideshow {
.gallerybox {
&.slideshow-current {
background: var( --color-surface-2 );
}
}
.mw-gallery-slideshow {
&-buttons {
padding-top: var( --space-md );
padding-bottom: var( --space-sm );
}
&-img-container {
border-radius: var( --border-radius-large );
}
&-caption {
margin: 0;
}
}
}
@media screen {
li.gallerybox div.thumb {
margin: var( --space-xxs );
overflow: hidden; // quick hack for rounded corner
background-color: var( --color-surface-2 );
border-color: transparent;
border-radius: var( --border-radius-base );
}
}