Skip to content

Commit

Permalink
Merge pull request #104 from AkshatPandey-2004/main
Browse files Browse the repository at this point in the history 
Merge Sort Page And Footer
  • Loading branch information
@MastanSayyad
MastanSayyad authored Jul 14, 2024
2 parents 3913b7f + 9c135f8 commit eed146c
Show file tree
Hide file tree
Showing 8 changed files with 512 additions and 105 deletions.
141 changes: 70 additions & 71 deletions Algorithm/Bubble.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,11 @@
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
<link rel="stylesheet" href="./bubbles.css">
<link rel="stylesheet" href="fonts/flaticon/font/flaticon.css">

<link href="https://api.fontshare.com/v2/css?f[]=satoshi@400,500,700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" integrity="sha384-k6RqeWeci5ZR/Lv4MR0sA0FfDOMt23cez/3paNdF+ZL0LaFf6FYyUo13EFBZu/9m" crossorigin="anonymous">
<script src="https://kit.fontawesome.com/2815a7015d.js" crossorigin="anonymous"></script>
<title>Bubble Sort</title>
</head>
<body>
Expand Down Expand Up @@ -116,7 +121,8 @@ <h1 class="bubble-sort-title">Bubble Sort</h1>
<div class="row mt-5">
<div class="col-md-6">
<div class="bubble-sort-description">
<p>Bubble Sort is a simple sorting algorithm that repeatedly steps through the list, compares adjacent elements, and swaps them if they are in the wrong order. The pass through the list is repeated until the list is sorted. The algorithm, which is a comparison sort, is named for the way smaller elements "bubble" to the top of the list. Despite its simplicity, Bubble Sort is not suitable for large data sets as its average and worst-case time complexity is quite high.</p>
<p>
Comb Sort is an improvement over Bubble Sort. It works by eliminating turtles, or small values near the end of the list, since in a bubble sort, these slow down the sorting process significantly. The basic idea is to compare elements with a certain gap between them, and then progressively reduce the gap while keeping the elements compared and swapped as necessary.</p>
<br>
<h3>Algorithm:</h3>
<pre><code class="algorithm"></code></pre>
Expand Down Expand Up @@ -292,85 +298,78 @@ <h2 class="text-center">Practice Questions</h2>
</table>
</div>
</section>
<!-- <footer class="container py-4 py-md-5 px-4 px-md-3">
<div class="row d-flex justify-content-center align-items-center text-center">
<div class="col-md-6 mb-3">
<form>
<h5>Subscribe to our newsletter</h5>
<p>Monthly digest of what's new and exciting from us.</p>
<div class="d-flex gap-2 justify-content-center align-items-center">
<input id="newsletter1" type="text" class="form-control w-full" placeholder="Email address">
<button class="btn btn-primary" type="button">Subscribe</button>
</div>
</form>
<footer class="container-fluid py-4 py-md-5 px-4 px-md-3">
<div class="row d-flex justify-content-center align-items-center text-center">
<div class="col-md-6 mb-3">
<form>
<h5>Subscribe to our newsletter</h5>
<p>Monthly digest of what's new and exciting from us.</p>
<div class="d-flex gap-2 justify-content-center align-items-center">
<input id="newsletter1" type="text" class="form-control w-full" placeholder="Email address">
<button class="btn btn-primary" type="button">Subscribe</button>
</div>
</form>
</div>
</div>
</div>
<div class="row mt-5">
<div class="col-md-4 mb-3">
<a class="d-inline-flex align-items-center mb-2 text-body-emphasis text-decoration-none footer-title" href="/" aria-label="Visual Sort">
Visual Sort
</a>
<div class="vs">
<ul class="list-unstyled small">
<li class="mb-2">Visual Sort is a web-based sorting algorithm visualization tool which provides an interactive way to visualize various sorting algorithms in action, helping users understand how different algorithms work and their efficiency in sorting data.</li>
<div class="row mt-5">
<div class="col-md-4 mb-3">
<a id="vs" class="d-inline-flex align-items-center ml- mb-2 text-body-emphasis text-decoration-none footer-title" href="/" aria-label="Visual Sort">
Visual Sort
</a>
<div class="vs">
<ul class="list-unstyled small">
<li class="mb-2">Visual Sort is a web-based sorting algorithm visualization tool which provides an interactive way to visualize various sorting algorithms in action, helping users understand how different algorithms work and their efficiency in sorting data.</li>
</ul>
</div>
</div>
<div class="col-6 col-md-2 mb-3">
<h5>Home</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="#home-section" class="nav-link p-0 text-body-secondary">Home</a></li>
<li class="nav-item mb-2"><a href="#algorithm-section" class="nav-link p-0 text-body-secondary">Algorithms</a></li>
<li class="nav-item mb-2"><a href="#programs-section" class="nav-link p-0 text-body-secondary">Programs</a></li>
</ul>
</div>
</div>
<div class="col-6 col-md-2 mb-3">
<h5>Home</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="#home-section" class="nav-link p-0 text-body-secondary">Home</a></li>
<li class="nav-item mb-2"><a href="#algorithm-section" class="nav-link p-0 text-body-secondary">Algorithms</a></li>
<li class="nav-item mb-2"><a href="#programs-section" class="nav-link p-0 text-body-secondary">Programs</a></li>
</ul>
</div>
<div class="col-6 col-md-2 mb-3">
<h5>About</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="#about-us-section" class="nav-link p-0 text-body-secondary">About</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Our Contributors</a></li>
</ul>
</div>
<div class="col-6 col-md-2 mb-3">
<h5>Support</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="#faq" class="nav-link p-0 text-body-secondary">FAQs</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Contact</a></li>
</ul>
</div>
<div class="col-6 col-md-2 mb-3">
<h5>Legal</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="privacy-policy.html" class="nav-link p-0 text-body-secondary">Privacy Policy</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Terms & Conditions</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Licensing</a></li>
</ul>
</div>
</div>
<div id="topbtn" class="topbtn">
<a class="gotopbtn" href="#"><i class="fa-solid fa-angles-up"></i></a>
</div>
<div class="foot">
<div class="icons">
<div class="linkedin">
<a href="https://www.linkedin.com/in/mastan-sayyad-126904223/"><i class="fa-brands fa-linkedin"></i></a>
<div class="col-6 col-md-2 mb-3">
<h5>About</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="#about-us-section" class="nav-link p-0 text-body-secondary">About</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Our Contributors</a></li>
</ul>
</div>
<div class="github">
<a href="https://github.com/MastanSayyad"><i class="fa-brands fa-github"></i></a>
<div class="col-6 col-md-2 mb-3">
<h5>Support</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="#faq" class="nav-link p-0 text-body-secondary">FAQs</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Contact</a></li>
</ul>
</div>
<div class="instagram">
<a href="#"><i class="fa-brands fa-instagram"></i></a>
<div class="col-6 col-md-2 mb-3">
<h5>Legal</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="privacy-policy.html" class="nav-link p-0 text-body-secondary">Privacy Policy</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Terms & Conditions</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Licensing</a></li>
</ul>
</div>
<div class="twitter">
<a href="#"><i class="fa fa-twitter"></i></a>
</div>
<div class="foot">
<div class="icons">
<a href="https://www.linkedin.com/in/mastan-sayyad-126904223/" class="linkedin"><i class="fa-brands fa-linkedin"></i></a>
<a href="https://github.com/MastanSayyad" class="github"><i class="fa-brands fa-github"></i></a>
<a href="#" class="instagram"><i class="fa-brands fa-instagram"></i></a>
<a href="#" class="twitter"><i class="fa fa-twitter"></i></a>
</div>
</div>
</div>
<div class="d-flex flex-column flex-sm-row justify-content-center py-4 my-4 border-top">
<p>© 2024 Visual Sort - Mastan Sayyad, Inc. All rights reserved.</p>
</div>
</footer> -->
<div id="last" class="d-flex flex-column flex-sm-row justify-content-center py-4 my-1 border-top">
<p>© 2024 Visual Sort - Mastan Sayyad, Inc. All rights reserved.</p>
</div>
</footer>
<div id="topbtn" class="topbtn">
<a class="gotopbtn" href="#"><img id="topbtn" src="../images/upload.png" width="50px" height="50px" alt=""></a>
</div>


