Skip to content

Commit 8a28594

Browse files
andreasmallingandreasmalling
authored
Adds message dots to index page
1 parent 5140253 commit 8a28594

1 file changed

Lines changed: 46 additions & 18 deletions

File tree

‎index.html‎

Lines changed: 46 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,53 @@
11
<!DOCTYPE html>
2-
<html>
2+
<html lang="en">
3+
34
<head>
4-
<meta charset="UTF-8">
5-
<title>Welcome to my little world of magic</title>
6-
<style type="text/css">
7-
h1.awesome {text-shadow: 4px 4px 2px black; color: red; font-size: 500%}
8-
</style>
5+
<title>Nothing to see here</title>
96
</head>
107

118
<body>
12-
<h1 class="awesome">Stay tuned for more!</h1>
13-
14-
<p>
15-
<a href="http://validator.w3.org/check?uri=http%3A%2F%2Fcs.au.dk%2F~amao%2F">
16-
<img src="http://www.w3.org/QA/Tools/I_heart_validator"
17-
alt="I heart Validator logo"
18-
title=" Validators Donation Program"
19-
width="80" height="15"
20-
/>
21-
</a>
22-
</p>
23-
9+
<svg viewBox="0 0 120 60" xmlns="http://www.w3.org/2000/svg">
10+
11+
<!-- First Dot -->
12+
<circle cx="40" cy="30" r="8" fill="#3498db">
13+
<animate attributeName="opacity" values="0.3; 1; 0.3" dur="1.4s" repeatCount="indefinite" begin="0s" />
14+
<animate attributeName="cy" values="30; 24; 30" dur="1.4s" repeatCount="indefinite" begin="0s" />
15+
</circle>
16+
17+
<!-- Second Dot -->
18+
<circle cx="60" cy="30" r="8" fill="#3498db">
19+
<animate attributeName="opacity" values="0.3; 1; 0.3" dur="1.4s" repeatCount="indefinite" begin="0.2s" />
20+
<animate attributeName="cy" values="30; 24; 30" dur="1.4s" repeatCount="indefinite" begin="0.2s" />
21+
</circle>
22+
23+
<!-- Third Dot -->
24+
<circle cx="80" cy="30" r="8" fill="#3498db">
25+
<animate attributeName="opacity" values="0.3; 1; 0.3" dur="1.4s" repeatCount="indefinite" begin="0.4s" />
26+
<animate attributeName="cy" values="30; 24; 30" dur="1.4s" repeatCount="indefinite" begin="0.4s" />
27+
</circle>
28+
29+
<!-- Optional: Shadow effect -->
30+
<ellipse cx="60" cy="45" rx="45" ry="6" fill="#000000" opacity="0.05" />
31+
32+
<!-- Alternative animation variation (hidden by default, remove the display="none" to use) -->
33+
<g display="none">
34+
<!-- First Dot (alt) -->
35+
<circle cx="40" cy="30" r="8" fill="#9b59b6">
36+
<animate attributeName="r" values="6; 9; 6" dur="1s" repeatCount="indefinite" begin="0s" />
37+
</circle>
38+
39+
<!-- Second Dot (alt) -->
40+
<circle cx="60" cy="30" r="8" fill="#9b59b6">
41+
<animate attributeName="r" values="6; 9; 6" dur="1s" repeatCount="indefinite" begin="0.3s" />
42+
</circle>
43+
44+
<!-- Third Dot (alt) -->
45+
<circle cx="80" cy="30" r="8" fill="#9b59b6">
46+
<animate attributeName="r" values="6; 9; 6" dur="1s" repeatCount="indefinite" begin="0.6s" />
47+
</circle>
48+
</g>
49+
</svg>
50+
2451
</body>
52+
2553
</html>

0 commit comments

Comments
 (0)