wikimedia/mediawiki-skins-Vector
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git synced 2024-11-13 17:57:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

Remove @font-size-base from vector-2022

Browse source 
Bug: T367899
Change-Id: I6ec44a10a7bfeb6b03912ca6d5a23eaed046db08
This commit is contained in:
bwang 2024-09-23 14:34:28 -05:00
parent 15e7bf48d1
commit 25f4bc2a37
19 changed files with 28 additions and 37 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
resources/mediawiki.less/vector-2022/mediawiki.skin.variables.less
View file

@ -23,10 +23,6 @@
// Overrides for Codex variables:
// Fonts
// Assumes 16px as the default browser font-size.
@font-size-base: unit( 14 / 16, em ); // Equals `0.875em`.
// Body content uses the user setting in browser / the system default sans-serif font:
// Arial on Windows, Roboto on Android.
// FIXME: Use Codex's OS specific default sans-serif fonts.

2
resources/mediawiki.less/vector/mediawiki.skin.variables.less
View file

@ -17,8 +17,6 @@
@opacity-icon-base--hover: 0.8; // = `#333` on `background-color: #fff`. Codex: 0.74
// Fonts
// Assumes 16px as the default browser font-size.
@font-size-base: unit( 14 / 16, em ); // Equals `0.875em`.
// Body content uses the user setting in browser / the system default sans-serif font:
// Arial on Windows, Roboto on Android.

2
resources/skins.vector.styles.legacy/components/Indicators.less
View file

@ -1,5 +1,5 @@
.mw-indicators {
font-size: @font-size-base;
font-size: @font-size-small;
line-height: @line-height-base;
position: relative;
float: right;

4
resources/skins.vector.styles.legacy/typography.less
View file

@ -86,10 +86,10 @@ pre,
}
.vector-body {
font-size: @font-size-base;
font-size: @font-size-small;
// Support IE 9-11, Trident cuts values 2 digits after decimal point.
// `calc` enables to set correct calculation in place again. See T102364.
font-size: @font-size-base--trident-hack;
font-size: @font-size-small--trident-hack;
line-height: @line-height-base;
#siteSub {

7
resources/skins.vector.styles.legacy/variables.less
View file

@ -33,8 +33,7 @@
// https://gerrit.wikimedia.org/r/plugins/gitiles/design/codex/+/refs/heads/main/packages/codex-design-tokens/src/theme-wikimedia-ui.json#429
// See also Vector's 'mediawiki.skin.variables.less' overrides.
@font-size-base: unit( 14 / @font-size-browser, em ); // Equals `0.875em`.
@font-size-base--trident-hack: calc( 1em ~'*' unit( @font-size-base ) );
@font-size-small--trident-hack: calc( 1em ~'*' unit( @font-size-small ) );
@font-size-reset: @font-size-root;
@font-size-heading-1: 1.8em;
@font-size-heading-2: 1.5em;
@ -86,7 +85,7 @@
@height-dropdown-menu-item: unit( 32 / @font-size-browser, rem );
@padding-vertical-dropdown-menu-item: 6px;
@padding-horizontal-dropdown-menu-item: 14px;
@font-size-dropdown: unit( @font-size-base, rem ); // Equals `0.875rem`.
@font-size-dropdown: @font-size-small;
// Scroll Indicator
@height-scroll-indicator: 30px;
@ -110,7 +109,7 @@
@margin-top-pinned-toc: @margin-top-pinned-page-tools + @padding-top-content;
// Search
@max-width-search: unit( 500px / @font-size-browser / @font-size-base, em ); // 35.71428571em @ 16 & 0.875em T270202
@max-width-search: unit( 500px / @font-size-browser / @font-size-small, em ); // 35.71428571em @ 16 & 0.875em T270202
@min-width-search-button: 28px;
@width-search-button: unit( 28 / @font-size-browser / @font-size-search-input, em );
@font-size-search-input: unit( 13 / @font-size-browser, em ); // Equals `0.8125em`.

4
resources/skins.vector.styles/components/Dropdown.less
View file

@ -14,6 +14,10 @@
.mixin-vector-arrowed-dropdown-toggle();
}
.vector-dropdown-label-text {
font-size: @font-size-dropdown;
}
/**
* Invisible checkbox covering the dropdown toggle button.
*/

2
resources/skins.vector.styles/components/Indicators.less
View file