<!-- JavaScript Files -->
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script>
Expand Down
102 changes: 86 additions & 16 deletions Algorithm/Mergesort.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
<link rel="stylesheet" href="./bubbles.css">
<script src="https://kit.fontawesome.com/2815a7015d.js" crossorigin="anonymous"></script>
<title>Merge Sort</title>
</head>
<body>
Expand All @@ -29,13 +30,13 @@
Sorting Visualizers
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
<a class="dropdown-item" href="Bubble.html">Bubble Sort</a>
<a class="dropdown-item" href="selectionsort.html">Selection Sort</a>
<a class="dropdown-item" href="Insertion.html">Insertion Sort</a>
<a class="dropdown-item" href="#">Comb Sort</a>
<a class="dropdown-item" href="mergesort.html">Merge Sort</a>
<a class="dropdown-item" href="#">Heap Sort</a>
<a class="dropdown-item" href="#">Quick Sort</a>
<a class="dropdown-item" href="Bubble.html">Bubble Sort</a>
<a class="dropdown-item" href="Selectionsort.html">Selection Sort</a>
<a class="dropdown-item" href="Insertionsort.html">Insertion Sort</a>
<a class="dropdown-item" href="CombSort.html">Comb Sort</a>
<a class="dropdown-item" href="mergesort.html">Merge Sort</a>
<a class="dropdown-item" href="Heapsort.html">Heap Sort</a>
<a class="dropdown-item" href="Quicksort.html">Quick Sort</a>
</div>
</li>
<!-- <li class="nav-item">
Expand All @@ -51,13 +52,13 @@
Algorithm
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
<a class="dropdown-item" href="./Bubble.html">Bubble Sort</a>
<a class="dropdown-item" href="selectionsort.html">Selection Sort</a>
<a class="dropdown-item" href="Insertion.html">Insertion Sort</a>
<a class="dropdown-item" href="#">Comb Sort</a>
<a class="dropdown-item" href="mergesort.html">Merge Sort</a>
<a class="dropdown-item" href="#">Heap Sort</a>
<a class="dropdown-item" href="#">Quick Sort</a>
<a class="dropdown-item" href="Bubble.html">Bubble Sort</a>
<a class="dropdown-item" href="Selectionsort.html">Selection Sort</a>
<a class="dropdown-item" href="Insertionsort.html">Insertion Sort</a>
<a class="dropdown-item" href="CombSort.html">Comb Sort</a>
<a class="dropdown-item" href="mergesort.html">Merge Sort</a>
<a class="dropdown-item" href="Heapsort.html">Heap Sort</a>
<a class="dropdown-item" href="Quicksort.html">Quick Sort</a>
</div>
</li>
<li class="nav-item">
Expand Down Expand Up @@ -160,7 +161,7 @@ <h3 id="tourTitle"></h3>
</div>
</div>
</section>

