<commit_before>@import '../variables';

#prototypopanel {
	height:100%;
	position:relative;
	display:flex;
	flex-direction:column;
	flex: 1;
	min-height: 0;

}

.panel-demo-overlay {
	position:absolute;
	width: 100%;
	height: 100%;
	background-color: transparentize($green, 0.2);
	z-index: 99;

	&-text {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		color:$dark-grey;
		font-size: 20px;
		display: block;
		cursor: default;
		padding: 60px 30px;
		background-color: $white;
		z-index: 999;
		text-align: center;
		width: 760px;
		p {
			padding: 0px 40px;
		}
		&-academy-cta, &-gopro-cta {
			font-size: 20px;
			cursor: pointer;
			background-position: 15px center;
			background-size: 25px 25px;
			background-repeat: no-repeat;
			padding: 15px 15px 15px 50px;
			margin-top: 20px;
			border-radius: 10px;
			text-align: left;
			transition: color 0.5s ease, background-color 0.5s ease;
		}

		&-academy-cta {
			color:$dark-grey;
			background-color: $white;
			background-image: url('../../images/graduate-cap-black.svg');
			float: left;
			border: 3px solid $dark-grey;
			margin-left: auto;

			&:hover {
				color: $white;
				background-color: $dark-grey;
				background-image: url('../../images/graduate-cap-white.svg');
			}
		}

		&-gopro-cta {
			color:$green;
			background-color: $white;
			background-image: url('../../images/pro-version-green.svg');
			border: 3px solid $green;
			margin-right: auto;
			margin-left: auto;
			width: auto;
			display: inline-block;
			&:hover {
				color:$white;
				background-color: $green;
				background-image: url('../../images/pro-version.svg');
			}
		}

		svg {
			position: relative;
			display: block;
			width: 325px;
			height: auto;
			margin: 0 auto;
			margin-bottom: 20px;
			cursor: pointer;
			overflow: visible;

			.st12, .st13, .st14, .st15 {
				transition: transform 0.3s ease-in-out;
				transform: translateY(12px);
			}

			.st0, .st1 {
					transition: transform 0.3s ease-in-out;
					transform-origin: center;
			}

			.st2 {
				transform-origin: center;
				path {
					transform-origin: center;
				}
			}
			&:hover  {
				.st12, .st13, .st14, .st15 {
					transform: translateY(4px);
				}

				.st2 {
					animation: pendulum 8s linear infinite reverse;
					path {
						animation: orbit 6s linear infinite reverse;
					}
				}

				.st0, .st1 {
					transform: scale(1.05);
				}
			}
		}

		@keyframes orbit {
			0% { transform: rotate(0deg) scale(1); }
			33% { transform: rotate(90deg) scale(1.2); }
			66% { transform: rotate(270deg) scale(0.8); }
			100% { transform: rotate(360deg) scale(1);}
		}

		@keyframes pendulum {
			0% { transform: rotate(0deg); }
			100% { transform: rotate(360deg); }
		}
	}
}

#prototypoword {
	flex: 1 1 30%;
	overflow:visible;
	position:relative;
}

#prototypotextandglyph {
	flex: 1 1 70%;
	display:flex;
	flex-direction:row;
	overflow:hidden;
}

#prototyposlidertooltip {
	position: absolute;
	display: block;
	top: 52px;
	right: -228px;
	width: 228px;
	z-index: 3;<commit_msg>fix slider tooltip z-index to be above node prop panel<commit_after>@import '../variables';

#prototypopanel {
	height:100%;
	position:relative;
	display:flex;
	flex-direction:column;
	flex: 1;
	min-height: 0;

}

.panel-demo-overlay {
	position:absolute;
	width: 100%;
	height: 100%;
	background-color: transparentize($green, 0.2);
	z-index: 99;

	&-text {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		color:$dark-grey;
		font-size: 20px;
		display: block;
		cursor: default;
		padding: 60px 30px;
		background-color: $white;
		z-index: 999;
		text-align: center;
		width: 760px;
		p {
			padding: 0px 40px;
		}
		&-academy-cta, &-gopro-cta {
			font-size: 20px;
			cursor: pointer;
			background-position: 15px center;
			background-size: 25px 25px;
			background-repeat: no-repeat;
			padding: 15px 15px 15px 50px;
			margin-top: 20px;
			border-radius: 10px;
			text-align: left;
			transition: color 0.5s ease, background-color 0.5s ease;
		}

		&-academy-cta {
			color:$dark-grey;
			background-color: $white;
			background-image: url('../../images/graduate-cap-black.svg');
			float: left;
			border: 3px solid $dark-grey;
			margin-left: auto;

			&:hover {
				color: $white;
				background-color: $dark-grey;
				background-image: url('../../images/graduate-cap-white.svg');
			}
		}

		&-gopro-cta {
			color:$green;
			background-color: $white;
			background-image: url('../../images/pro-version-green.svg');
			border: 3px solid $green;
			margin-right: auto;
			margin-left: auto;
			width: auto;
			display: inline-block;
			&:hover {
				color:$white;
				background-color: $green;
				background-image: url('../../images/pro-version.svg');
			}
		}

		svg {
			position: relative;
			display: block;
			width: 325px;
			height: auto;
			margin: 0 auto;
			margin-bottom: 20px;
			cursor: pointer;
			overflow: visible;

			.st12, .st13, .st14, .st15 {
				transition: transform 0.3s ease-in-out;
				transform: translateY(12px);
			}

			.st0, .st1 {
					transition: transform 0.3s ease-in-out;
					transform-origin: center;
			}

			.st2 {
				transform-origin: center;
				path {
					transform-origin: center;
				}
			}
			&:hover  {
				.st12, .st13, .st14, .st15 {
					transform: translateY(4px);
				}

				.st2 {
					animation: pendulum 8s linear infinite reverse;
					path {
						animation: orbit 6s linear infinite reverse;
					}
				}

				.st0, .st1 {
					transform: scale(1.05);
				}
			}
		}

		@keyframes orbit {
			0% { transform: rotate(0deg) scale(1); }
			33% { transform: rotate(90deg) scale(1.2); }
			66% { transform: rotate(270deg) scale(0.8); }
			100% { transform: rotate(360deg) scale(1);}
		}

		@keyframes pendulum {
			0% { transform: rotate(0deg); }
			100% { transform: rotate(360deg); }
		}
	}
}

#prototypoword {
	flex: 1 1 30%;
	overflow:visible;
	position:relative;
}

#prototypotextandglyph {
	flex: 1 1 70%;
	display:flex;
	flex-direction:row;
	overflow:hidden;
}

#prototyposlidertooltip {
	position: absolute;
	display: block;
	top: 52px;
	right: -228px;
	width: 228px;
	z-index: 4;
{'fraction_non_alphanumeric': 0.15501222493887531, 'fraction_numerical': 0.04955175224123879, 'mean_word_length': 2.8230529595015574, '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': '3295556', 'n_tokens_mistral': 3002, 'n_tokens_neox': 2281, 'n_words': 512}