gimm260-data-visualization/index.html

105 lines
3.5 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Kaj Forney -- PA 9 - More CSS</title>
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/grid.css">
<link rel="stylesheet" href="css/animation.css">
<script src="https://kit.fontawesome.com/55072ce5fd.js" crossorigin="anonymous"></script>
</head>
<body class="parallax">
<div class="row">
<div class="col-3"></div>
<div class="col-6">
<h1 class="titlePulse">
<i class="fa-solid fa-gamepad"></i>
Gaming on Linux
<i class="fa-brands fa-steam"></i>
</h1>
</div>
<div class="col-4"></div>
</div>
<div class="row">
<div class="col-1"></div>
<div class="col-5 roundCorners card">
<h2>Introduction</h2>
<p>I have been a user of Linux for the past 14 years. In that time, I've observed a notable improvement in the ease of running games on the system, particularly games that were originally made for other operating systems, such as Microsoft Windows.</p>
<p>This can be attributed to the hard work and dedication of the Linux community, particularly the WINE project. More recent improvements are the work of Valve Corporation, who introduced Proton in 2019.</p>
</div>
<div class="col-1"></div>
<div class="col-3 bigIcon">
<i class="fa-brands fa-linux wobble"></i>
</div>
<div class="col-2"></div>
</div>
<div class="spacer"></div>
<div class="row">
<div class="col-2"></div>
<div class="col-3 bigIcon">
<i class="fa-solid fa-wine-glass wobble"></i>
</div>
<div class="col-1"></div>
<div class="col-5 roundCorners card">
<h2>WINE</h2>
<p>[Introduce the WINE project here, which is the basis for running any Windows application on Linux.]</p>
</div>
</div>
<div class="row">
<div class="col-1"></div>
<div class="col-5 roundCorners card">
<h2>Proton</h2>
<p>[Introduce Proton from Valve here.]</p>
</div>
<div class="col-1"></div>
<div class="col-4">
<div class="youtube-container">
<iframe class="youtube-iframe" src="https://www.youtube-nocookie.com/embed/_OAqvtlgfGA" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</div>
<div class="col-1"></div>
</div>
<div class="spacer"></div>
<div class="row">
<div class="col-1"></div>
<div class="col-4">
<h2>[DATA VIZ HERE]</h2>
</div>
<div class="col-1"></div>
<div class="col-5 roundCorners card">
<p>This data visualization will illustrate the speed at which a newly game can now become Linux-compatible, using Age of Empires II as an example.</p>
</div>
<div class="col-1"></div>
</div>
<div class="spacer"></div>
<h2>[More visualizations will go here...]</h2>
<div id="footer-spacer"></div>
<div id="footer">
<div class="row">
<div class="col-6"></div>
<div class="col-6">
<img src="img/logos/lunarpenguin.png" alt="Lunar Penguin Logo" id="footer-logo">
<span id="footer-text">Page created by <a href="https://lunarpenguin.net">Kaj Forney</a>, 2022.</span>
</div>
</div>
</div>
</body>
</html>