blob: 4db697d4cd511fb997d7344690f4ee6af2bbe291 (
plain)
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
148
149
150
151
152
153
154
155
156
157
158
|
<!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">
<link rel="icon" type="image/x-icon" href="/assets/images/favicon.ico">
<link rel="me" href="https://mastodon.gamedev.place/@altaf">
<title>altaf-creator</title>
<link rel="stylesheet" href="/packages/fontawesome-free-7.2.0-web/css/all.css">
<!-- Cloudflare Turnstile -->
<link rel="preconnect" href="https://challenges.cloudflare.com" />
<script
src="https://challenges.cloudflare.com/turnstile/v0/api.js"
async
defer
></script>
</head>
<body onload="index();">
<script defer src="/scripts/constants.js"></script>
<script defer src="/scripts/onload.js"></script>
<script defer src="/scripts/scroll.js"></script>
<script defer src="/scripts/blog.js"></script>
<script defer src="/scripts/captcha.js"></script>
<div class="floating-nav-container">
<div class="floating-nav">
<a href="/" class="mobile"><img src="/assets/images/hero/logo.png" alt="" class="sidebar-img mobile" style="margin-top: 0; margin-left: -20px;"></a>
<a href="/about/" class="link">About Me</a>
<a href="/projects/" class="link">Projects</a>
<a href="/blog/" class="link">Library</a>
</div>
</div>
<div class="sidebar" id="sidebar">
<a href="/">
<img src="/assets/images/hero/logo.png" alt="" class="sidebar-img">
</a>
<span>altaf-creator</span>
</div>
<div class="sidebar-progress-container" id="progressContainer">
</div>
<section style="background-color: #8ACFE5; border-top: none;">
<div class="home-img"
style="z-index: 1; background-image: url(/assets/images/hero/simpliCity_web_0_ocean.png); ">
</div>
<span class="home-title" style="z-index: 0;">Altaf</span>
<div class="home-img" style="z-index: 1; background-image: url(/assets/images/hero/simpliCity_web_0_island.png); ">
</div>
<a href="https://store.steampowered.com/app/2381230/simpliCity/" id="simpliCity-link" class="link monospaced">simpliCity ↗</a>
</section>
<section>
<div class="center-grid">
<div class="div-sizing">
<span class="big-text">Hey there!</span>
<br>
<p>A <b class="colored-text">student</b> studying in <b class="colored-text">Singapore</b> from <b class="colored-text">Indonesia</b> that likes to <b class="colored-text">create</b> things.</p>
<p>I like building things with <b class="colored-text">computers</b>.
I develop games, create websites (or apps), tinker with electronics, make videos, and probably other things, too.</p>
<a href="about/" class="button button-inline">Learn more about me -></a>
</div>
<img id="countrysg" src="/assets/images/elements/sgpixel.png" alt="">
<img id="countryid" src="/assets/images/elements/indopixel.png" alt="">
</div>
</section>
<section>
<div class="center-grid">
<div class="div-sizing" style="height: 100%;">
<div class="flex-container flex-container-column">
<span class="heading">Highlighted Works</span>
<div class="flex-container flex-container-dynamic flex gap" style="min-height: 600px;">
<div class="flex full-img-card highlight-card"
style="background-image: url(/assets/images/game-hero/simplicity_screenshot.png); ">
<a href="/projects/simpliCity/" class="fill-div gradient-overlay">
</a>
<div class="img-card-titlebox">
<span class="img-card-subtitle"><i class="fa-solid fa-gamepad"></i> Game</span>
<span class="img-card-title">simpliCity</span>
</div>
</div>
<div class="flex full-img-card highlight-card"
style="background-image: url(/assets/images/game-hero/laundryweb.png);">
<a href="/projects/laundryweb/" class="fill-div gradient-overlay">
</a>
<div class="img-card-titlebox">
<span class="img-card-subtitle"><i class="fa-solid fa-globe"></i> Web App</span>
<span class="img-card-title">LaundryWeb</span>
</div>
</div>
<div class="flex full-img-card highlight-card"
style="background-image: url(/assets/images/video-hero/stringsoffreedom.png);">
<a href="/video/stringsoffreedom/" class="fill-div gradient-overlay">
</a>
<div class="img-card-titlebox">
<span class="img-card-subtitle"><i class="fa-solid fa-video"></i> Film</span>
<span class="img-card-title">Strings of Freedom</span>
</div>
</div>
</div>
<a href="projects/" class="button button-inline gap-top">View All Projects</a>
</div>
</div>
</div>
</section>
<section>
<div class="center-grid">
<div class="div-sizing">
<span class="heading">Library</span>
<p>my (dev)Blog and other things I'd like to share</p>
<h1>Blog Posts</h1>
<div class="flex-container flex-x-center" id="blog-container">
</div>
<div class="flex-container flex-x-center">
<a href="blog/" class="button" style="margin-left: auto; margin-right: auto;">View More</a>
</div>
<h1>Shared Resources</h1>
<p>Some writings and other stuff. Mostly school notes.</p>
<ul>
<li><a href="https://files.altafcreator.com/school/notes/upp_sec/physics/6091.nextcloudmd" class="link"><img src="/assets/images/elements/altaf-files.svg" class="symbol"> / <i class="fa-solid fa-note-sticky"></i> Altaf's O-Level 6091 Pure Physics Notes</a></li>
<li><a href="https://files.altafcreator.com/school/notes/upp_sec/chemistry/6092.nextcloudmd" class="link"><img src="/assets/images/elements/altaf-files.svg" class="symbol"> / <i class="fa-solid fa-note-sticky"></i> Altaf's O-Level 6092 Pure Chemistry Notes</a></li>
<li><a class="link" href="blog/">View more...</a></li>
</ul>
</div>
</div>
</section>
<section>
<div class="center-grid">
<div class="div-sizing">
<span class="heading">Meta</span>
<h1>altafcreator.com Directory</h1>
<ul>
<li><a class="link" href="https://git.altafcreator.com/"><i class="fa-brands fa-git-alt"></i> altaf-git<span class="desktop">: source code repositories for all my projects</span></a></li>
<li><a href="https://files.altafcreator.com/" class="link"><img src="/assets/images/elements/altaf-files.svg" class="symbol"> altaf-files: my publicly shared files and resource source</a></li>
</ul>
<h1>Contact Me!</h1>
<div class="cf-turnstile" data-sitekey="0x4AAAAAAC1yqhk5tXbXfvXw" data-callback="emailTurnstileSuccess"></div>
<ul id="email-list">
</ul>
<h1>Socials</h1>
<div class="container-social">
<a href="https://www.youtube.com/channel/UCm7n_G87ihIK-MmBb4i19dA" class="button button-social" target="_blank"><i class="fa-brands fa-youtube"></i></a>
<a href="https://www.instagram.com/altafcreator" class="button button-social" target="_blank"><i class="fa-brands fa-instagram"></i></a>
<a href="https://twitter.com/altafcreator" class="button button-social" target="_blank"><i class="fa-brands fa-twitter"></i></a>
<a href="https://mastodon.gamedev.place/@altaf" class="button button-social" target="_blank"><i class="fa-brands fa-mastodon"></i></a>
<a href="https://github.com/altaf-creator" class="button button-social" target="_blank"><i class="fa-brands fa-github"></i></a>
<a href="https:///altaf-creator.itch.io" class="button button-social" target="_blank"><i class="fa-brands fa-itch-io"></i></a>
<a href="https://discord.gg/Mg5WFqrHk3" class="button" target="_blank" style="margin: 0;"><i class="fa-brands fa-discord"></i> Join our Discord Server!</a>
</div>
</div>
</div>
</section>
</body>
</html>
|
