mediawiki-extensions-CategoryTree/modules/ext.categoryTree.styles.less

/**
 * Stylesheet for the CategoryTree extension.
 *
 * © 2006 Daniel Kinzler
 *
 * This program is free software; you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation; either version 2 of the License, or
 * (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License along
 * with this program; if not, write to the Free Software Foundation, Inc.,
 * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
 * http://www.gnu.org/copyleft/gpl.html
 *
 * @file
 * @ingroup Extensions
 * @author Daniel Kinzler, brightbyte.de
 */

@import 'mediawiki.mixins.less';
@import 'mediawiki.skin.variables.less';

.client-js #mw-subcategories ul {
	/* On the list of subcategories hide the normal list bullet */
	list-style: none;
	/* and reduce the margin on the margin start side. */
	.margin-inline( 0.25em, 0 );
}

#mw-panel .portal .body .CategoryTreeTag {
	margin: 0;
	font-size: 0.75em;
	line-height: 1.125em;
}

#mw-panel .portal .body .CategoryTreeItem {
	padding: 0.25em 0;
}

/* Indent the children on each level on margin start side. */
.CategoryTreeChildren {
	.margin-inline( 1.25em, 0 );
}

.CategoryTreeBullet,
.CategoryTreeEmptyBullet {
	.user-select( none );
}

@arrow-size: 14px;

.expandable-arrow( @param-color ) {
	.cdx-mixin-css-icon(
		@cdx-icon-down-triangle, @param-color, @arrow-size,
		false, center, text-top
	);
}

.CategoryTreeEmptyBullet {
	.expandable-arrow( @background-color-disabled );
}

/* Hide toggle buttons for clients without JavaScript */
.client-nojs .CategoryTreeBullet,
.client-nojs .CategoryTreeEmptyBullet {
	display: none;
}

.CategoryTreeEmptyBullet,
.CategoryTreeToggle,
.CategoryTreePageBullet {
	display: inline-block;
	width: 0;
	height: 0;
}

.CategoryTreeToggle {
	transition: transform 250ms ease;
	.expandable-arrow( @color-progressive );
}

.CategoryTreeEmptyBullet,
.CategoryTreeToggle[ aria-expanded='false' ] {
	[ dir='ltr' ] &,
	[ dir='rtl' ] [ dir='ltr' ] & {
		transform: rotate( -90deg );
	}

	[ dir='rtl' ] &,
	[ dir='ltr' ] [ dir='rtl' ] & {
		transform: rotate( 90deg );
	}
}

.CategoryTreePageBullet {
	width: @arrow-size;
}

.CategoryTreeLabelPage {
	font-style: italic;
}

.CategoryTreeParents {
	margin-top: 1.5ex;
	font-style: italic;
}

.CategoryTreeTag {
	margin-top: 0.5ex;
	margin-bottom: 0.5ex;
}

.CategoryTreeResult {
	margin-top: 1.5ex;
}

.CategoryTreeNotice {
	font-style: italic;
}