Sorting-Visualiser/index.html at main · Neer393/Sorting-Visualiser · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.min.js" integrity="sha384-cuYeSxntonz0PPNlHhBs68uyIAVpIIOZZ5JqeqvYYIcEL727kskC66kF92t6Xl2V" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
    <title>Sorting Visualiser</title>
</head>
<body class="bg-dark">
    <nav class="navbar bg-dark">
        <div class="container-fluid">
            <h2 class="text-primary mx-auto">Welcome to Sorting Visualiser</h2>
        </div>
        <div class="container">
            <button type="button" class="p-1 btn btn-outline-primary" id="cna">Create New Array</button>
            <span class="text-white likhahua">Size <input type="range" name="size" min="20" max="100" step=1 value=60 id="sz"></span>
            <span class="text-white likhahua">Speed <input type="range" name="speed" min="20" max="300" stepDown=10 value=60 id="Speed"></span>
            <button type="button" class="p-1 btn btn-outline-primary" id="bs">Bubble Sort</button>
            <button type="button" class="p-1 btn btn-outline-primary" id="ss">Selection Sort</button>
            <button type="button" class="p-1 btn btn-outline-primary" id="ms">Merge Sort</button>
            <button type="button" class="p-1 btn btn-outline-primary" id="hs">Heap Sort</button>
        </div>
    </nav>
    <div class="container flex-container" id="bars"></div>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.min.js" integrity="sha384-cuYeSxntonz0PPNlHhBs68uyIAVpIIOZZ5JqeqvYYIcEL727kskC66kF92t6Xl2V" crossorigin="anonymous"></script>
    <script src="temp.js"></script>
</body>
</html>