model output
Qwen3-VL-8B-Instruct

Loaders (WIP)
A 0.75T 0.21
1<!DOCTYPE html>
2<html lang="en">
3<head>
4    <meta charset="UTF-8">
5    <meta name="viewport" content="width=device-width, initial-scale=1.0">
6    <title>Loading Animation</title>
7    <style>
8        body {
9            background-color: #e64a19;
10            display: flex;
11            justify-content: center;
12            align-items: center;
13            height: 100vh;
14            margin: 0;
15        }
16        .loader {
17            display: flex;
18            align-items: center;
19            justify-content: center;
20            width: 100px;
21            height: 30px;
22            background-color: #e64a19;
23            border-radius: 4px;
24            position: relative;
25            overflow: hidden;
26        }
27        .loader-bar {
28            width: 0;
29            height: 100%;
30            background-color: white;
31            transition: width 0.6s ease-in-out;
32            position: absolute;
33            top: 0;
34            left: 0;
35        }
36        .loader-text {
37            position: absolute;
38            top: 0;
39            left: 0;
40            width: 100%;
41            text-align: center;
42            color: white;
43            font-size: 14px;
44            font-weight: bold;
45            padding: 0 5px;
46            white-space: nowrap;
47            overflow: hidden;
48            text-overflow: ellipsis;
49        }
50    </style>
51</head>
52<body>
53    <div class="loader">
54        <div class="loader-bar"></div>
55        <div class="loader-text">LOADING...</div>
56    </div>
57
58    <script>
59        const loaderBar = document.querySelector('.loader-bar');
60        const loaderText = document.querySelector('.loader-text');
61
62        function animateLoader() {
63            loaderBar.style.width = '100%';
64            setTimeout(() => {
65                loaderBar.style.width = '0%';
66                setTimeout(() => {
67                    loaderText.textContent = 'LOADING...';
68                    animateLoader();
69                }, 500);
70            }, 600);
71        }
72
73        animateLoader();
74    </script>
75</body>
76</html>