Module:Citation/CS1/styles.css: Difference between revisions
From Zoophilia Wiki
Jump to navigationJump to search
Quantumhusky (talk | contribs) m 1 revision imported |
Upgrade deprecated CSS2 declarations to CSS3 and CSS4. |
||
(2 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
cite.citation { | cite.citation { | ||
font-style: inherit; /* Remove italics for <cite>. */ | |||
/* Break long URLs, etc., rather than overflowing the box. */ | |||
overflow-wrap: break-word; | |||
} | } | ||
.citation q { | .citation q { | ||
quotes: '"' '"' "'" "'"; /* Straight quotation marks for <q>. */ | |||
} | } | ||
/* | /* Highlight linked elements (such as clicked references) in blue. */ | ||
.citation:target { | |||
/* Ignore the linter, all browsers of interest implement this. */ | |||
background-color: #007fff22; | |||
*/ | |||
.citation | |||
} | } | ||
. | /* ID and URL access: | ||
. | Both Core and Common.css have the selector .mw-parser-output a[href$=".pdf"].external | ||
. | for PDF pages. All TemplateStyles pages are hoisted to .mw-parser-output. We need to | ||
. | have specificity equal to a[href$=".pdf"].external for locks to override a PDF icon. | ||
That's essentially two classes and one element. The .id-lock-… selectors are for use | |||
by non-citation templates like Catalog lookup link. bg-size `contain` in Minerva and | |||
Timeless is too large, so we set a size for them and then exclude them later. */ | |||
.id-lock-free.id-lock-free a { | |||
background-image: url("https://zoophilia.wiki/images/6/65/Lock-green.svg"); | |||
background-position: right center; | |||
background-repeat: no-repeat; | |||
} | } | ||
.id-lock- | .id-lock-limited.id-lock-limited a, | ||
. | .id-lock-registration.id-lock-registration a { | ||
background-image: url("https://zoophilia.wiki/images/d/d6/Lock-gray-alt-2.svg"); | |||
background-position: right center; | |||
background-repeat: no-repeat; | |||
} | } | ||
. | .id-lock-subscription.id-lock-subscription a { | ||
. | background-image: url("https://zoophilia.wiki/images/a/aa/Lock-red-alt-2.svg"); | ||
background-position: right center; | |||
background-repeat: no-repeat; | |||
} | } | ||
.cs1- | /* Wikisource: | ||
. | The Wikisource icon when chapter or title parameteres is linked to Wikisource in a citation. */ | ||
.cs1-ws-icon a { | |||
background-image: url("https://zoophilia.wiki/images/4/4c/Wikisource-logo.svg"); | |||
background-position: right center; | |||
background-repeat: no-repeat; | |||
} | } | ||
body:not(.skin-timeless):not(.skin-minerva) .id-lock-free a, | |||
body:not(.skin-timeless):not(.skin-minerva) .id-lock-limited a, | |||
body:not(.skin-timeless):not(.skin-minerva) .id-lock-registration a, | |||
body:not(.skin-timeless):not(.skin-minerva) .id-lock-subscription a, | |||
.cs1-ws-icon a { | body:not(.skin-timeless):not(.skin-minerva) .cs1-ws-icon a { | ||
background-size: contain; | |||
/* Common.css has a padding set for PDF URLs. bg-contain expands to the size of the padding | |||
which makes the icons very large, so we "reset" the padding here. 1em picked out of a hat | |||
based on the console having a similar rule from elsewhere. */ | |||
padding: 0 1em 0 0; | |||
} | } | ||
/* Errors and maintenance */ | /* Errors and maintenance. */ | ||
.cs1-code { | |||
/* <code>…</code> style override; Mediawiki's CSS definition is specified here: <https://git.wikimedia.org/blob/mediawiki%2Fcore.git/69cd73811f7aadd093050dbf20ed70ef0b42a713/skins%2Fcommon%2FcommonElements.css#L199> | |||
*/ | |||
background: inherit; | |||
border: none; | |||
color: inherit; | |||
padding: inherit; | |||
} | } | ||
.cs1-hidden-error { | .cs1-hidden-error { | ||
color: #d33; | |||
display: none; | |||
} | } | ||
.cs1-visible-error { | .cs1-visible-error { | ||
color: #d33; | |||
} | } | ||
.cs1-maint { | .cs1-maint { | ||
color: #085; | |||
display: none; | |||
margin-left: 0.3em; | |||
} | } | ||
/* | /* Font kerning. */ | ||
.cs1-kern-left { | |||
padding-left: 0.2em; | |||
.cs1- | |||
} | } | ||
.cs1-kern-right { | |||
padding-right: 0.2em; | |||
.cs1-kern- | |||
} | } | ||
. | /* Selflinks – avoid bold font style when CS1/CS2 templates link to the current page. */ | ||
. | .citation .mw-selflink { | ||
font-weight: inherit; | |||
} | } | ||
/* | @media screen { | ||
. | /* Small text size: | ||
Set small text size in one place: here, as 0.95em, applied to 0.9em from the | |||
references list is ~0.85em, which is the lower text size bound for accessibility. | |||
Old styling for this was just 0.85em. We could write the rule so that when this | |||
template is inside references/reflist, only then does it multiply by 0.95em; else | |||
multiply by 0.85em. */ | |||
.cs1-format { | |||
font-size: 0.95em; | |||
} | |||
html.skin-theme-clientpref-night .cs1-maint { | |||
color: #18911f; | |||
} | |||
} | |||
@media screen and (prefers-color-scheme: dark) { | |||
html.skin-theme-clientpref-os .cs1-maint { | |||
color: #18911f; | |||
} | |||
} | } |
Latest revision as of 04:26, 22 November 2024
cite.citation { font-style: inherit; /* Remove italics for <cite>. */ /* Break long URLs, etc., rather than overflowing the box. */ overflow-wrap: break-word; } .citation q { quotes: '"' '"' "'" "'"; /* Straight quotation marks for <q>. */ } /* Highlight linked elements (such as clicked references) in blue. */ .citation:target { /* Ignore the linter, all browsers of interest implement this. */ background-color: #007fff22; } /* ID and URL access: Both Core and Common.css have the selector .mw-parser-output a[href$=".pdf"].external for PDF pages. All TemplateStyles pages are hoisted to .mw-parser-output. We need to have specificity equal to a[href$=".pdf"].external for locks to override a PDF icon. That's essentially two classes and one element. The .id-lock-… selectors are for use by non-citation templates like Catalog lookup link. bg-size `contain` in Minerva and Timeless is too large, so we set a size for them and then exclude them later. */ .id-lock-free.id-lock-free a { background-image: url("https://zoophilia.wiki/images/6/65/Lock-green.svg"); background-position: right center; background-repeat: no-repeat; } .id-lock-limited.id-lock-limited a, .id-lock-registration.id-lock-registration a { background-image: url("https://zoophilia.wiki/images/d/d6/Lock-gray-alt-2.svg"); background-position: right center; background-repeat: no-repeat; } .id-lock-subscription.id-lock-subscription a { background-image: url("https://zoophilia.wiki/images/a/aa/Lock-red-alt-2.svg"); background-position: right center; background-repeat: no-repeat; } /* Wikisource: The Wikisource icon when chapter or title parameteres is linked to Wikisource in a citation. */ .cs1-ws-icon a { background-image: url("https://zoophilia.wiki/images/4/4c/Wikisource-logo.svg"); background-position: right center; background-repeat: no-repeat; } body:not(.skin-timeless):not(.skin-minerva) .id-lock-free a, body:not(.skin-timeless):not(.skin-minerva) .id-lock-limited a, body:not(.skin-timeless):not(.skin-minerva) .id-lock-registration a, body:not(.skin-timeless):not(.skin-minerva) .id-lock-subscription a, body:not(.skin-timeless):not(.skin-minerva) .cs1-ws-icon a { background-size: contain; /* Common.css has a padding set for PDF URLs. bg-contain expands to the size of the padding which makes the icons very large, so we "reset" the padding here. 1em picked out of a hat based on the console having a similar rule from elsewhere. */ padding: 0 1em 0 0; } /* Errors and maintenance. */ .cs1-code { /* <code>…</code> style override; Mediawiki's CSS definition is specified here: <https://git.wikimedia.org/blob/mediawiki%2Fcore.git/69cd73811f7aadd093050dbf20ed70ef0b42a713/skins%2Fcommon%2FcommonElements.css#L199> */ background: inherit; border: none; color: inherit; padding: inherit; } .cs1-hidden-error { color: #d33; display: none; } .cs1-visible-error { color: #d33; } .cs1-maint { color: #085; display: none; margin-left: 0.3em; } /* Font kerning. */ .cs1-kern-left { padding-left: 0.2em; } .cs1-kern-right { padding-right: 0.2em; } /* Selflinks – avoid bold font style when CS1/CS2 templates link to the current page. */ .citation .mw-selflink { font-weight: inherit; } @media screen { /* Small text size: Set small text size in one place: here, as 0.95em, applied to 0.9em from the references list is ~0.85em, which is the lower text size bound for accessibility. Old styling for this was just 0.85em. We could write the rule so that when this template is inside references/reflist, only then does it multiply by 0.95em; else multiply by 0.85em. */ .cs1-format { font-size: 0.95em; } html.skin-theme-clientpref-night .cs1-maint { color: #18911f; } } @media screen and (prefers-color-scheme: dark) { html.skin-theme-clientpref-os .cs1-maint { color: #18911f; } }