<commit_before>.reactionPopover {
	animation: wcfPopoverOut .3s;
	animation-fill-mode: forwards;
	background-color: $wcfContentBackground;
	border-radius: 2px;
	box-shadow: 0 2px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
	overflow: hidden;
	position: absolute;
	top: 0;
	vertical-align: middle;
	visibility: hidden;
	z-index: 60;
	
	&.active {
		animation: wcfPopover .3s;
		animation-fill-mode: forwards;
	}
	
	&.forceHide {
		animation: 0;
		visibility: hidden;
	}
	
	> .elementPointer {
		display: none;
	}
	
	@include screen-xs {
		&.inverseOrder .reactionTypeButtonList {
			flex-direction: column;
		}
	}
}

.reactionType {
	width: 20px;
	height: 20px;
}

.reactionSummaryList {
	display: inline-flex;
	flex-wrap: wrap;
	margin: -5px -5px 0 0;
	
	&.reactionSummaryListTiny .reactionType {
		width: 16px;
		height: 16px;
	}
	
	&:hover {
		.reactCountButton {
			color: $wcfContentText;
		}
	}
}

.reactionCount{
	@include wcfFontSmall;
	
	vertical-align: middle;
	
	&::before {
		content: ' × ';
	}
}

.reactCountButton {
	color: $wcfContentDimmedText;
	flex: 0 0 auto;
	margin: 5px 5px 0 0;
	white-space: nowrap;
}

.reactionPopoverContent {
	background-color: $wcfContentBackground;
	border-radius: 3px;
	color: $wcfContentText;
	
	a {
		color: $wcfContentLink;
		
		&:hover {
			color: $wcfContentLinkActive;
		}
	}<commit_msg>Unify reaction count button style with notification style<commit_after>.reactionPopover {
	animation: wcfPopoverOut .3s;
	animation-fill-mode: forwards;
	background-color: $wcfContentBackground;
	border-radius: 2px;
	box-shadow: 0 2px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
	overflow: hidden;
	position: absolute;
	top: 0;
	vertical-align: middle;
	visibility: hidden;
	z-index: 60;
	
	&.active {
		animation: wcfPopover .3s;
		animation-fill-mode: forwards;
	}
	
	&.forceHide {
		animation: 0;
		visibility: hidden;
	}
	
	> .elementPointer {
		display: none;
	}
	
	@include screen-xs {
		&.inverseOrder .reactionTypeButtonList {
			flex-direction: column;
		}
	}
}

.reactionType {
	width: 20px;
	height: 20px;
}

.reactionSummaryList {
	display: inline-flex;
	flex-wrap: wrap;
	margin: -5px -5px 0 0;
	
	&.reactionSummaryListTiny .reactionType {
		width: 16px;
		height: 16px;
	}
	
	&:hover {
		.reactCountButton {
			color: $wcfContentText;
		}
	}
}

.reactionCount{
	@include wcfFontSmall;
	
	vertical-align: middle;
	
	&::before {
		content: '\202f×\202f';
	}
}

.reactCountButton {
	color: $wcfContentDimmedText;
	flex: 0 0 auto;
	margin: 5px 5px 0 0;
	white-space: nowrap;
}

.reactionPopoverContent {
	background-color: $wcfContentBackground;
	border-radius: 3px;
	color: $wcfContentText;
	
	a {
		color: $wcfContentLink;
		
		&:hover {
			color: $wcfContentLinkActive;
		}
	}
{'fraction_non_alphanumeric': 0.1329437545653762, 'fraction_numerical': 0.03433162892622352, 'mean_word_length': 3.690068493150685, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 5, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6807609', 'n_tokens_mistral': 1249, 'n_tokens_neox': 1065, 'n_words': 229}