StarCitizenTools/mediawiki-skins-Citizen
1
0
Fork 0
mirror of https://github.com/StarCitizenTools/mediawiki-skins-Citizen.git synced 2024-11-15 02:24:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(core)!: 💥 ✨ rework font-size CSS variables

Browse source 
To align with Codex tokens, the old --font-size-hN CSS variables are renamed.
Introduced new font size variables (x-small, small)
This commit is contained in:
alistair3149 2024-02-26 16:54:58 -05:00
parent 23ec5e68f9
commit a9acc08e27
No known key found for this signature in database
13 changed files with 41 additions and 40 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
resources/skins.citizen.styles/common/cssvariables.less
View file

@ -80,12 +80,13 @@
--font-family-language-serif: '';
--font-family-language-monospace: '';
--font-size-h1: 1.75rem;
--font-size-h2: 1.375rem;
--font-size-h3: 1.125rem;
--font-size-h4: 1rem;
--font-size-h5: 1rem;
--font-size-h6: 1rem;
--font-size-x-small: 0.75rem;
--font-size-small: 0.875rem;
--font-size-medium: 1rem;
--font-size-large: 1rem;
--font-size-x-large: 1.125rem;
--font-size-xx-large: 1.375rem;
--font-size-xxx-large: 1.75rem;
--font-weight-normal: 400;
--font-weight-medium: ~'calc( var( --font-weight-normal ) + 100)';
@ -167,10 +168,10 @@ html {
@media ( min-width: @min-width-breakpoint-tablet ) {
:root {
--font-size-h1: 2rem;
--font-size-h2: 1.5rem;
--font-size-h3: 1.25rem;
--font-size-h4: 1.125rem;
--font-size-large: 1.125rem;
--font-size-x-large: 1.25rem;
--font-size-xx-large: 1.5rem;
--font-size-xxx-large: 2rem;
}
html {

2
resources/skins.citizen.styles/components/ContentHeader.less
View file

@ -15,7 +15,7 @@
}
&-parenthesis {
font-size: var( --font-size-h3 );
font-size: var( --font-size-x-large );
color: var( --color-base--subtle );
}
}

2
resources/skins.citizen.styles/components/StickyHeader.less
View file

@ -34,7 +34,7 @@
.firstHeading {
overflow: hidden;
font-size: var( --font-size-h3 );
font-size: var( --font-size-x-large );
text-overflow: ellipsis;
}

12
resources/skins.citizen.styles/skinning/elements.less
View file

@ -81,27 +81,27 @@ h6 {
}
h1 {
font-size: var( --font-size-h1 );
font-size: var( --font-size-xxx-large );
}
h2 {
font-size: var( --font-size-h2 );
font-size: var( --font-size-xx-large );
}
h3 {
font-size: var( --font-size-h3 );
font-size: var( --font-size-x-large );
}
h4 {
font-size: var( --font-size-h4 );
font-size: var( --font-size-large );
}
h5 {
font-size: var( --font-size-h5 );
font-size: var( --font-size-medium );
}
h6 {
font-size: var( --font-size-h6 );
font-size: var( --font-size-medium );
}
p {

2
skinStyles/extensions/Cargo/ext.cargo.pagevalues.less
View file

@ -26,6 +26,6 @@
// Tweak size to look more like other sticky header
h2 {
margin: 0;
font-size: var( --font-size-h3 );
font-size: var( --font-size-x-large );
}
}

2
skinStyles/extensions/Echo/ext.echo.special.less
View file

@ -135,7 +135,7 @@
border-radius: var( --border-radius--medium );
&-title {
font-size: var( --font-size-h3 );
font-size: var( --font-size-x-large );
font-weight: var( --font-weight-semibold );
color: var( --color-base--emphasized );
}

8
skinStyles/extensions/MediaSearch/mediasearch.styles.less
View file

@ -869,18 +869,18 @@
/* EmptyState.less */
.sdms-empty-state {
font-size: var( --font-size-h3 );
font-size: var( --font-size-x-large );
}
/* NoResults.less */
.sdms-no-results {
font-size: var( --font-size-h3 );
font-size: var( --font-size-x-large );
font-weight: var( --font-weight-semibold );
}
/* EndOfResults.less */
.sdms-end-of-results {
font-size: var( --font-size-h6 );
font-size: var( --font-size-medium );
font-weight: var( --font-weight-semibold );
color: var( --color-base--emphasized );
}
@ -999,6 +999,6 @@
/* SearchError.less */
.sdms-error {
font-size: var( --font-size-h3 );
font-size: var( --font-size-x-large );
font-weight: var( --font-weight-semibold );
}

2
skinStyles/extensions/UploadWizard/ext.uploadWizard.less
View file

@ -39,7 +39,7 @@
/* uw.ui.Metadata.less */
h3.mwe-upwiz-metadata-title {
font-size: var( --font-size-h3 );
font-size: var( --font-size-x-large );
}
.mwe-upwiz-metadata-booklet.oo-ui-bookletLayout {

12
skinStyles/extensions/VisualEditor/ext.visualEditor.mwformatting.less
View file

@ -27,27 +27,27 @@
}
&-heading1 .oo-ui-tool-title {
font-size: var( --font-size-h1 );
font-size: var( --font-size-xxx-large );
}
&-heading2 .oo-ui-tool-title {
font-size: var( --font-size-h2 );
font-size: var( --font-size-xx-large );
}
&-heading3 .oo-ui-tool-title {
font-size: var( --font-size-h3 );
font-size: var( --font-size-x-large );
}
&-heading4 .oo-ui-tool-title {
font-size: var( --font-size-h4 );
font-size: var( --font-size-large );
}
&-heading5 .oo-ui-tool-title {
font-size: var( --font-size-h5 );
font-size: var( --font-size-medium );
}
&-heading6 .oo-ui-tool-title {
font-size: var( --font-size-h6 );
font-size: var( --font-size-medium );
}
&-preformatted .oo-ui-tool-title {

8
skinStyles/extensions/WikiEditor/ext.wikiEditor.less
View file

@ -169,22 +169,22 @@
}
&[ rel='heading-2' ] {
font-size: var( --font-size-h2 );
font-size: var( --font-size-xx-large );
font-weight: var( --font-weight-semibold );
}
&[ rel='heading-3' ] {
font-size: var( --font-size-h3 );
font-size: var( --font-size-x-large );
font-weight: var( --font-weight-semibold );
}
&[ rel='heading-4' ] {
font-size: var( --font-size-h4 );
font-size: var( --font-size-large );
font-weight: var( --font-weight-semibold );
}
&[ rel='heading-5' ] {
font-size: var( --font-size-h5 );
font-size: var( --font-size-medium );
font-weight: var( --font-weight-semibold );
}
}

