-
Notifications
You must be signed in to change notification settings - Fork 0
/
about.html
275 lines (269 loc) · 19 KB
/
about.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
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="yes" name="apple-mobile-web-app-capable">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<!-- Primary Meta Tags -->
<meta name="title" content="Atul Anand">
<meta name="description"
content="I am a multi-passionate creator. I create content based on coding, notion, my journey, psychology, literature, and entertainment.">
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://www.atulanand.co/">
<meta property="og:title" content="Atul Anand – About">
<meta property="og:description"
content="I am a multi-passionate creator. I create content based on coding, notion, my journey, psychology, literature, and entertainment.">
<meta property="og:image" content="https://atulanand.co/assets\img\card.png">
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="632" />
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://www.atulanand.co/">
<meta property="twitter:title" content="Atul Anand – About">
<meta property="twitter:description" content="I am a multi-passionate creator. I create content based on coding, notion, my journey, psychology, literature, and entertainment.">
<meta property="twitter:image" content="https://atulanand.co/assets\img\card.png">
<!-- Favicon -->
<link rel="apple-touch-icon" sizes="57x57" href="assets\img\favicon @57.png">
<link rel="apple-touch-icon" sizes="60x60" href="assets\img\favicon @60.png">
<link rel="apple-touch-icon" sizes="72x72" href="assets\img\favicon @72.png">
<link rel="apple-touch-icon" sizes="76x76" href="assets\img\favicon @76.png">
<link rel="apple-touch-icon" sizes="114x114" href="assets\img\favicon @114.png">
<link rel="apple-touch-icon" sizes="120x120" href="assets\img\favicon @120.png">
<link rel="apple-touch-icon" sizes="144x144" href="assets\img\favicon @144.png">
<link rel="apple-touch-icon" sizes="152x152" href="assets\img\favicon @152.png">
<link rel="apple-touch-icon" sizes="180x180" href="assets\img\favicon @180.png">
<link rel="icon" type="image/png" sizes="192x192" href="assets\img\favicon @192.png">
<link rel="icon" type="image/png" sizes="32x32" href="assets\img\favicon @32.png">
<link rel="icon" type="image/png" sizes="96x96" href="assets\img\favicon @96.png">
<link rel="icon" type="image/png" sizes="16x16" href="assets\img\favicon @16.png">
<!-- Favicon-End -->
<!-- CSS-Connections -->
<!-- CSS Elements -->
<link rel="stylesheet" type="text/css" href="styles/main.css">
<link rel="stylesheet" type="text/css" href="styles/navbar.css">
<link rel="stylesheet" type="text/css" href="styles/about/about.css">
<link rel="stylesheet" href="styles/loading/loading.css">
<!-- CSS Media Fix -->
<link rel="stylesheet" href="styles/media/navbar_media.css">
<link rel="stylesheet" href="styles/media/about_media.css">
<link rel="stylesheet" href="styles/media/main_media.css">
<!-- CSS-Connections-END -->
<!-- Scripts -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<title>Atul Anand - About</title>
</head>
<body>
<div class="loading">
<p class="loader-quote" id="quote"></p>
<img src="assets/img/loader.gif" alt="" class="loader-img">
</div>
<div class="rgb_strip"></div>
<div class="container">
<header>
<div class="nav-bar">
<div class="logo big">
<a class = "logo" href="index">Atul Anand</a>
</div>
<div class="logo small">
<a class = "logo" href="index">Atul.</a>
</div>
<button class="hamburger" id="hamburger">
<img src="assets/img/hamburger.png" style="width: 20px; height: 20px; margin-right: 10px;" alt="ham">
</button>
<ul class="nav-list" id="nav-list">
<li class="nav-list-item active"><a href="about" class="nav-list-a">About</a></li>
<li class="nav-list-item"><a href="blog" class="nav-list-a">Blog</a></li>
<li class="nav-list-item"><a href="music" class="nav-list-a">Music</a></li>
<li class="nav-list-item"><a href="collab" class="nav-list-a">Collab</a></li>
<li class="nav-list-item"><a href="products" class="nav-list-a">Products</a></li>
</ul>
</div>
</header>
<section>
<div class="heading"><u>About</u></div>
<div class="description" style="padding: 25px 0;">I am <u>Atul Anand,</u> recognized as <a target="_blank" href="https://linktr.ee/AtulACleaver" class="references">@AtulACleaver</a>. I am a 14 year old student and live in <a href="https://goo.gl/maps/9GwmXTbQLRRVbE329" class="references">Raipur, India</a>.</div>
<div class="description" style="padding: 25px 0;">I am a <u>multi-passionate creator</u>. I create content-based on <u>coding, notion, my journey, psychology, literature, and entertainment</u>.</div>
<hr class="end">
</section>
<section>
<div class="heading-2">Working On</div>
<div class="working">
<ol class="working-list">
<li class="working-list-item">As a 10th grade student, studying for school is top of my <u>priority</u>.</li>
<li class="working-list-item">I am also actively try to make an <u>audience</u> and <u>good connections</u> with other people that share the similar interests over <a href="https://twitter.com/AtulACleaver" target="_blank" class="references">twitter</a>.</li>
<li class="working-list-item">I am working on my <a target="_blank" href="https://www.atulanand.co" class="references">website</a> and sharing my journey over <a target="_blank" href="https://twitter.com/AtulACleaver" class="references">Twitter</a>.</li>
<li class="working-list-item">I am creating a <u>library template</u> on notion for you all and will share on <a target="_blank" href="https://twitter.com/AtulACleaver" class="references">Twitter</a> and <a target="_blank" href="https://www.youtube.com/channel/UCxzdMx9yyaz1EDkQdPuVFUA" class="references">YouTube</a>.</li>
<li class="working-list-item">I am also on improving my <u>English fluency</u>.</li>
<li class="working-list-item">I am working on improving my <a target="_blank" href="https://amigoscode.com/courses/enrolled/804809" class="references">javascript</a>.</li>
</ol>
</div>
</section>
<section>
<section>
<div class="heading-2"><u>Skills</u></div>
<div class="programming-skills">
<h3 class="skill-heading mono">Programming/Years</h3>
<div class="skill-col">
<div class="col">
<h1 class="skill-title mono">Languages</h1>
<ul class="skills">
<li class="skills-item mono">HTML5/4y</li>
<li class="skills-item mono">CSS3/4y</li>
<li class="skills-item mono">Javascript/~1m</li>
<li class="skills-item mono">Java/2y</li>
<li class="skills-item mono">Python/4m</li>
</ul>
</div>
<div class="col">
<h1 class="skill-title mono">Frameworks/Libs</h1>
<ul class="skills">
<li class="skills-item mono">Bootstrap/2y</li>
<li class="skills-item mono">REACT/~1m</li>
<li class="skills-item mono">SCSS/~1m</li>
<li class="skills-item mono">Open CV/~3m</li>
</ul>
</div>
<div class="col">
<h1 class="skill-title mono">Supporting</h1>
<ul class="skills">
<li class="skills-item mono">Git/2y</li>
<li class="skills-item mono">GitHub/2y</li>
<li class="skills-item mono">Adobe Photoshop/2y</li>
<li class="skills-item mono">Figma/1y</li>
<li class="skills-item mono">Flourish/1y</li>
</ul>
</div>
</div>
<!-- ----------------------------------------------------------------------->
<div class="other-skills">
<h3 class="skill-heading mono">Strengths & Weaknesses</h3>
<div class="skill-col">
<div class="col">
<h1 class="skill-title mono">Strengths</h1>
<ul class="skills">
<li class="skills-item mono">Kyokushin Karate/9y</li>
<li class="skills-item mono">Programming</li>
<li class="skills-item mono">Typing</li>
<li class="skills-item mono">Leadership</li>
<li class="skills-item mono">Creator</li>
<li class="skills-item mono">Organized</li>
<li class="skills-item mono">Extroverted</li>
</ul>
</div>
<div class="col">
<h1 class="skill-title mono">Weaknesses</h1>
<ul class="skills">
<li class="skills-item mono">Fear for Every Animal<br>(within 10m range)</li>
<li class="skills-item mono">Single-Tasker</li>
<li class="skills-item mono">Epicure</li>
<li class="skills-item mono">Forgetful</li>
<li class="skills-item mono">Strengths</li>
</ul>
</div>
</div>
</div>
<p class="skills-description">You can know more about my soft skill from this <a href="https://twitter.com/AtulACleaver/status/1392808801787514887?s=20" class="references">tweet</a>.</p>
</section>
<div class="heading-2"><u>Work</u></div>
<div class="description">You can find all my projects here.</div>
<div class="social-icons">
<div class="social-icon-item">
<a href="https://github.com/AtulACleaver" target="_blank">
<img src="assets\img\github.png" alt="github" class="icon">
</a>
</div>
<div class="social-icon-item">
<a href="https://dribbble.com/AtulACleaver" target="_blank">
<img src="assets\img\dribble.png" alt="dribble" class="icon">
</a>
</div>
<div class="social-icon-item">
<a href="https://twitter.com/AtulACleaver" target="_blank">
<img src="assets\img\twitter.png" alt="twitter" class="icon">
</a>
</div>
<div class="social-icon-item">
<a href="https://www.youtube.com/channel/UCxzdMx9yyaz1EDkQdPuVFUA" target="_blank">
<img src="assets\img\youtube.png" alt="youtube" class="icon">
</a>
</div>
</div>
<p class="caption">Many of them don't have a lot of graphics, so instead of showcasing it here, you can check all of them on there specific sites.</p>
</section>
<section>
<div class="heading-2"><u>Testimonials</u></div>
<div class="testimonial-card" id="testimonial">
<div class="testimonial-card-item">
<div class="name">Sita Sharma</div>
<div class="profession">Social Science Teacher</div>
<div class="response">Atul is very hard working, well prepared, know how to work on strategy, And above all honest. Little justified way to work on things will lead you to grab better opportunity n better future ahead. Trust in others will help you to reach your goals faster and will create an aura of a positive environment around you.</div>
</div>
<div class="testimonial-card-item">
<div class="name">Vikas Bangre</div>
<div class="profession">English Teacher</div>
<div class="response">My acquaintance with you since your admission to the school paved the way to unfold your versatile persona. You are so amazing. Apart from your academic excellence, you actively participate in school-based activities. I firmly believe that you will serve humanity with your skills. You will make each one of us proud.<br><br>May God bestow all upon You!</div>
</div>
</div>
</section>
</div>
<section>
<div class="scroll-up">
<button onclick="topFunction()" id="scroll-up-btn">▲</button>
</div>
</section>
<footer class = "footer">
<div class= "footer-content">
<div class="copyright">
© <u style="color: var(--white);">Atul Anand</u> 2021. All Rights Reserved.
</div>
<div class="footer-social-icons">
<div class="footer-socials">
<a href="https://twitter.com/AtulACleaver" target="_blank">
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 48 48" width="1.5rem" height="1.5rem">
<g id="surface63820240">
<path class="footer-icons" style="stroke:none;fill-rule:nonzero;fill: var(--white);fill-opacity:1;" d="M 48 8.601562 C 46.203125 9.398438 44.398438 10 42.398438 10.203125 C 44.398438 9 46 7 46.796875 4.796875 C 44.796875 6 42.796875 6.796875 40.601562 7.203125 C 38.601562 5.203125 36 4 33.203125 4 C 27.796875 4 23.398438 8.398438 23.398438 13.796875 C 23.398438 14.601562 23.398438 15.398438 23.601562 16 C 15.398438 15.601562 8.203125 11.796875 3.398438 5.796875 C 2.398438 7.203125 2 9 2 10.796875 C 2 14.203125 3.796875 17.203125 6.398438 19 C 4.796875 18.796875 3.203125 18.398438 2 17.796875 C 2 17.796875 2 17.796875 2 18 C 2 22.796875 5.398438 26.796875 9.796875 27.601562 C 9 27.796875 8.203125 28 7.203125 28 C 6.601562 28 6 28 5.398438 27.796875 C 6.601562 31.796875 10.203125 34.601562 14.601562 34.601562 C 11.203125 37.203125 7 38.796875 2.398438 38.796875 C 1.601562 38.796875 0.796875 38.796875 0 38.601562 C 4.398438 41.398438 9.601562 43 15 43 C 33.203125 43 43 28 43 15 C 43 14.601562 43 14.203125 43 13.796875 C 45 12.398438 46.601562 10.601562 48 8.601562 "/>
</g>
</svg>
</a>
</div>
<div class="footer-socials">
<a href="https://medium.com/@atulacleaver" target="_blank">
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 60 60" width="1.5rem" height="1.5rem">
<g id="surface63913876">
<path class="footer-icons" style="stroke:none; fill-rule:nonzero;fill: var(--white);fill-opacity:1;" d="M 53.398438 1.398438 L 6.601562 1.398438 C 3.726562 1.398438 1.398438 3.726562 1.398438 6.601562 L 1.398438 53.398438 C 1.398438 56.273438 3.726562 58.601562 6.601562 58.601562 L 53.398438 58.601562 C 56.273438 58.601562 58.601562 56.273438 58.601562 53.398438 L 58.601562 6.601562 C 58.601562 3.726562 56.273438 1.398438 53.398438 1.398438 Z M 49.609375 45.601562 L 34.1875 45.601562 L 34.1875 44.734375 L 37.800781 41.558594 L 37.800781 23.421875 L 28.929688 45.601562 L 27.546875 45.601562 L 17.648438 23.246094 L 17.648438 39.074219 L 22.175781 44.734375 L 22.175781 45.601562 L 10.390625 45.601562 L 10.390625 44.734375 L 15.066406 39.074219 L 15.066406 20.246094 L 10.910156 15.046875 C 10.910156 15.046875 10.910156 14.296875 10.910156 14.414062 L 22.289062 14.414062 L 31.125 33.53125 L 38.75 14.414062 L 49.550781 14.414062 L 49.550781 15.046875 L 45.601562 18.367188 L 45.601562 41.558594 L 49.609375 44.734375 Z M 49.609375 45.601562 "/>
</g>
</svg>
</a>
</div>
<div class="footer-socials">
<a href="https://github.com/AtulACleaver" target="_blank">
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 48 48" width="1.5rem" height="1.5rem">
<g id="surface65047719">
<path class="footer-icons" style=" stroke:none;fill-rule:nonzero;fill:var(--white);fill-opacity:1;" d="M 21.382812 0.4375 C 10.433594 1.628906 1.628906 10.433594 0.4375 21.144531 C -0.988281 33.042969 6.386719 43.277344 16.859375 46.609375 L 16.859375 41.136719 C 16.859375 41.136719 15.90625 41.375 14.71875 41.375 C 11.386719 41.375 9.957031 38.519531 9.71875 36.851562 C 9.480469 35.898438 9.007812 35.1875 8.292969 34.472656 C 7.578125 34.234375 7.339844 34.234375 7.339844 33.996094 C 7.339844 33.519531 8.054688 33.519531 8.292969 33.519531 C 9.71875 33.519531 10.910156 35.1875 11.386719 35.898438 C 12.574219 37.804688 14.003906 38.28125 14.71875 38.28125 C 15.671875 38.28125 16.382812 38.042969 16.859375 37.804688 C 17.097656 36.136719 17.8125 34.472656 19.238281 33.519531 C 13.765625 32.328125 9.71875 29.234375 9.71875 24 C 9.71875 21.382812 10.910156 18.765625 12.574219 16.859375 C 12.339844 16.382812 12.101562 15.195312 12.101562 13.527344 C 12.101562 12.574219 12.101562 11.148438 12.8125 9.71875 C 12.8125 9.71875 16.144531 9.71875 19.476562 12.8125 C 20.667969 12.339844 22.335938 12.101562 24 12.101562 C 25.664062 12.101562 27.332031 12.339844 28.761719 12.8125 C 31.855469 9.71875 35.425781 9.71875 35.425781 9.71875 C 35.898438 11.148438 35.898438 12.574219 35.898438 13.527344 C 35.898438 15.433594 35.660156 16.382812 35.425781 16.859375 C 37.089844 18.765625 38.28125 21.144531 38.28125 24 C 38.28125 29.234375 34.234375 32.328125 28.761719 33.519531 C 30.1875 34.710938 31.140625 36.851562 31.140625 38.992188 L 31.140625 46.847656 C 40.898438 43.753906 47.800781 34.710938 47.800781 24.238281 C 47.800781 9.957031 35.660156 -1.226562 21.382812 0.4375 Z M 21.382812 0.4375 "/>
</g>
</svg>
</a>
</div>
<div class="footer-socials footer-last">
<a href="https://gumroad.com/atulacleaver" target="_blank">
<img class="footer-icons footer-gumroad" src="assets/img/social-icons/gumroad.svg" alt="gumroad">
</a>
</div>
</div>
</div>
</footer>
<script type="text/javascript" src="script/navbar.js"></script>
<script type="text/javascript" src="script/main.js"></script>
<script type="text/javascript" src="script/scroll-up.js"></script>
<!-- Start Tribed Pixel Snippet -->
<script>
!function(e,t,n,i,a,r,c,p,s){e[a]||((c=e[a]=function(){c.process?c.process.apply(c,arguments):c.queue.push(arguments)}).queue=[],c.t=1*new Date,(p=t.createElement(n)).async=1,p.src="https://tribed.co/pixel/pixel.min.js?t="+864e5*Math.ceil(new Date/864e5),(s=t.getElementsByTagName(n)[0]).parentNode.insertBefore(p,s))}(window,document,"script",0,"tribed"),tribed("init","TR-3187225312"),tribed("event","pageload");
</script>
<!-- End Tribed Pixel Snippet -->
</body>
</html>