-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
147 lines (135 loc) · 7.48 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
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Santum's Website!</title>
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap" rel="stylesheet">
<script src="https://kit.fontawesome.com/aaa68764aa.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="styles/index.css" />
<script>
// Change text when hovering over the images
window.onload = function()
{
var imgs = document.getElementsByTagName('img'),
span = document.getElementById("alterableText");
for (var i = 0; i < imgs.length; i++) {
imgs[i].addEventListener('mouseenter', function() {
span.innerHTML = this.alt || '';
});
imgs[i].addEventListener('mouseleave', function() {
span.innerHTML = "Here's some things I worked on!" || '';
});
}
}
</script>
<!-- Primary Meta Tags -->
<title>Santum's Website!</title>
<meta name="title" content="Santum's Website!">
<meta name="description" content="Santum is a game developer, pixel artist and translator from Argentina. He doesn't usually speak in the third-person, but it felt right for this description.">
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://www.santumerino.com/">
<meta property="og:title" content="Santum's Website!">
<meta property="og:description" content="Santum is a game developer, pixel artist and translator from Argentina. He doesn't usually speak in the third-person, but it felt right for this description.">
<meta property="og:image" content="https://www.santumerino.com/images/cardSantum.png">
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://www.santumerino.com/">
<meta property="twitter:title" content="Santum's Website!">
<meta property="twitter:description" content="Santum is a game developer, pixel artist and translator from Argentina. He doesn't usually speak in the third-person, but it felt right for this description.">
<meta property="twitter:image" content="https://www.santumerino.com/images/cardSantum.png">
</head>
<body>
<header>
<!-- Skip to content -->
<a href="#maincontent" class="skipnav">Skip to content</a>
<!-- Navbar -->
<nav class="navbar">
<ul class="navbar-nav">
<li class="nav-item">
<a href="#" class="nav-link">
<span class="link-text"><i class="fa-solid fa-house-chimney"></i> Home</span>
</a>
</li>
<li class="nav-item">
<a href="projects" class="nav-link">
<span class="link-text"><i class="fa-solid fa-palette"></i> Projects</span>
</a>
</li>
<li class="nav-item">
<a href="about" class="nav-link">
<span class="link-text"><i class="fa-solid fa-address-card"></i> About Me</span>
</a>
</li>
<li class="nav-item">
<a href="http://blog.santumerino.com/" class="nav-link">
<span class="link-text"><i class="fa-solid fa-comment-dots"></i> Blog</span>
</a>
</li>
</ul>
<div class="downarrow"><i class="fa-solid fa-angle-down"></i></div>
</nav>
</header>
<section id="maincontent">
<p><a href="secrets/logos"><img border="0" src="./logoAnim.gif" alt="Animated text: Santum" class="logo"></a></p>
<h1> Yo! Welcome to my website!</h1>
<p>
I'm <font class="linear-wipe"><b>Santum</b></font>, and I make videogames <a class="brighter" href="projects#games">such as these ones!</a> I've also <a class="brighter" href="projects#translation">helped translate some games</a> into Spanish!<br><br>
To navigate this website, use the navbar at the top! <span title="(looking at the GitHub is cheating btw)">There may also be some hidden pages, if you know where to look...</span><br><br>
Thank you for visiting! If you'd like to send me an e-mail, you can do so at <font color=#fb0369>santumdev (at) gmail (dot) com</font>. No promises I'll reply to it <font size="2">(I'm bad at emails)</font>, but I try to at least read everything!
</p>
<hr></hr>
<div class="socmed">
<p><font>You can also find me on </font></p>
<a href="https://bsky.app/profile/santumerino.com" target="_blank" rel="noopener noreferrer"><i class="fa-brands fa-bluesky" title="Bluesky"></i>,</a>
<a rel="me" href="https://mastodon.gamedev.place/@santumerino" target="_blank" rel="noopener noreferrer"><i class="fa-brands fa-mastodon" title="Mastodon"></i>,</a> and </a>
<a href="https://santumerino.itch.io/" target="_blank" rel="noopener noreferrer"><i class="fa-brands fa-itch-io" title="Itch.io"></i>.</a>
</div>
</section>
<div class="spacer top"></div>
<section class="orange">
<h1><span id="alterableText">Here's some things I worked on!</span></h1>
<div class="imgHolder" style="display: grid; grid-gap: 0.75rem; align-content: center">
<div class="imag">
<a href="yarg" target="_blank" rel="noopener noreferrer"><img src="images\projectList\yarg.gif" alt="YARG [2019-2022] | Programming, design, art, writing, etc."></a>
</div>
<div class="imag">
<a href="https://store.steampowered.com/app/1255980/Portal_Reloaded/" target="_blank" rel="noopener noreferrer"><img src="images\projectList\portalreloaded.png" alt="Portal Reloaded [2021] | Spanish translation"></a>
</div>
<div class="imag">
<a href="https://santumerino.itch.io/tawa" target="_blank" rel="noopener noreferrer"><img src="images\projectList\tawa.png" alt="tawa [2023] | Programming, design, art"></a>
</div>
<div class="imag">
<a href="https://santumerino.itch.io/31-days-31-games" target="_blank" rel="noopener noreferrer"><img src="images\projectList\31days.png" alt="31 Days, 31 Games [Dec. 2021] | Programming, design, art, etc. (x31)"></a>
</div>
</div>
<p class="coolbutton"><a class="coolbutton" href="projects">Click here to see more!</a></p>
</section>
<div class="spacer bottom"></div>
<section>
<a href="http://blog.santumerino.com/"><h1><i class="fa-solid fa-comment-dots fa-lg"></i> I also have a blog!</h1></a>
</section>
</body>
<footer>
<a href="secrets/shhh"><div class="fella"></div></a>
<p>© <script>document.write(new Date().getFullYear())</script> Santum |
<a href="https://bsky.app/profile/santumerino.com" target="_blank" rel="noopener noreferrer"><i class="fa-brands fa-bluesky" title="Bluesky"></i></a>
<a rel="me" href="https://mastodon.gamedev.place/@santumerino" target="_blank" rel="noopener noreferrer"><i class="fa-brands fa-mastodon" title="Mastodon"></i></a>
<a href="https://santumerino.itch.io/" target="_blank" rel="noopener noreferrer"><i class="fa-brands fa-itch-io" title="Itch.io"></i></a>
<a href="https://github.com/santumerino/santumerino.github.io" target="_blank" rel="noopener noreferrer"><i class="fa-brands fa-github" title="GitHub"></i></a>
<br><font size="1"><a href="more" style="text-decoration: underline dotted;">This website</a> is best viewed on a web browser.</font></p>
<div><font size="2">
<a href="https://www.rainbowcemetery.com/devring/">Gamedev Webring</a><br>
<a href="https://www.rainbowcemetery.com/devring/prev.php?id=0" class="brighter"><i class="fa-solid fa-square-caret-left"></i> Previous</a> ·
<a href="https://www.rainbowcemetery.com/devring/rand.php?id=0">Random</a> ·
<a href="https://www.rainbowcemetery.com/devring/list.php?id=0">List</a> ·
<a href="https://www.rainbowcemetery.com/devring/next.php?id=0" class="brighter">Next <i class="fa-solid fa-square-caret-right"></i></a>
</div>
<br>
</footer>
</html>