<commit_before># slideIt
It is a css library just like animate css but for image slide show...


To use this library, you can study below html code and play with below classes.

  	slideUp
  	slideDown
  	slideLeft
  	slideRight
  	assorted
  	assortedUpLeft
  	assortedUpRight
  	assortedDownLeft
  	assortedDownRight
  	

	<div class="slide-it">
		<div class="slideShow">

			<div class="image">
				<!-- TO dispay three images, don't add the effect here -->
				<img src="bg2.jpg" class = "" alt>
				<h1 class = "">
					Learn and move forward
				</h1>
			</div>


			<div class="image">
				<!--To display two images, remove waitForTwelveSeconds start fadeOut infinite here--> 
				<img src="bg1.jpg" class="waitForTwelveSeconds start slideLeft infinite" alt>
				<h1 class = "text waitForTwelveSeconds start slideLeft infinite">
					Solve the problem
				</h1>
			</div>


			<div class="image">
				<img src="ayo.jpg" class="waitForSixSeconds start slideRight infinite" alt>
				<h1 class = "text waitForSixSeconds start slideRight infinite">
					Create a problem for yourself...
				</h1>
			</div>


		</div>
	</div>

	<div class="displayOthers"> This is another very important thing we have to work on this day</div>


Or Check it out and play with it on codepen: https://codepen.io/codingnninja/pen/MERWJZ

It will be better if the images are loaded as backgroud of <div> elements. I will get back to you on that soon.<commit_msg>Boom: getting started in real time<commit_after># slideIt
It is a css library just like animate css but for image slide show...


To use this library, you can study below html code and play with below classes.
	
  	slideUp
  	slideDown
  	slideLeft
  	slideRight
  	assorted
  	assortedUpLeft
  	assortedUpRight
  	assortedDownLeft
  	assortedDownRight
  	waitForThreeSeconds
  	waitForSixSeconds
  	WaitForTwelveSeconds
  	WaitForEightenSeconds
  	WaitForTwentyForSeconds


  	If you want the animation to show once, you may need to remove infinite class from you elements.
  	

	<div class="slide-it">
		<div class="slideShow">

			<div class="image">
				<!-- TO dispay three images, don't add the effect here -->
				<img src="bg2.jpg" class = "" alt>
				<h1 class = "">
					Learn and move forward
				</h1>
			</div>


			<div class="image">
				<!--To display two images, remove waitForTwelveSeconds start fadeOut infinite here--> 
				<img src="bg1.jpg" class="waitForTwelveSeconds start slideLeft infinite" alt>
				<h1 class = "text waitForTwelveSeconds start slideLeft infinite">
					Solve the problem
				</h1>
			</div>


			<div class="image">
				<img src="ayo.jpg" class="waitForSixSeconds start slideRight infinite" alt>
				<h1 class = "text waitForSixSeconds start slideRight infinite">
					Create a problem for yourself...
				</h1>
			</div>


		</div>
	</div>

	<div class="displayOthers"> This is another very important thing we have to work on this day</div>


Or Check it out and play with it on codepen: https://codepen.io/codingnninja/pen/MERWJZ

It will be better if the images are loaded as backgroud of <div> elements. I will get back to you on that soon.
{'fraction_non_alphanumeric': 0.09099616858237548, 'fraction_numerical': 0.005108556832694764, 'mean_word_length': 3.2166890982503364, 'pattern_counts': {'":': 0, '<': 51, '<?xml version=': 0, '>': 51, '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': '5667636', 'n_tokens_mistral': 1122, 'n_tokens_neox': 961, 'n_words': 371}