@ -1,5 +1,5 @@
.mw-indicators {
font-size: @font-size-base;
font-size: @font-size-small;
line-height: @line-height-base;
position: relative;
float: right;

5
resources/skins.vector.styles/components/LanguageDropdown.less
View file

@ -18,11 +18,6 @@
// Set opacity to `1` on language button (it applies to more menu because of label color).
opacity: @opacity-base;
.vector-dropdown-label-text {
// Special treatment for language button, based on Vector font-size
font-size: @font-size-base;
}
// T291286: Temporarily use progressive ULS style
&.cdx-button--action-progressive.cdx-button--weight-quiet::after {
mask-image: url( ./images/arrow-down-progressive.svg );

2
resources/skins.vector.styles/components/PageTitlebar.less
View file

@ -22,7 +22,7 @@
}
> .cdx-button {
font-size: @font-size-base;
font-size: @font-size-small;
// When labels have multiple words e.g. "Add topic" make sure they do not wrap onto
// new line. This can happen when editing pages with long titles. e.g. F36867314
white-space: nowrap;

4
resources/skins.vector.styles/components/PageToolbar.less
View file

@ -1,8 +1,8 @@
@border-base-ems: unit( @border-width-base / @font-size-browser / @font-size-base, em );
@border-base-ems: unit( @border-width-base / @font-size-browser / @font-size-small, em );
.vector-page-toolbar-container {
display: flex;
font-size: unit( @font-size-small, rem );
font-size: @font-size-small;
// Use box-shadow instead of border to allow border collapsing between titlebar and toolbar
box-shadow: 0 1px @border-color-subtle;
// Add bottom margin to account for box-shadow

2
resources/skins.vector.styles/components/SearchBox.less
View file

@ -2,7 +2,7 @@
// We have to put those styles outside `.skin-vector-search-vue`,
// as we can't address no-JS modern and Vue enhanced otherwise.
.vector-search-box {
font-size: @font-size-base;
font-size: @font-size-small;
// If this is a flex item, make sure it grows into available space.
flex-grow: 1;

6
resources/skins.vector.styles/components/UserLinks.less
View file

@ -57,7 +57,7 @@
.vector-menu-content-list {
display: flex;
align-items: center;
font-size: @font-size-base;
font-size: @font-size-small;
}
.user-links-collapsible-item {
@ -93,7 +93,7 @@
* Logged-in user-page link in personal (overflow) menu.
*/
#pt-userpage-2 {
max-width: unit( 155 / @font-size-browser / @font-size-base, em );
max-width: unit( 155 / @font-size-browser / @font-size-small, em );
overflow: hidden;
text-overflow: ellipsis;
@ -109,6 +109,6 @@
// T287522#7295558: Increase the max-width of the username when viewport
// allows for it.
@media ( min-width: @min-width-breakpoint-desktop-wide ) {
max-width: unit( 200 / @font-size-browser / @font-size-base, em );
max-width: unit( 200 / @font-size-browser / @font-size-small, em );
}
}

2
resources/skins.vector.styles/layouts/screen.less
View file

@ -90,7 +90,7 @@ body {
// are rendered.
#contentSub:not( :empty ),
#contentSub2 {
font-size: unit( @font-size-small, rem );
font-size: @font-size-small;
color: @color-subtle;
width: auto;
// Visually separate #contentSub and #contentSub2 (T315639)

2
resources/skins.vector.styles/typography.less
View file

@ -177,7 +177,7 @@ pre,
// T335625 - Move siteSub into common.less to prevent it from being feature-flagged
// and overriding on-wiki modifications.
#siteSub {
font-size: unit( @font-size-small, rem ); // T311421
font-size: @font-size-small; // T311421
// By default the sitesub (i.e. tagline) is hidden as it was hidden in Vector legacy but site styles can reveal.
display: none;
}

5
resources/skins.vector.styles/variables.less
View file

@ -22,7 +22,6 @@
// https://gerrit.wikimedia.org/r/plugins/gitiles/design/codex/+/refs/heads/main/packages/codex-design-tokens/src/theme-wikimedia-ui.json#429
// See also Vector's 'mediawiki.skin.variables.less' overrides.
@font-size-base: unit( 14 / @font-size-browser, em ); // Equals `0.875em`.
@font-size-reset: @font-size-root;
@font-size-heading-1: 1.8em;
@font-size-heading-2: 1.5em;
@ -78,7 +77,7 @@
@padding-horizontal-dropdown-menu: 16px;
@padding-vertical-dropdown-menu: 16px;
@padding-vertical-dropdown-menu-item: 6px;
@font-size-dropdown: unit( @font-size-base, rem ); // Equals `0.875rem`.
@font-size-dropdown: @font-size-small;
// TOC
@size-toc-subsection-toggle: 22px;
@ -86,7 +85,7 @@
@toc-list-item-padding-start: 12px;
// Search
@max-width-search: unit( 500px / @font-size-browser / @font-size-base, em ); // 35.71428571em @ 16 & 0.875em T270202
@max-width-search: unit( 500px / @font-size-browser / @font-size-small, em ); // 35.71428571em @ 16 & 0.875em T270202
@min-width-search-button: 28px;
@width-search-button: unit( 28 / @font-size-browser / @font-size-search-input, em );
@font-size-search-input: unit( 13 / @font-size-browser, em ); // Equals `0.8125em`.

4
skinStyles/ext.echo.styles.badge.less
View file

@ -14,8 +14,8 @@
position: absolute;
left: 55%;
top: 43%;
font-size: unit( ( 12 / 16 ) * @font-size-base, rem );
padding: 0 unit( ( 4 / 16 ) * @font-size-base, rem );
font-size: unit( ( 12 / 16 ) * @font-size-small, rem );
padding: 0 unit( ( 4 / 16 ) * @font-size-small, rem );
border: 1px solid #fff;
border-radius: @border-radius-base;
background-color: #72777d;

4
skinStyles/mediawiki.action.edit.less
View file

@ -4,10 +4,10 @@
// @max-width-content-container is defined in ems, so the final width depends on font-size,
// but this element is nested in an element with a different font-size. Divide by the
// current font-size to get the intended result (as if font-size wasn't changed).
max-width: ( @max-width-content-container / @font-size-base );
max-width: ( @max-width-content-container / @font-size-small );
}
.mw-editform {
font-size: unit( @font-size-base, rem );
font-size: @font-size-small;
line-height: @line-height-small;
}

2
skinStyles/ooui.less
View file

@ -2,7 +2,7 @@
// For compatibility with code older than #mw-teleport-target (T350544)
body > .oo-ui-windowManager {
font-size: @font-size-base;
font-size: @font-size-small;
> .oo-ui-dialog {
z-index: @z-index-overlay;

2
skinStyles/teleportTarget.less
View file

@ -1,5 +1,5 @@
@import 'mediawiki.skin.variables.less';
#mw-teleport-target {
font-size: @font-size-base;
font-size: @font-size-small;
}