<commit_before><!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">

	<meta name="viewport" content="width=device-width, initial-scale=1">

	<title>skrollr - parallax scrolling for the masses</title>

	<link href="examples/fixed-positioning.css" rel="stylesheet" type="text/css" />
	<link href="examples/main.css" rel="stylesheet" type="text/css" />
</head>

<body>
	<div id="skrollr-body">
		<div id="bg1" data-0="background-position:0% 0%;" data-end="background-position:-100% -1500%;"></div>
		<div id="bg2" data-0="background-position:0% 0%;" data-end="background-position:-50% -1200%;"></div>
		<div id="bg3" data-0="background-position:0% 0%;" data-end="background-position:-25% -800%;"></div>
		<div id="progress" data-0="width:0%;background:hsl(200, 100%, 50%);" data-end="width:100%;background:hsl(920, 100%, 50%);"></div>

		<div id="intro" data-0="opacity:1;top:3%;transform:rotate(0deg);transform-origin:0 0;" data-500="opacity:0;top:-10%;transform:rotate(-90deg);">
			<h1><a href="https://github.com/Prinzhorn/skrollr">skrollr</a></h1>
			<h2>parallax scrolling for the masses</h2>
			<p>let's get scrollin' ;-)</p>
			<p class="arrows">▼&nbsp;▼&nbsp;▼</p>
		</div>

		<div id="transform" data-500="transform:scale(0) rotate(0deg);" data-1000="transform:scale(1) rotate(1440deg);opacity:1;" data-1600="" data-1700="transform:scale(10) rotate(3240deg);opacity:0;"><commit_msg>make background movement in pixel instead of % to be more consistent<commit_after><!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">

	<meta name="viewport" content="width=device-width, initial-scale=1">

	<title>skrollr - parallax scrolling for the masses</title>

	<link href="examples/fixed-positioning.css" rel="stylesheet" type="text/css" />
	<link href="examples/main.css" rel="stylesheet" type="text/css" />
</head>

<body>
	<div id="skrollr-body">
		<div id="bg1" data-0="background-position:0px 0px;" data-end="background-position:-500px -10000px;"></div>
		<div id="bg2" data-0="background-position:0px 0px;" data-end="background-position:-500px -8000px;"></div>
		<div id="bg3" data-0="background-position:0px 0px;" data-end="background-position:-500px -6000px;"></div>
		<div id="progress" data-0="width:0%;background:hsl(200, 100%, 50%);" data-end="width:100%;background:hsl(920, 100%, 50%);"></div>

		<div id="intro" data-0="opacity:1;top:3%;transform:rotate(0deg);transform-origin:0 0;" data-500="opacity:0;top:-10%;transform:rotate(-90deg);">
			<h1><a href="https://github.com/Prinzhorn/skrollr">skrollr</a></h1>
			<h2>parallax scrolling for the masses</h2>
			<p>let's get scrollin' ;-)</p>
			<p class="arrows">▼&nbsp;▼&nbsp;▼</p>
		</div>

		<div id="transform" data-500="transform:scale(0) rotate(0deg);" data-1000="transform:scale(1) rotate(1440deg);opacity:1;" data-1600="" data-1700="transform:scale(10) rotate(3240deg);opacity:0;">
{'fraction_non_alphanumeric': 0.22763942476324098, 'fraction_numerical': 0.07225534900035076, 'mean_word_length': 6.544973544973545, 'pattern_counts': {'":': 0, '<': 69, '<?xml version=': 0, '>': 69, 'https://': 2, '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': '3888338', 'n_tokens_mistral': 1230, 'n_tokens_neox': 1059, 'n_words': 173}