Commit c519cc3a authored by Hydrox6's avatar Hydrox6

Updated Projects page

Now uses flex, and it looks so much better
parent a393a2ad
......@@ -2,30 +2,66 @@
layout: default
---
<h1 class="cent-head">Projects</h1>
<section class="proj-tile solo">
<h1 class="proj-name">OSRS-PetListGen</h1>
<p>An Oldschool Runescape Pet List Generator. Prototyped in Python 3, Made Accessible with JavaScript</p>
<a class="proj-button" href="https://gitlab.com/hydrox6/OSRS-PetListGen">View Source</a>
<a class="proj-button" href="{{ site.url }}/osrs/petlist">Try it out!</a>
<p class="proj-status">Status: Finished</p>
</section>
<section class="proj-tile duo">
<h1 class="proj-name">PTCGDeckBuilder.com</h1>
<p>A Pokemon TCG Deck Building Website! Built with JS, HTML, CSS, with a Python scraping bot.</p>
<a class="proj-button" href="https://github.com/Hydrox6/PTCGDeckBuilder.com">View Source</a>
<a class="proj-button" href="http://PTCGDeckBuilder.com">Try it out!</a>
<p class="proj-status">Status: Alpha</p>
</section>
<section class="proj-tile duo">
<h1 class="proj-name">Hawk</h1>
<p>A Discord Bot that allows Roles to persist when users re-join. Built in Python 3.5</p>
<a class="proj-button" href="https://gitlab.com/Hydrox6/Hawk">View Source</a>
<p class="proj-status">Status: Finished</p>
</section>
<section class="proj-tile duo">
<h1 class="proj-name">Hydrox.IO</h1>
<p>This website! Feel free to suggest changes.</p>
<div class=spacer></div>
<a class="proj-button" href="https://gitlab.com/Hydrox6/hydrox6.gitlab.io">View Source</a>
<p class="proj-status">Status: Ongoing</p>
</section>
\ No newline at end of file
<div class="project-container">
<section class="proj-tile">
<h1 class="proj-name">Ixiabot</h1>
<p class="proj-blurb">A Twitch chat moderation bot, built in Python 3. Uses Asyncio, PostgreSQL, and ØMQ</p>
<div class="proj-bottom-bar">
<p class="proj-status">Status: Re-writing</p>
</div>
</section>
<section class="proj-tile">
<h1 class="proj-name">2D Game Engine</h1>
<p class="proj-blurb">A 2D Game Engine built with Python 3, Cython, and C++ using the SFML framework. Created as the final year project at University</p>
<div class="proj-bottom-bar">
<a class="proj-button" href="https://gitlab.com/Hydrox6/2d-game-engine">View Source</a>
<p class="proj-status">Status: Complete</p>
</div>
</section>
<section class="proj-tile">
<h1 class="proj-name">Oldschool Runescape Pet List Generator</h1>
<p class="proj-blurb">Generates fancy images for collectible items from OldSchool Runescape. Prototyped in Python 3, made accessible with JavaScript</p>
<div class="proj-bottom-bar">
<a class="proj-button" href="https://gitlab.com/hydrox6/OSRS-PetListGen">View Source</a>
<a class="proj-button" href="{{ site.url }}/osrs/petlist">Try it out!</a>
<p class="proj-status">Status: Finished</p>
</div>
</section>
<section class="proj-tile">
<h1 class="proj-name">Best Nibbler</h1>
<p class="proj-blurb">A Twitch.tv notification bot for Discord, built with Python 3, NodeJS, ØMQ, and Asyncio</p>
<div class="proj-bottom-bar">
<p class="proj-status">Status: Re-writing</p>
</div>
</section>
<section class="proj-tile">
<h1 class="proj-name">Hawk</h1>
<p class="proj-blurb">A Discord Bot that allows Roles to persist when users re-join. Built in Python 3.5</p>
<div class="proj-bottom-bar">
<a class="proj-button" href="https://gitlab.com/Hydrox6/Hawk">View Source</a>
<p class="proj-status">Status: Proof of Concept</p>
</div>
</section>
<section class="proj-tile">
<h1 class="proj-name">Primer</h1>
<p class="proj-blurb">A Warframe add-on that evaluates prices of loot from Void Relic missions in real time. Built with Python 3 and OpenCV</p>
<div class="proj-bottom-bar">
<p class="proj-status">Status: Designing</p>
</div>
</section>
<section class="proj-tile">
<h1 class="proj-name">Hydrox.IO</h1>
<p class="proj-blurb">This website! Feel free to suggest changes.</p>
<div class="proj-bottom-bar">
<a class="proj-button" href="https://gitlab.com/Hydrox6/hydrox6.gitlab.io">View Source</a>
<p class="proj-status">Status: Ongoing</p>
</div>
</section>
</div>
\ No newline at end of file
......@@ -7,9 +7,19 @@ main#main
width:100%;
}
div.project-container
{
display: flex;
flex-wrap: wrap;
justify-content: center;
}
section.proj-tile
{
display: flex;
flex-direction: column;
justify-content: space-between;
background-color: #444444;
padding: 20px 20px;
text-align: left;
......@@ -17,8 +27,11 @@ section.proj-tile
word-wrap: break-word;
float:left;
margin:5px;
flex-basis: 22em;
}
/*
section.proj-tile.solo
{
width:calc(100% - 3em);
......@@ -36,13 +49,10 @@ section.proj-tile.duo
{
section.proj-tile.duo
{
/*Holy shit thank you Chris Coyier for
writing about calc(). Saved my damn life
on this bug.*/
width:calc(100% - 3em);
max-width: 100%;
}
}
}*/
h1.proj-name
{
......@@ -56,28 +66,30 @@ a.proj-button
background-color: #333333;
color:#dddddd;
border: none;
padding: 10px 15px;
padding: 10px 14px;
margin-right: 10px;
border-radius: 3px;
float: left;
text-decoration: none;
font-size: 14px;
font-weight: bold;
align-self: flex-end;
}
div.proj-bottom-bar
{
justify-content: flex-start;
align-items: center;
display: flex;
}
p.proj-status
{
font-weight: 600;
padding-top: 10px;
margin:0;
}
h1.cent-head
{
font-size: 3em;
}
div.spacer
{
margin-bottom: 2.57em;
display: block;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment