<commit_before>/**********************************************
/* Element - Edit HTML
/**********************************************/

::shadow .source-code .CodeMirror{
	outline: none !important;
	border: 1px solid @- !important; .contrast(@global-background, 5%);
	border-radius: 5px;
	box-shadow: inset 0 0 15px 0 rgba(17,17,17,.6) !important;
	margin: 10px 0;
	padding: 10px 0 0 10px !important;
	color: @global-text !important;
}

/**********************************************
/* Element Highlighter
/**********************************************/

// overqualify to override chrome selector
.panel.elements #elements-content .CodeMirror {
	outline: none !important;
}

.panel.elements ::shadow,
.panel.console ::shadow {

	.outline-disclosure, // remove when stable no longer uses it
	.elements-disclosure {

		ol:focus li.selected .selection,
		li.selected .selection {
			outline: 1px solid @eh-highlight-outline !important;
			background-color: @eh-highlight-background !important;
		}

		li.hovered:not(.selected) .selection {
			border-radius: 0 !important;
			background-color: @eh-hover-background !important;
			border-top: 1px solid @eh-hover-outline !important;
			border-bottom: 1px solid @eh-hover-outline !important;
		}

	}
}

// cut/copy highlighter
.outline-disclosure li.in-clipboard .highlight {
	outline: 1px dashed @eh-clipboard-selection !important;
}


// ==========================================================================
// Animation Inspection [Experiments]
// ==========================================================================
.animations-timeline {
	background: @global-background !important;
	color: @global-text !important;
	border-top: 2px solid @- !important; .contrast(@global-background, 3%);

	&::shadow {
		.animation-node-row {
			border-bottom: 1px solid @- !important; .contrast(@global-background, 3%);
		}

		// Make the header of the animations contrast against background
		.animation-timeline-grid,
		.animation-controls {
			background: @- !important; .contrast(@global-background, 5%);
		}

		.animation-timeline-header {
			border-bottom: none !important;
		}

		.animation-timeline-rows {
			border-top: 2px solid @- !important; .contrast(@global-background, 3%);
		}

		.animation-node-description {
			& { background-color: @- !important; .contrast(@global-background, 3%); }
			& { border-bottom: 1px solid @- !important; .contrast(@global-background, 5%); }
		}

		// Selected Item
		.animation-node-row.animation-node-selected,
		.animation-node-selected > .animation-node-description {
			background-color: fade(@global-selected, 50) !important;
			box-shadow: inset 0 1px 0 0 fade(@selection-border, 50), inset 0 -1px 0 0 fade(@selection-border, 50);
		}

		// Animation Lines
		.animation-timeline-grid-line {
			fill: @global-background !important;
		}

		circle.animation-endpoint,
		circle.animation-keyframe-point {
			stroke: @global-accent !important;
			fill: @global-accent !important;
		}

		path.animation-keyframe {
			fill: @global-accent !important;
		}

		line.animation-delay-line,
		.animation-line {
			stroke: @global-accent !important;
		}

	}
}

::shadow .elements-tree-outline ol.shadow-root {
	border-left: 1px solid @- !important; .contrast(@global-background, 20%);
}

// inherited from selector is now a link
.sidebar-separator > span.monospace {
	background: none !important;
	border: none !important;
}

// ==========================================================================
// Animation Inspection [Experiments]
// ==========================================================================
.animations-timeline::shadow {

	.animation-controls {
		border-right: none !important;
	}

	.animation-timeline-buffer {
		border-left: none !important;
		border-bottom: 1px solid @global-divider;
	}

	// SVG Icon Representing Animation List
	.animation-buffer-preview.selected {
		background-color: @global-accent !important;
	}

	.animation-buffer-preview.selected > svg > line {
		stroke: @global-background !important;
	}

	.animation-playback-label {
		color: @global-text !important;
		border: 1px solid @- !important; .contrast(@global-background, 8%);
	}

	.animation-name {
		color: @global-text !important;
	}
}

// Syntax Highlighting