<!-- Code Section -->
<section class="code-section py-5">
<div class="container">
Expand Down Expand Up @@ -353,7 +354,76 @@ <h2 class="text-center">Practice Questions</h2>
</table>
</div>
</section>

<footer class="container-fluid py-4 py-md-5 px-4 px-md-3">
<div class="row d-flex justify-content-center align-items-center text-center">
<div class="col-md-6 mb-3">
<form>
<h5>Subscribe to our newsletter</h5>
<p>Monthly digest of what's new and exciting from us.</p>
<div class="d-flex gap-2 justify-content-center align-items-center">
<input id="newsletter1" type="text" class="form-control w-full" placeholder="Email address">
<button class="btn btn-primary" type="button">Subscribe</button>
</div>
</form>
</div>
</div>
<div class="row mt-5">
<div class="col-md-4 mb-3">
<a class="d-inline-flex align-items-center mb-2 text-body-emphasis text-decoration-none footer-title" href="/" aria-label="Visual Sort">
Visual Sort
</a>
<div class="vs">
<ul class="list-unstyled small">
<li class="mb-2">Visual Sort is a web-based sorting algorithm visualization tool which provides an interactive way to visualize various sorting algorithms in action, helping users understand how different algorithms work and their efficiency in sorting data.</li>
</ul>
</div>
</div>
<div class="col-6 col-md-2 mb-3">
<h5>Home</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="#home-section" class="nav-link p-0 text-body-secondary">Home</a></li>
<li class="nav-item mb-2"><a href="#algorithm-section" class="nav-link p-0 text-body-secondary">Algorithms</a></li>
<li class="nav-item mb-2"><a href="#programs-section" class="nav-link p-0 text-body-secondary">Programs</a></li>
</ul>
</div>
<div class="col-6 col-md-2 mb-3">
<h5>About</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="#about-us-section" class="nav-link p-0 text-body-secondary">About</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Our Contributors</a></li>
</ul>
</div>
<div class="col-6 col-md-2 mb-3">
<h5>Support</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="#faq" class="nav-link p-0 text-body-secondary">FAQs</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Contact</a></li>
</ul>
</div>
<div class="col-6 col-md-2 mb-3">
<h5>Legal</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="privacy-policy.html" class="nav-link p-0 text-body-secondary">Privacy Policy</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Terms & Conditions</a></li>
<li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Licensing</a></li>
</ul>
</div>
</div>
<div class="foot">
<div class="icons">
<a href="https://www.linkedin.com/in/mastan-sayyad-126904223/" class="linkedin"><i class="fa-brands fa-linkedin"></i></a>
<a href="https://github.com/MastanSayyad" class="github"><i class="fa-brands fa-github"></i></a>
<a href="#" class="instagram"><i class="fa-brands fa-instagram"></i></a>
<a href="#" class="twitter"><i class="fa fa-twitter"></i></a>
</div>
</div>
<div id="last" class="d-flex flex-column flex-sm-row justify-content-center py-4 my-1 border-top">
<p>© 2024 Visual Sort - Mastan Sayyad, Inc. All rights reserved.</p>
</div>
</footer>
<div id="topbtn" class="topbtn">
<a class="gotopbtn" href="#"><img id="topbtn" src="../images/upload.png" width="50px" height="50px" alt=""></a>
</div>
<!-- JavaScript Files -->
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script>
Expand Down
34 changes: 33 additions & 1 deletion Algorithm/Mergesort.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -455,4 +455,36 @@ const bubbleSortAlgorithm = `
description.querySelector('pre code.algorithm').innerText = bubbleSortAlgorithm;
$(document).ready(function() {
$('.dropdown-toggle').dropdown();
});
});


const topButton = document.getElementById("topbtn");
window.onscroll = function () {
if (document.body.scrollTop > 100 || document.documentElement.scrollTop > 100) {
topButton.style.display = "block";
} else {
topButton.style.display = "none";
}
};
topButton.onclick = function (event) {
event.preventDefault();
window.scrollTo({
top: 0,
behavior: 'smooth'
});
};
const upimage = document.getElementByClass("upimage");
window.onscroll = function () {
if (document.body.scrollTop > 100 || document.documentElement.scrollTop > 100) {
topButton.style.display = "block";
} else {
topButton.style.display = "none";
}
};
topButton.onclick = function (event) {
event.preventDefault();
window.scrollTo({
top: 0,
behavior: 'smooth'
});
};
Loading

0 comments on commit eed146c

Please sign in to comment.