2
skinStyles/extensions/WikiHiero/ext.wikihiero.less
View file

@ -55,7 +55,7 @@
background: var( --color-surface-0 );
@media screen and ( min-width: @min-width-breakpoint-tablet ) {
top: ~'calc( var( --line-height-xs ) * var( --font-size-h3 ) + 2 * var( --space-md ) )';
top: ~'calc( var( --line-height-xs ) * var( --font-size-x-large ) + 2 * var( --space-md ) )';
}
}

4
skinStyles/mediawiki/special/mediawiki.special.search.styles.less
View file

@ -110,7 +110,7 @@
padding: var( --space-md ) 0;
a {
font-size: var( --font-size-h3 );
font-size: var( --font-size-x-large );
}
}
}
@ -121,7 +121,7 @@
&-heading {
a {
// font-size: var( --font-size-h3 );
// font-size: var( --font-size-x-large );
font-weight: var( --font-weight-semibold );
}
}

4
skinStyles/mediawiki/special/mediawiki.special.userlogin.signup.styles.less
View file

@ -97,7 +97,7 @@
h2 {
max-width: 20rem;
font-size: var( --font-size-h1 );
font-size: var( --font-size-xxx-large );
}
}
@ -110,7 +110,7 @@
background-size: 4rem;
h3 {
font-size: var( --font-size-h1 );
font-size: var( --font-size-xxx-large );
}
}
}