.monospace::shadow {
	.node-label-name { color: @xml-tag !important; }
	.node-label-id,
	.node-label-class,
	.node-label-pseudo { color: @css-def !important; }
}


// "== $0" text after selector
::shadow .elements-disclosure li.selected:after {
	color: @global-text !important;
}<commit_msg>Update animation inspection styles<commit_after>/**********************************************
/* Element - Edit HTML
/**********************************************/

::shadow .source-code .CodeMirror{
	outline: none !important;
	border: 1px solid @- !important; .contrast(@global-background, 5%);
	border-radius: 5px;
	box-shadow: inset 0 0 15px 0 rgba(17,17,17,.6) !important;
	margin: 10px 0;
	padding: 10px 0 0 10px !important;
	color: @global-text !important;
}

/**********************************************
/* Element Highlighter
/**********************************************/

// overqualify to override chrome selector
.panel.elements #elements-content .CodeMirror {
	outline: none !important;
}

.panel.elements ::shadow,
.panel.console ::shadow {

	.outline-disclosure, // remove when stable no longer uses it
	.elements-disclosure {

		ol:focus li.selected .selection,
		li.selected .selection {
			outline: 1px solid @eh-highlight-outline !important;
			background-color: @eh-highlight-background !important;
		}

		li.hovered:not(.selected) .selection {
			border-radius: 0 !important;
			background-color: @eh-hover-background !important;
			border-top: 1px solid @eh-hover-outline !important;
			border-bottom: 1px solid @eh-hover-outline !important;
		}

	}
}

// cut/copy highlighter
.outline-disclosure li.in-clipboard .highlight {
	outline: 1px dashed @eh-clipboard-selection !important;
}

// ==========================================================================
// Animation Inspection
// ==========================================================================
::shadow {

	::shadow button {
		border: none;
		background: none;
	}

	.animation-playback-rate-button {
		.button-styles();
		border-radius: unset !important;

		&.selected {
			color: @global-accent !important;
		}
	}

	.animation-timeline-header:after {
		background-color: @global-background !important;
		border-right: 1px solid @global-divider !important;
	}

	.animation-buffer-preview {
		background-color: lighten(@global-background, 5%) !important;

		&.selected {
			border: 1px solid @global-accent !important;
		}
	}

	.animation-timeline-buffer,
	.animation-timeline-buffer-hint {
		border-bottom: 1px solid @toolbar-divider !important;
	}

	.animation-timeline-header,
	.animation-timeline-toolbar-container {
		border-bottom: 1px solid @toolbar-divider !important;
	}

	::shadow .toolbar-divider {
		background-color: @toolbar-item-divider !important;
	}

	.animation-controls,
	.animation-timeline-buffer:empty ~ .animation-timeline-buffer-hint,
	.animation-timeline-buffer:not(:empty) ~ .animation-timeline-rows:empty ~ .animation-timeline-rows-hint {
		color: @global-text !important;
	}

	.animation-node-description {
		background-color: @global-background !important;
		border-bottom: 1px solid @global-divider !important;
	}

	.animation-node-row {
		border-bottom: 1px dashed @global-divider !important;
	}

	.animation-buffer-preview.selected > svg > line {
		stroke: @global-text !important;
	}

	rect.animation-timeline-grid-line {
		fill: @global-divider !important;
	}
}

// Syntax Highlighting
::shadow ::shadow,
.monospace::shadow {
	.node-label-name { color: @xml-tag !important; }
	.node-label-id,
	.node-label-class,
	.node-label-pseudo { color: @css-def !important; }
}


// "== $0" text after selector
::shadow .elements-disclosure li.selected:after {
	color: @global-text !important;
}
{'fraction_non_alphanumeric': 0.23176396735718768, 'fraction_numerical': 0.012178279974890144, 'mean_word_length': 4.342723004694836, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 9, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 2}, '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': '1846754', 'n_tokens_mistral': 2717, 'n_tokens_neox': 2385, 'n_words': 529}