MediaWiki:Vector.less

/* ********************************************************
	This file is used to update [[MediaWiki:Vector.css]].
	
	These styles will be applied only to the Vector skin (desktop).
   ******************************************************** */

@common: 'MediaWiki:Common.less';
@dir: 'MediaWiki:Vector.less';

@import '@{common}/mixins.less';
@import '@{common}/variables.less';
@import '@{dir}/elements.less';

// Vector interface files
@import '@{dir}/vectormenu.less';
@import '@{dir}/vectorsearch.less';
@import '@{dir}/vectorsidebar.less';
@import '@{dir}/vectortabs.less';
@import '@{dir}/vectorfooter.less';
// Sidebar (rc widget)
@import '@{dir}/rcsidebar.less';
// Image thumbnails
@import '@{dir}/thumb.less';
//Table of Contents
@import '@{dir}/toc.less';

// Templates
@import '@{dir}/infobox.less';
@import '@{dir}/navbox.less';

// Infobox & Misc Buttons
@import '@{dir}/button.less';

// Editor interface
@import '@{dir}/sourceeditor.less';
@import '@{dir}/editor.less';

// Misc
@import '@{dir}/echo.less';
@import '@{dir}/messagebox.less';
@import '@{dir}/transcripts.less';
@import '@{dir}/nodesktop.less';

// temporarily moved from [[MediaWiki:Common.less/tabber.less]]
// because it caused them on mobile to go off-screen
.tabber {
	display: inline-grid;
}

:root {
	--external-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23936039' d='M6 1h5v5L8.86 3.85 4.7 8 4 7.3l4.15-4.16L6 1Z M2 3h2v1H2v6h6V8h1v2a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1Z'/%3E%3C/svg%3E");
}

// external links icon
.mw-parser-output a.external {
	// using vector-2022 new icon ahead of time
	background-image: var(--external-icon);
	// 12px / <paragraph font size>px; in our wikis' case 0.833
	background-size: 0.833em;
	padding-right: 1em;
}

// [edit] section
.mw-editsection {
	font-family: @sans-serif-stack;

	.client-js .mw-content-ltr &-bracket:first-of-type,
	.client-js .mw-content-ltr &-bracket:not(:first-of-type) {
		color: var(--text-color);
	}
	// when VE is turned on
	&-divider {
		color: var(--text-color);
	}
}


// collapsible wikitables
// TODO: move this out of navbox subpage
.mw-collapsible {
	
    &.mw-collapsed {
        min-width: 250px;
    }

	// Fix toggle style being different before JS takes over.
	&:not( .mw-made-collapsible) th::before,
    .mw-collapsible-toggle {
        font-weight: normal;
    }

}