<commit_before>.cui-button,
.cui-button-href {
	cursor: pointer;
	text-decoration: none;
}

.cui-button-button,
.cui-button-select {
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	display: inline-flex; // if a button is not in a flex container, behave like "inline-block"
	white-space: nowrap;
	vertical-align: top; // prevents weird button jumping when its content changes from empty to filled with text

	.cui-button-visual {
		display: flex;
		max-width: 100%; // needed for ellipsis
		align-items: center;
		justify-content: center;
		// max-width: 100%;
		// flex-grow: 1;
		font-family: $btn-font-family;
		font-weight: $btn-font-weight;
		color: $body-color;
		vertical-align: middle;
		user-select: none;
		//
		border: $btn-border-width solid transparent;
		box-shadow: $btn-box-shadow;
		margin-bottom: 3px; // block space below the button so the box-shadow is always visible
		// todo: make color mixin?
		background-color: $btn-background;

		@include button-size($btn-height, $btn-padding-x, $btn-font-size, $btn-border-radius);

		// Button Content
		.cui-button-left,
		.cui-button-right {
			display: inline-flex;

			&:only-child {
				.fa {<commit_msg>CUI: button: the button-visual style needs to be more generic, its used in all kinds of buttons.<commit_after>.cui-button,
.cui-button-href {
	cursor: pointer;
	text-decoration: none;
}

// Base button visual class, used in cui-button-button, cui-button-checkbox, cui-button-select...
.cui-button-visual {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 100%;
	flex-grow: 1;
}

.cui-button-button,
.cui-button-select {
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	display: inline-flex; // if a button is not in a flex container, behave like "inline-block"
	white-space: nowrap;
	vertical-align: top; // prevents weird button jumping when its content changes from empty to filled with text

	.cui-button-visual {
		font-family: $btn-font-family;
		font-weight: $btn-font-weight;
		color: $body-color;
		vertical-align: middle;
		user-select: none;
		//
		border: $btn-border-width solid transparent;
		box-shadow: $btn-box-shadow;
		margin-bottom: 3px; // block space below the button so the box-shadow is always visible
		// todo: make color mixin?
		background-color: $btn-background;

		@include button-size($btn-height, $btn-padding-x, $btn-font-size, $btn-border-radius);

		// Button Content
		.cui-button-left,
		.cui-button-right {
			display: inline-flex;

			&:only-child {
				.fa {
{'fraction_non_alphanumeric': 0.1367588932806324, 'fraction_numerical': 0.0067193675889328066, 'mean_word_length': 3.4481546572934976, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, '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': '2393170', 'n_tokens_mistral': 943, 'n_tokens_neox': 861, 'n_words': 245}