mirror of
https://github.com/StarCitizenTools/mediawiki-skins-Citizen.git
synced 2024-12-11 05:56:16 +00:00
00b2495c1a
- Move border radius calculation to CSS variable instead of LESS - Rename CSS variable according to Codex, soft-deprecating the existing border radius
169 lines
3 KiB
Plaintext
169 lines
3 KiB
Plaintext
/*
|
|
* Citizen
|
|
*
|
|
* Module: mediawiki.skinning.content.media-common
|
|
* Version: REL1_39
|
|
*
|
|
* Date: 2023-07-23
|
|
*/
|
|
|
|
/**
|
|
* Block media items
|
|
*/
|
|
figure[ typeof~='mw:File' ],
|
|
figure[ typeof~='mw:File/Frameless' ],
|
|
figure[ typeof~='mw:File/Thumb' ],
|
|
figure[ typeof~='mw:File/Frame' ] {
|
|
&.mw-halign-none {
|
|
float: none;
|
|
clear: none;
|
|
}
|
|
|
|
&.mw-halign-center {
|
|
margin-right: auto;
|
|
margin-left: auto;
|
|
text-align: center;
|
|
}
|
|
}
|
|
|
|
figure[ typeof~='mw:File' ],
|
|
figure[ typeof~='mw:File/Frameless' ] {
|
|
/* Hide the caption for frameless and plain floated images */
|
|
> figcaption {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
figure[ typeof~='mw:File/Thumb' ],
|
|
figure[ typeof~='mw:File/Frame' ] {
|
|
display: table;
|
|
margin: var( --space-xs ) auto var( --space-md ) auto;
|
|
font-size: var( --font-size-x-small );
|
|
text-align: center;
|
|
|
|
> a:first-child,
|
|
> span:first-child {
|
|
/**
|
|
* Broken media get a span instead.
|
|
*/
|
|
span.mw-broken-media {
|
|
display: inline-block;
|
|
/* This is hardcoded in Linker::makeThumbLink2 for broken media */
|
|
width: 180px;
|
|
overflow-wrap: break-word;
|
|
}
|
|
}
|
|
|
|
> figcaption {
|
|
display: table-caption;
|
|
// Sync with rounded corner
|
|
padding-right: var( --border-radius-base );
|
|
// Sync with rounded corner
|
|
padding-left: var( --border-radius-base );
|
|
margin-top: var( --space-xs );
|
|
color: var( --color-subtle );
|
|
letter-spacing: 0.025em;
|
|
caption-side: bottom;
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Inline media items
|
|
* img is needed for 1.39 compat, change to .mw-file-element later
|
|
*/
|
|
.mw-valign-middle img {
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.mw-valign-baseline img {
|
|
vertical-align: baseline;
|
|
}
|
|
|
|
.mw-valign-sub img {
|
|
vertical-align: sub;
|
|
}
|
|
|
|
.mw-valign-super img {
|
|
vertical-align: super;
|
|
}
|
|
|
|
.mw-valign-top img {
|
|
vertical-align: top;
|
|
}
|
|
|
|
.mw-valign-text-top img {
|
|
vertical-align: text-top;
|
|
}
|
|
|
|
.mw-valign-bottom img {
|
|
vertical-align: bottom;
|
|
}
|
|
|
|
.mw-valign-text-bottom img {
|
|
vertical-align: text-bottom;
|
|
}
|
|
|
|
// Do not float content in mobile view
|
|
@media ( min-width: @min-width-breakpoint-tablet ) {
|
|
figure[ typeof~='mw:File/Thumb' ],
|
|
figure[ typeof~='mw:File/Frame' ] {
|
|
> figcaption {
|
|
text-align: start;
|
|
}
|
|
|
|
// When float is not explicitly set
|
|
.mw-content-ltr & {
|
|
/* @noflip */
|
|
float: right;
|
|
/* @noflip */
|
|
margin-left: var( --space-lg );
|
|
/* @noflip */
|
|
clear: right;
|
|
}
|
|
|
|
.mw-content-rtl & {
|
|
/* @noflip */
|
|
float: left;
|
|
/* @noflip */
|
|
margin-right: var( --space-lg );
|
|
/* @noflip */
|
|
clear: left;
|
|
}
|
|
}
|
|
|
|
figure[ typeof~='mw:File' ],
|
|
figure[ typeof~='mw:File/Frameless' ],
|
|
figure[ typeof~='mw:File/Thumb' ],
|
|
figure[ typeof~='mw:File/Frame' ] {
|
|
&.mw-halign-right {
|
|
/* @noflip */
|
|
float: right;
|
|
/* @noflip */
|
|
margin-right: 0;
|
|
/* @noflip */
|
|
margin-left: var( --space-lg );
|
|
/* @noflip */
|
|
clear: right;
|
|
}
|
|
|
|
&.mw-halign-left {
|
|
/* @noflip */
|
|
float: left;
|
|
/* @noflip */
|
|
margin-right: var( --space-lg );
|
|
/* @noflip */
|
|
margin-left: 0;
|
|
/* @noflip */
|
|
clear: left;
|
|
}
|
|
|
|
&.mw-halign-center {
|
|
float: none;
|
|
margin-right: auto;
|
|
margin-left: auto;
|
|
clear: both;
|
|
text-align: center;
|
|
}
|
|
}
|
|
}
|