-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
99 lines (88 loc) · 4.05 KB
/
index.html
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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="./style.min.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Pixelify+Sans%7CUbuntu+Mono">
<link rel="apple-touch-icon" sizes="180x180" href="img/favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="img/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="img/favicon/favicon-16x16.png">
<link rel="manifest" href="img/favicon/site.webmanifest">
<!-- Primary Meta Tags -->
<title>Pixel Base - Cute Pixel Fun</title>
<meta name="title" content="Pixel Base - Cute Pixel Fun">
<meta name="description"
content="Catch the apples. Don't miss the golden apples! This game and website is made for the sake of cute pixel fun - and to practice HTML, CSS, Sass, and JavaScript.">
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://pixelba.se">
<meta property="og:title" content="Pixel Base - Cute Pixel Fun">
<meta property="og:description"
content="Catch the apples. Don't miss the golden apples! This game and website is made for the sake of cute pixel fun - and to practice HTML, CSS, Sass, and JavaScript.">
<meta property="og:image" content="img/pixel-sanjin.webp">
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://pixelba.se">
<meta property="twitter:title" content="Pixel Base - Cute Pixel Fun">
<meta property="twitter:description"
content="Catch the apples. Don't miss the golden apples! This game and website is made for the sake of cute pixel fun - and to practice HTML, CSS, Sass, and JavaScript.">
<meta property="twitter:image" content="img/pixel-sanjin.webp">
<script src="script.js" defer></script>
</head>
<body>
<main>
<header>
<h1>Pixel Base</h1>
</header>
<div class="page1">
<canvas id="gameCanvas" width="1000" height="700"></canvas>
<p>You need tablet or desktop screen size to play the game.</p>
</div>
<div class="page2">
<figure></figure>
<section>
<h2>Game Rules</h2>
<p>
Red apples give 20 points and subtract 10 points if you miss.
However, golden apples give 50 points but remove 100 points if you
miss! The is no "Game Over", it's endless, enjoy as much as you
want. 🥳
</p>
<p>
The background are tracks 5 and 7 from my lo-fi album you can listen
to on
<a href="https://sanjin.bandcamp.com/" target="_blank" rel="noopener noreferrer">Bandcamp</a>. 🎶
</p>
<img src="img/pixel-sanjin.webp" alt="Cute pixel figure of a man." width="633" height="1024">
</section>
<section>
<img src="img/sanjin.webp" alt="Cute pixel figure of a man." width="633" height="1024">
<h2>About</h2>
<p>
My name is Sanjin, it means 'the dreamer' in Bosnian. This game and
website is made for the sake of cute pixel fun - and to practice
HTML, CSS, Sass, and JavaScript. The project is on GitHub [link] and
updates will be added from time to time. If you like it, join in and
follow me on the following places. 👇🏻
<br>
<br>
<a href="https://www.youtube.com/sanjindumisic" target="_blank" rel="noopener noreferrer">YouTube</a>
/
<a href="https://github.com/codebatine" target="_blank" rel="noopener noreferrer">GitHub</a>
/
<a href="https://www.linkedin.com/in/sanjindumisic/" target="_blank" rel="noopener noreferrer">LinkedIn</a>
</p>
</section>
</div>
</main>
<footer>
<p>
Copyright ©
<a href="https://sanjindumisic.com" target="_blank" rel="noopener noreferrer">Sanjin Đumišić</a>
2024.
</p>
</footer>
</body>
</html>