Current File : /home/jvzmxxx/wiki/extensions/Flow/modules/styles/board/topic/post.less
@import 'mediawiki.mixins';
@import 'flow.colors';
@import 'flow.helpers';
@import 'flow.variables';

@highlightedIndent: 0.2em;

// Helpers
.minimalPostHighlight( @negativeMargin ) {
	margin-left: 0 - @negativeMargin - @topicIndent;
	padding-left: @topicIndent + @negativeMargin - @highlightedIndent;
}

// Comments
form.flow-post {
	margin-left: @topicIndent - ( @textareaPadding * 2 );
}

.flow-post {
	position: relative;
	color: @colorText;
	word-wrap: break-word;

	&.flow-post-highlight-newer {
		.flow-post-content {
			.minimalPostHighlight( 0.7em );
		}
	}

	.flow-post {
		&.flow-post-highlight-newer {
			> .flow-post-main .flow-post-content {
				.minimalPostHighlight( -0.1em );
			}
		}

		.flow-post {
			&.flow-post-highlight-newer {
				> .flow-post-main .flow-post-content {
					.minimalPostHighlight( -0.1em );
				}
			}
		}
	}

	// Content of comments
	.flow-post-content {
		// protect from content breaking out of its box
		word-break: break-word;
		overflow: auto;
		max-height: 2000px;
	}

	// Author link in post
	.flow-author {
		font-size: 0.875em;
		line-height: 1.2;
		display: inline-block;
		color: @colorText;
		word-wrap: break-word;

		.mw-userlink {
			font-weight: bold;
		}

		.mw-usertoollinks {
			opacity: 0;
			.transition( opacity 0.25s ease );
		}
		&:hover .mw-usertoollinks {
			opacity: 1;
		}
	}

	.mw-content-ltr & {
		/* @noflip */
		margin: 0.5em 0 0 0.75em;

		// Nested comments (replies & reply forms)
		.flow-replies {
			/* @noflip */
			margin-left: @topicIndent;
			/* @noflip */
			padding-left: 0.5em;
			/* @noflip */
			border-left: 1px solid @colorGrayLighter;
		}

		&.flow-post-max-depth .flow-replies {
			/* @noflip */
			margin-left: 0;
			/* @noflip */
			padding-left: 0;
			/* @noflip */
			border-left-width: 0;

			.flow-post-max-depth {
				/* @noflip */
				margin-left: 0;
			}
		}

		.flow-post-main {
			/* @noflip */
			margin-left: 0.1em;
		}

		// Highlights a post (no IE6 support, but acceptable degradation)
		&.flow-post-highlighted {
			> .flow-post-main {
				/* @noflip */
				@highlightedIndent: @topicIndent - 0.75em;
				/* @noflip */
				padding-left: @highlightedIndent;
				/* @noflip */
				border-left: solid @highlightedIndent @colorHighlight;
			}
		}

		// Highlights all posts newer than a specific post
		&.flow-post-highlight-newer {
			.flow-post-content {
				/* @noflip */
				border-left: solid @highlightedIndent @colorHighlightNewer;
			}
		}
	}

	.mw-content-rtl & {
		/* @noflip */
		margin: 0.5em 0.75em 0 0;

		// Nested comments (replies & reply forms)
		.flow-replies {
			/* @noflip */
			margin-right: @topicIndent;
			/* @noflip */
			padding-right: 0.5em;
			/* @noflip */
			border-right: 1px solid @colorGrayLighter;
		}

		&.flow-post-max-depth .flow-replies {
			/* @noflip */
			margin-right: 0;
			/* @noflip */
			padding-right: 0;
			/* @noflip */
			border-right-width: 0;

			.flow-post-max-depth {
				/* @noflip */
				margin-right: 0;
			}
		}

		.flow-post-main {
			/* @noflip */
			margin-right: 0.1em;
		}

		// Highlights a post (no IE6 support, but acceptable degradation)
		&.flow-post-highlighted {
			> .flow-post-main {
				/* @noflip */
				@highlightedIndent: @topicIndent - 0.75em;
				/* @noflip */
				padding-right: @highlightedIndent;
				/* @noflip */
				border-right: solid @highlightedIndent @colorHighlight;
			}
		}

		// Highlights all posts newer than a specific post
		&.flow-post-highlight-newer {
			.flow-post-content {
				/* @noflip */
				border-right: solid @highlightedIndent @colorHighlightNewer;
			}
		}
	}

}

// Comment metadata
.flow-post-meta {
	// @todo needs overflow: hidden but crops button border at bottom
	color: @colorGrayDark;
	font-size: 0.875em;

	.mw-content-ltr & {
		/* @noflip */
		text-align: right;
	}
	.mw-content-rtl & {
		/* @noflip */
		text-align: left;
	}
}

.flow-post-meta-actions {

	.mw-content-ltr & {
		/* @noflip */
		float: left;
	}

	.mw-content-rtl & {
		/* @noflip */
		float: right;
	}

	a {
		&:after {
			content: '\2022';
			padding: 0 8px;
			text-decoration: none;
			display: inline-block;
			color: @colorGrayDark;
		}
		&:last-child {
			&:after {
				content: '';
			}
		}
	}
}

// MEDIA QUERIES
@media all and ( min-width: @small ) {
	.flow-post {
		/* left margin provided by highlighting zone */
		.mw-content-ltr & {
			/* @noflip */
			margin: 1em 0 0 @topicIndent;
		}

		.mw-content-rtl & {
			/* @noflip */
			margin: 1em @topicIndent 0 0;
		}

		padding: 0;

		.flow-author {
			line-height: inherit;
			font-size: inherit;
		}

		&.flow-post-highlight-newer > .flow-post-main .flow-post-content {
			.minimalPostHighlight( 1.3em );
		}
		.flow-post.flow-post-highlight-newer > .flow-post-main .flow-post-content {
			.minimalPostHighlight( 0.7em );
		}
		.flow-post .flow-post.flow-post-highlight-newer > .flow-post-main .flow-post-content {
			.minimalPostHighlight( 0.7em );
		}
	}
}

// What to do? vector changes this width on us from screen-hd.less with:
//
// @media screen and ( min-width: 982px )
// div#content {
//   margin-left: 11em;
//   padding: 1.25em 1.5em 1.5em 1.5em;
// }
//
// The standard padding for narrower screens is 1em all around.
@media all and ( min-width: 982px ) {
	.flow-post.flow-post-highlight-newer > .flow-post-main .flow-post-content {
		.minimalPostHighlight( 1.8em );
	}
}