172 lines
5.5 KiB
HTML
172 lines
5.5 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<title>Evan Pratten</title>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
|
|
<!--[if lte IE 8]><script src="/assets/js/ie/html5shiv.js"></script><![endif]-->
|
|
<link rel="stylesheet" href="/assets/css/main.css" />
|
|
<!-- <link rel="stylesheet" href="/assets/css/custom.css" /> -->
|
|
<!--[if lte IE 9]><link rel="stylesheet" href="/assets/css/ie9.css" /><![endif]-->
|
|
<!--[if lte IE 8]><link rel="stylesheet" href="/assets/css/ie8.css" /><![endif]-->
|
|
|
|
<!-- Syntax highlight -->
|
|
<link rel="stylesheet" href="/assets/css/vs.css" />
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<!-- Wrapper -->
|
|
<div id="wrapper">
|
|
|
|
<!-- Header -->
|
|
<header id="header" >
|
|
<a href="http://0.0.0.0:4000//" class="logo"><strong>Evan Pratten</strong> <span>retrylife</span></a>
|
|
<nav>
|
|
<!-- <a href="#menu">Menu</a> -->
|
|
</nav>
|
|
</header>
|
|
|
|
<!-- Menu -->
|
|
<!-- <nav id="menu">
|
|
<ul class="links">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="http://0.0.0.0:4000//">Home</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li><a href="http://0.0.0.0:4000/all_posts">All posts</a></li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
<ul class="actions vertical">
|
|
<li><a href="#" class="button special fit">Get Started</a></li>
|
|
<li><a href="#" class="button fit">Log In</a></li>
|
|
</ul>
|
|
</nav> -->
|
|
|
|
<section id="banner" class="major" style="height:40vh">
|
|
<div class="inner">
|
|
<header class="major">
|
|
<h1>Taking a look back at GMAD</h1>
|
|
</header>
|
|
<div class="content">
|
|
<p >Fun, Simple, and Quick</p>
|
|
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<!-- Main -->
|
|
<div id="main" class="alt">
|
|
|
|
<!-- One -->
|
|
<section id="one">
|
|
<div class="inner">
|
|
|
|
<p><p>One day, back in June of 2018, I was both looking for a new project to work on, and trying to decide which Linux distro to install on one of my computers. From this, a little project was born. <a href="/gmad">Give Me a Distro</a> (or, GMAD, as I like to call it) is a little website that chooses a random distribution of Linux and shows a description of what you are about to get yourself into, and a download link for the latest ISO.</p>
|
|
|
|
<h2 id="backend-tech">Backend tech</h2>
|
|
<p>This is one of the simplest projects I have ever made. All the backend does is:</p>
|
|
<ul>
|
|
<li>Select a random number (n)</li>
|
|
<li>Fetch the nth item from a list of distros</li>
|
|
<li>Push the selected data to the user via DOM</li>
|
|
</ul>
|
|
|
|
<h2 id="frontend">Frontend</h2>
|
|
<p>This website is just plain HTML and CSS3, built without any CSS framework.</p>
|
|
|
|
<h2 id="my-regrets">My regrets</h2>
|
|
<p>There are two things I do not like about this project. Firstly, on load, the site breifly suggests Arch Linux before flashing to the random selection. This is due to the fact that Arch is the default for people with Javascript disabled. Some kind of loading animation would fix this.</p>
|
|
|
|
<p>Secondly, the version of the site hosted on <a href="https://retrylife.ca/gmad">retrylife.ca</a> is actually just an iframe to <a href="https://ewpratten.github.io/GiveMeADistro">ewpratten.github.io</a> due to some CNAME issues.</p>
|
|
|
|
<h2 id="contributing">Contributing</h2>
|
|
<p>If you would like to add a distro or three to the website, feel free to make a pull request over on <a href="https://github.com/Ewpratten/GiveMeADistro">GitHub</a>.</p>
|
|
|
|
<h2 id="why-make-a-post-about-it-a-year-later">Why make a post about it a year later?</h2>
|
|
<p>I just really enjoyed working with the project and sharing it with friends, so I figured I should mention it here too. Maybe it will inspire someone to make something cool!</p>
|
|
</p>
|
|
</div>
|
|
</section>
|
|
|
|
</div>
|
|
|
|
<!-- Footer -->
|
|
<footer id="footer">
|
|
<div class="inner">
|
|
<ul class="icons">
|
|
|
|
<li><a href="https://twitter.com/ewpratten" class="icon alt fa-twitter" target="_blank"><span class="label">Twitter</span></a></li>
|
|
|
|
<li><a href="https://gitlab.com/u/ewpratten" class="icon alt fa-gitlab" target="_blank"><span class="label">GitLab</span></a></li>
|
|
|
|
<li><a href="https://github.com/ewpratten" class="icon alt fa-github" target="_blank"><span class="label">GitHub</span></a></li>
|
|
|
|
|
|
<li><a href="/feed.xml" class="icon alt fa-rss" target="_blank"><span class="label">RSS</span></a></li>
|
|
</ul>
|
|
<ul class="copyright">
|
|
<li>© Evan Pratten</li>
|
|
<li>Design based from: <a href="https://html5up.net" target="_blank">HTML5 UP</a></li>
|
|
|
|
</ul>
|
|
</div>
|
|
</footer>
|
|
|
|
</div>
|
|
|
|
<!-- Scripts -->
|
|
<script src="http://0.0.0.0:4000/assets/js/jquery.min.js"></script>
|
|
<script src="http://0.0.0.0:4000/assets/js/jquery.scrolly.min.js"></script>
|
|
<script src="http://0.0.0.0:4000/assets/js/jquery.scrollex.min.js"></script>
|
|
<script src="http://0.0.0.0:4000/assets/js/skel.min.js"></script>
|
|
<script src="http://0.0.0.0:4000/assets/js/util.js"></script>
|
|
<!--[if lte IE 8]><script src="http://0.0.0.0:4000/assets/js/ie/respond.min.js"></script><![endif]-->
|
|
<script src="http://0.0.0.0:4000/assets/js/main.js"></script>
|
|
|
|
<!-- Global site tag (gtag.js) - Google Analytics -->
|
|
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-74118570-2"></script>
|
|
<script>
|
|
window.dataLayer = window.dataLayer || [];
|
|
|
|
function gtag() {
|
|
dataLayer.push(arguments);
|
|
}
|
|
gtag('js', new Date());
|
|
|
|
gtag('config', 'UA-74118570-2');
|
|
</script>
|
|
|
|
</body>
|
|
|
|
</html> |