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';

/* On the list of subcategories hide the normal list bullet */
.client-js #mw-subcategories ul {
	list-style: none;
}

/* and reduce the margin on the margin start side. */
/* @noflip */
.client-js #mw-subcategories .mw-content-ltr ul {
	margin-left: 0.25em;
}

/* @noflip */
.client-js #mw-subcategories .mw-content-rtl ul {
	margin-right: 0.25em;
}

#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.
 * A category tree in the sidebar is in user interface language therefor
 * a flipped margin-left is the margin start side.
 */
.CategoryTreeChildren {
	margin-left: 1.25em;
}

/*
 * Category trees in the content are in content language and therefor
 * an unflipped margin-left or margin-right is the margin start side.
 * Use margin: 0 0 0 1.25em instead of margin-left: 1.25em here to
 * overwrite the flipped margin-left from above.
 */
/* @noflip */
.mw-content-ltr .CategoryTreeChildren,
.mw-content-rtl .mw-content-ltr .CategoryTreeChildren {
	margin: 0 0 0 1.25em;
}

/* @noflip */
.mw-content-rtl .CategoryTreeChildren,
.mw-content-ltr .mw-content-rtl .CategoryTreeChildren {
	margin: 0 1.25em 0 0;
}

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

.expandable-arrow( @param-color ) {
	.cdx-mixin-css-icon(
		@cdx-icon-down-triangle, @param-color, 14px,
		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 );

	&:visited {
		.expandable-arrow( @color-visited );
	}
}

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

	.mw-content-rtl &,
	.mw-content-ltr .mw-content-rtl & {
		transform: rotate( 90deg );
	}
}

.CategoryTreePageBullet {
	margin-left: 14px;
}

.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;
}