mediawiki-skins-Citizen/skinStyles/extensions/Flow/ext.flow.styles.base.less

/*
 * Citizen
 *
 * SkinStyles for Extension:StructuredDiscussions
 * Module: ext.flow.styles.base
 * Version: REL1_35 (e3379f0)
 *
 * Date: 2022-04-27
*/

/* styles/common.less */
.flow-component {
	.flow-list {
		li:hover {
			background: var( --color-surface-3 );
		}

		a:focus {
			background-color: var( --color-surface-3 );
		}
	}
}

/* Revision view */
.flow-revision-content {
	color: var( --color-subtle );
	background-color: var( --color-surface-3 );
}

/* "No more" link */
.flow-no-more,
.flow-undo {
	color: var( --color-subtle );
}

/* styles/board/menu.less */
div > .flow-menu {
	&.flow-menu-hoverable:hover,
	&.focus {
		.flow-menu-js-drop a {
			.caret {
				// border-top-color: #000;
			}
		}
	}

	ul {
		background: var( --color-surface-1 );
		border-color: var( --border-color-base );
		box-shadow: var( --box-shadow-drop-xx-large );

		> section:not( :first-of-type ) > li:first-of-type,
		li.flow-menu-section:not( :first-of-type ) {
			border-top-color: var( --border-color-base );
		}
	}

	.flow-menu-js-drop {
		a {
			color: var( --color-subtle );
		}
	}
}

/* styles/board/navigation.less */
.flow-board-navigation {
	.flow-board-navigation-inner {
		border-bottom-color: var( --border-color-base );
	}

	a {
		&:link,
		&:visited {
			color: var( --color-subtle );
		}

		&:hover,
		&:focus,
		&.flow-board-navigator-link-highlight {
			color: var( --color-emphasized );
		}
	}

	&.flow-board-navigation-affixed {
		background: var( --color-surface-1 );
	}
}

/* styles/board/moderated.less */
// Visually mark locked topics
.flow-topic-moderatestate-lock {
	.flow-topic-titlebar {
		background-color: var( --color-surface-2 );
	}
}

// Entire moderated post element
.flow-post-moderated .flow-author a,
.flow-moderated-post-content {
	color: var( --color-subtle );
}

/* styles/board/timestamps.less */
a.flow-timestamp-anchor:hover {
	color: var( --color-link--hover );

	&:visited {
		color: var( --color-link--hover );
	}

	&:active {
		color: var( --color-link--active );
	}
}

/* styles/board/replycount.less */
// Reply count (only visible in compact mode)
.flow-reply-count {
	color: var( --color-subtle );

	.flow-reply-count-number {
		color: var( --color-subtle );
	}
}

/* styles/board/terms-of-use.less */
.flow-terms-of-use {
	color: var( --color-subtle );
}

/* styles/board/topic/titlebar.less */
// Show that the topic titlebar is clickable
.flow-topic-titlebar {
	background-color: var( --color-surface-3 );
}

.flow-moderated-topic-title {
	color: var( --color-subtle );
}

/* styles/board/topic/meta.less */
// Topic metadata
.flow-topic-meta {
	color: var( --color-subtle );

	a.expand-collapse-posts-link:not( :hover ) {
		color: var( --color-subtle );
	}
}

/* styles/board/topic/post.less */
.flow-post {
	color: var( --color-base );

	// Author link in post
	.flow-author {
		color: var( --color-base );
	}

	.mw-content-ltr & {
		// Nested comments (replies & reply forms)
		.flow-replies {
			/* @noflip */
			border-left-color: var( --border-color-base );
		}

		// Highlights a post (no IE6 support, but acceptable degradation)
		&.flow-post-highlighted {
			> .flow-post-main {
				/* @noflip */
				border-left-color: var( --color-success );
			}
		}

		// Highlights all posts newer than a specific post
		&.flow-post-highlight-newer {
			.flow-post-content {
				/* @noflip */
				border-left-color: var( --color-progressive );
			}
		}
	}

	.mw-content-rtl & {
		// Nested comments (replies & reply forms)
		.flow-replies {
			/* @noflip */
			border-right-color: var( --border-color-base );
		}

		// Highlights a post (no IE6 support, but acceptable degradation)
		&.flow-post-highlighted {
			> .flow-post-main {
				/* @noflip */
				border-right-color: var( --color-success );
			}
		}

		// Highlights all posts newer than a specific post
		&.flow-post-highlight-newer {
			.flow-post-content {
				/* @noflip */
				border-right-color: var( --color-progressive );
			}
		}
	}
}

// Comment metadata
.flow-post-meta {
	color: var( --color-subtle );
}

.flow-post-meta-actions {
	a {
		&::after {
			color: var( --color-subtle );
		}
	}
}

/* styles/board/topic/summary.less */
.flow-topic-summary-container {
	.flow-topic-summary,
	.flow-ui-editTopicSummaryWidget {
		border-top-color: var( --border-color-base );

		.flow-topic-summary-author {
			color: var( --color-subtle );
		}
	}
}

@media all and ( min-width: 1165px ) {
	.flow-component.flow-board-page {
		.flow-board-header {
			background-color: var( --color-surface-3 );
		}
	}

	.flow-component.flow-board-page.flow-full-height-side-rail {
		.flow-board-header::before {
			background-color: var( --color-surface-3 );
		}
	}
}