summaryrefslogtreecommitdiff
path: root/about/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'about/index.html')
-rw-r--r--about/index.html375
1 files changed, 375 insertions, 0 deletions
diff --git a/about/index.html b/about/index.html
new file mode 100644
index 0000000..4c06b09
--- /dev/null
+++ b/about/index.html
@@ -0,0 +1,375 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta http-equiv="X-UA-Compatible" content="ie=edge">
+ <title>s1nical - About</title>
+ <link rel="icon" type="image/jpg" href="/favicon.jpg" sizes="128x128">
+ <!-- Site metadata -->
+ <meta name="description" content="About">
+ <meta property="og:description" content="About">
+ <meta property="og:title" content="s1nical - About">
+ <meta property="twitter:card" content="summary">
+ <meta property="twitter:site" content="@9inny">
+ <meta property="og:image" content="">
+ <meta property="og:url" content="https://cyne.cf/about">
+ <link rel="apple-touch-icon" sizes="128x128" href="/favicon.jpg">
+ <link rel="icon" type="image/jpg" href="/favicon.jpg" sizes="128x128">
+ <link rel="canonical" href="https://cyne.cf/about">
+ <link rel="author" href="humans.txt" />
+ <!-- Schema.org Stuff -->
+ <script type="application/ld+json">
+ {
+ "name": "s1nical",
+ "alternateName": "s1n",
+ "description": "About",
+ "headline": "About",
+ "url": "https://cyne.cf/about",
+ "image": "",
+ "sameAs": [
+ "https://twitter.com/9inny",
+ "https://github.com/8cy",
+ "https://www.reddit.com/user/s1nical/"
+ ],
+ "publisher": {
+ "@type": "Organization",
+ "logo": {
+ "@type": "ImageObject",
+ "url": ""
+ }
+ },
+ "@type": "WebSite",
+ "@context": "http://schema.org"
+ }
+ </script>
+ <!-- External Libraries -->
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/trianglify/0.3.1/trianglify.min.js"></script>
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
+ <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
+ <!-- CSS Links -->
+ <link rel="stylesheet" href="/about/css/main.css">
+ <link rel="stylesheet" href="/about/css/navigation-bar.css">
+ <link rel="stylesheet" href="/about/css/loader-animation.css">
+ <link rel="stylesheet" href="/about/css/blog-slider.css">
+ <style>
+
+ html {
+ overflow-x: hidden;
+ }
+ </style>
+ <!-- Invisable Scripts -->
+ <script src="/js/loader-animation.js"></script>
+ <script src="/js/redirect-to-mobile.js"></script>
+</head>
+<body>
+ <!-- Visable Scripts -->
+ <script>
+ // Background only renders based on the original browser window size when
+ // starting to load the site. Due to rendering issues, I don't think I
+ // can do it other wise.
+
+ ///////////////
+ // SCRIPT #1 //
+ ///////////////
+
+ // If light mode detected, in reality, if nothing is detected lmao
+ // Dark mode feature was removed lol
+ // Set up base pattern
+ var pattern = Trianglify({
+ height: window.innerHeight * 1.63, // White: #fdfbfb, Salmon: #cc3300
+ width: window.innerWidth,
+ // Christmas Colours:
+ x_colors: ['#040404', '#f9f9f9', '#fffff4', '#fbf7f5', '#d55454'], // Cappuccino: ['#854442', '#3c2f2f', '#fff4e6', '#be9b7b', '#4b3832']
+ y_colors: ['#f9f1f1', '#f9f9f9', '#fffff4', '#fbf7f5', '#f9f1f1'], // Random colour generator: "#"+((1<<24)*Math.random()|0).toString(16)
+ //
+ // Normal Colours:
+ // x_colors: ['#040404', '#f9f9f9', '#fffff4', '#fbf7f5', '#d55454'],
+ // y_colors: ['#f9f1f1', '#f9f9f9', '#fffff4', '#fbf7f5', '#f9f1f1'],
+ //
+ // Christmas Colours:
+ // x_colors: ['#0F8A5F', '#f9f9f9', '#fffff4', '#fbf7f5', '#CC231E'],
+ // y_colors: ['#f9f1f1', '#f9f9f9', '#fffff4', '#fbf7f5', '#f9f1f1'],
+ //
+ variance: 10, // Gives it more style
+ seed: Number.parseInt(Math.floor(Math.random() * 100)), // TODO: Live seed transitioning.
+ cell_size: 160 // Cell size
+ });
+
+ // REMOVED bc looked ugly
+ // If dark mode detected
+ // if (matchMedia('(prefers-color-scheme: dark)').matches) {
+ // var pattern = Trianglify({
+ // height: window.innerHeight, // White: #fdfbfb, Salmon: #cc3300
+ // width: window.innerWidth,
+ // x_colors: ['#040404', '#111111', '#111111', '#111111', '#d55454'], // Cappuccino: ['#854442', '#3c2f2f', '#fff4e6', '#be9b7b', '#4b3832']
+ // y_colors: ['#f9f1f1', '#111111', '#111111', '#111111', '#f9f1f1'], // Random colour generator: "#"+((1<<24)*Math.random()|0).toString(16)
+ // variance: 10, // Gives it more style
+ // seed: Number.parseInt(Math.floor(Math.random() * 100)), // TODO: Live seed transitioning.
+ // cell_size: 160 // Cell size
+ // });
+ // }
+
+ // // Canvas
+ // document.body.appendChild(pattern.canvas())
+
+ // SVG
+ document.body.appendChild(pattern.svg())
+
+
+
+ // // PNG
+ // var png = document.createElement('img')
+ // png.src = pattern.png()
+ // document.body.appendChild(png)
+
+ ///////////////
+ // SCRIPT #2 //
+ ///////////////
+
+ $('.title-wrapper').css('width', window.innerWidth);
+ $('.title-wrapper').css('height', window.innerHeight);
+
+
+ var time = 10,
+ $paths = $('body').find('svg').find('path'),
+ pathCollection = $paths.get(),
+ count = $paths.length;
+
+ // // Log variable "count"
+ // console.log(count);
+
+ pathCollection.sort(function () {
+ return Math.random() * 10 > 5 ? 1 : -1;
+ });
+
+ function showText() {
+ var title = $('h1'),
+ subtitle = $('h2');
+
+ title.removeClass('hidden');
+ setTimeout(function () {
+ subtitle.removeClass('hidden');
+ }, 500);
+ }
+
+ setTimeout(function () {
+ $.each(pathCollection, function (i, el) {
+ var $path = $(this);
+ setTimeout(function () {
+
+ $path.css('opacity', '1');
+ }, time)
+ time += 10;
+
+ if (i + 1 === count) {
+ setTimeout(function () {
+ showText();
+ }, 2000);
+ }
+
+ });
+ }, 2000);
+ </script>
+
+ <!-- Navigation Bar -->
+ <div class="navigation-bar">
+ <nav class="nav">
+ <a href="/home/" class="nav-item" active-color="orange">Home</a> <!-- Had `is-active` after it but removed it due to not highlighting. -->
+ <a href="#" class="nav-item" active-color="green">About</a>
+ <a href="https://cyne.cf/status" class="nav-item" active-color="red">Status</a>
+ <span class="nav-indicator"></span>
+ </nav>
+ </div>
+
+ <div class="bio">
+ <div class="links">
+ <div class="blog-slider" style="height: 1380px">
+ <p class="title"><a>Technical Skills.</a></p> <!-- This was not a very effective way of accomplishing this but idk rn. -->
+
+ <p class="desc" style="width: 1000px; height: 0px">
+ <ul style="font-size: 15px">
+ <li>JavaScript</li>
+ <li>HTML5/ CSS3</li>
+ <li>PHP7</li>
+ <li>MySQL</li>
+ <li>PostgreSQL</li>
+ <li>MongoDB</li>
+ <li>SCSS</li>
+ <li>EmberJS</li>
+ <li>ReactJS</li>
+ <li>Redux</li>
+ <li>AngularJS</li>
+ <li>GraphQL</li>
+ <li>Apollo</li>
+ <li>Git</li>
+ <li>SVN</li>
+ <li>BackboneJS</li>
+ <li>jQuery</li>
+ <li>jQuery Mobile</li>
+ <li>D3JS</li>
+ <li>Echarts</li>
+ <li>Webpack</li>
+ <li>Python</li>
+ <li>NodeJS</li>
+ <li>ExpressJS</li>
+ <li>Redis</li>
+ <li>XSLT</li>
+ <li>JSON</li>
+ <li>C++13/17</li>
+ <li>Lua</li>
+ </ul>
+
+ <style>
+ .experience {
+ position: relative;
+ top: -683px;
+ left: 20%
+ }
+ </style>
+ <div class="experience">
+ <p class="title"><a>Experience.</a></p>
+
+ <p class="title2" style="font-size: 17px; width: 94px">UI Engineer.</p>
+ <p style="font-size: 15px; color: #fcac94;"> Jul 2017 - Present</p>
+ <p style="font-size: 15px">Data Visualization</p>
+ <ul>
+ <li style="font-size: 15px">
+ Collaborating with product designers, product managers, and marketing analytics, developed for financial<br> managers new contextual and configurable chart widgets in HTML/CSS, SCSS, Ember.js, React/Redux<br> and Echarts
+ </li>
+ <li style="font-size: 15px">
+ Maintained old chart widgets Ember Chart, an open source project developed in Ember and D3 by Addepar.<br> Ozymandias, a front-end framework agnostic data visualization toolkit.<br>
+ </li>
+ <li style="font-size: 15px">
+ Led Architecting front-end framework agnostic data visualization toolkit. Responsible for planning, scoping and<br> assigning tasks.
+ </li>
+ </ul>
+
+ <p style="font-size: 15px">Counter Strike: Global Offensive SDK</p>
+ <ul>
+ <li style="font-size: 15px">
+ CS:GO trainer/ cheat softwares development.
+ </li>
+ </ul>
+ <br>
+
+ <!-- END UI ENG -->
+
+ <p class="title2" style="font-size: 17px; width: 224px">Front End Software Engineer.</p>
+ <p style="font-size: 15px; color: #fcac94;"> Sep 2016 - Jul 2017</p>
+ <p style="font-size: 15px">Responsive-ness</p>
+ <ul>
+ <li style="font-size: 15px">
+ Developed a fully responsive website with accessible interfaces using Atypon Literatum platform, Java Spring<br> framework, XSLT, LESS, Jquery, HandlebarsJS and related tools.
+ </li>
+ <li style="font-size: 15px">
+ Served as a key front end team member collaborating with cross-functional teams to turn product requirements<br>
+and mockups into high-quality frontend code.
+ </li>
+ </ul>
+
+ <p style="font-size: 15px">Atypon Literatum for mobile</p>
+ <ul>
+ <li style="font-size: 15px">
+ Collaborated with back-end developers and product managers to develop and maintain Literatum for mobile<br>
+platform using BackboneJS, HTML5/CSS3, Jquery Mobile and related tools.
+ </li>
+ <li style="font-size: 15px">
+ Served as a key member of front end team responsible for developing new functionalities with best mobile<br>
+ development strategies.
+ </li>
+ <li style="font-size: 15px">
+ Fixed bugs on existing sites/features.
+ </li>
+ <li style="font-size: 15px">
+ Developed accessible interfaces for mobile devices.
+ </li>
+ </ul>
+ <br>
+
+ <p class="title2" style="font-size: 17px; width: 81px">Front End.</p>
+ <p style="font-size: 15px; color: #fcac94;"> Jun 2016 - Jul 2017</p>
+ <p style="font-size: 15px">CSS framework, UI libraries using React, SCSS</p>
+ <ul>
+ <li style="font-size: 15px">
+ Architected and developed responsive, modular, and scalable CSS framework and React UI library.
+ </li>
+ <li style="font-size: 15px">
+ Strategized and collaborated with design.
+ </li>
+ <li style="font-size: 15px">
+ Tested and deployed client/ server and related components.
+ </li>
+ <li style="font-size: 15px">
+ Developed accessible interfaces for mobile devices
+ </li>
+ </ul>
+
+ <p style="font-size: 15px">Team management</p>
+ <ul>
+ <li style="font-size: 15px">
+ Trained and mentored junior front end developers in UI development methodologies and best practices.
+ </li>
+ <li style="font-size: 15px">
+ Served as a core group member in defining and prioritizing technology investments, ensuring the alignment of<br>
+process, technology and business objectives.
+ </li>
+ </ul>
+ <br>
+ </div>
+ </p>
+
+ <!--
+ <p class="desc">
+ I'm a fullstack developer. Some of my favourite languages to work with are PHP, JavaScript and C++.<br>
+ Some of my favourite applications I have for such languages are small little PHP tools, C++ game development<br>
+ projects using OpenGL and Discord bots using the <a href="https://discord.js.org/#/">discord.js</a> framework. You can check out most of my creations<br>
+ on my <a href="https://github.com/8cy">GitHub</a>. On there, I have lots of my smaller C++ projects to take examples from, some Discord bot</a><br>
+ examples, and even some public archive repositories of some special software's such as my archive of various <a href="https://github.com/8cy/net">Botnets</a>.<br>
+ Keep a lookout, because I'm planning on posting even more tutorial like things soon.<br>
+ <!-- Unused Line -->
+ <!--
+ </p>
+ <br>
+ <p class="title2">Well what kind of applications do you develop?</p>
+
+ <p class="desc">
+ Some things I like to test my knowledge with are usually moding instances. Albeit, my Java programming skills aren't as<br>
+ sharp as I'd hope for them to be, I like to spend some of my free time developing Minecraft mods using the Forge framework.<br>
+ I also like to write server plugins for popular Minecraft server platforms like <a href="https://dev.bukkit.org/">Bukkit</a>, they aren't the most useful<br>
+ things, (Minecraft mods and plugins) however they are fun to write and it helps me further my Java knowledge.<br>
+ <br>
+ I also like to occasionally write CS:GO cheats, I've fiddled around with writing my own CS:GO skin changers, full<br>
+ cheat modules that include such things as aimbots, anti-aim and more.<br>
+ <br>
+ <div class="disclaimer">
+ <span class="important">*</span> <span>Use at your own risk, I am not to be held accountable if you get VAC banned.</span>
+ </div>
+ </p>
+ -->
+ </div>
+ </div>
+ </div>
+
+ <!-- Loading Animation -->
+ <div class="loader-wrapper">
+ <div class="loader">
+ <row>
+ <span></span>
+ <span></span>
+ <span></span>
+ </row>
+ <row>
+ <span></span>
+ <span></span>
+ <span></span>
+ </row>
+ <row>
+ <span></span>
+ <span></span>
+ <span></span>
+ </row>
+ </div>
+ </div>
+</body>
+</html> \ No newline at end of file
generated by cgit v1.2.3 (git 2.25.1) at 2026-03-11 17:07:34 +0000