Skip to content

Commit

Permalink
Refactor project cards to become equal height. Refs codezoned#48
Browse files Browse the repository at this point in the history
  • Loading branch information
Ryuno-Ki committed Oct 6, 2020
1 parent 053350e commit 17cf2b0
Showing 1 changed file with 69 additions and 55 deletions.
124 changes: 69 additions & 55 deletions index.html
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<html class="">
<html lang="en" class="">
<head>
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-125870124-1"></script>
<script>
Expand Down Expand Up @@ -233,6 +233,21 @@
-moz-transition:transform 1.05s ease-in-out;
-ms-transition:transform 1.05s ease-in-out;
}

#sec-about .card-container {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
grid-auto-rows: 1fr;
grid-gap: 2rem;
}

#sec-about .card-container .col {
display: contents;
}

#sec-about .card .card-content {
flex: 1;
}
</style>

<title>Codezoned</title>
Expand Down Expand Up @@ -437,65 +452,64 @@ <h3 class="lead">These are some of the events we are honoured to have organised/
</section> -->

<section id="sec-about" class="sec-about pt-5 pb-5">

<div class="row justify-content-center text-center" style="">
<div class="col-md-4 col-lg-8 animated bounceInLeft" id="animate2">
<h3 class="display-5" style="font-family: quicksand; word-spacing: ; color: #272727;">Some of our Opensource projects:</h3>
<br>
<div class="row">
<div class="col s12 m12">
<div class="card darken-1" style="background-color: white; min-height: 240px;">
<div class="card-content white-text">
<span class="card-title" style="color: black;"><strong>ScriptsDump</strong> </span>
<p style="color: #777777">ScriptsDump is a complete repository of all kind of scripts we and you can think of.</p>
</div>
<div class="card-action">
<a href="https://github.com/codezoned/ScriptsDump"><div class='button -regular center' style="background-color: #2196F3; color: white;" id="hoverbtn">Check it out!</div></a>

</div>
</div>
</div>

<div class="col s12 m12">
<div class="card darken-1" style="background-color: white; min-height: 240px;">
<div class="card-content white-text">
<span class="card-title" style="color: black;"><strong>RIG</strong></span>
<p style="color: #777777">RIG (Randomized ID Generator) is an app to generate IDs and badges for any event or meetup!</p>
</div>
<div class="card-action">
<a href="https://github.com/codezoned/rig"><div class='button -regular center hoverbtn' style="background-color: #2196F3; color: white;">Check it out!</div></a>

</div>
</div>
</div>

<div class="col s12 m12">
<div class="card darken-1" style="background-color: white; min-height: 240px;">
<div class="card-content white-text">
<span class="card-title" style="color: black;"><strong>BlogCast</strong> </span>
<p style="color: #777777">BlogCast is a 100% Opensource blogging App/Platform.</p>
</div><br>
<div class="card-action">
<a href="https://github.com/codezoned/BlogCast"><div class='button -regular center hoverbtn' style="background-color: #2196F3; color: white;">Check it out!</div></a>

</div>
</div>
</div>
</div>

</div>
<div class="row justify-content-center text-center" style="">
<div class="col-md-4 col-lg-8 animated bounceInLeft" id="animate2">
<h3 class="display-5" style="font-family: quicksand; word-spacing: ; color: #272727;">Some of our Opensource projects:</h3>
<br>
<div class="row card-container">
<div class="col s12 m12">
<div class="card darken-1" style="background-color: white; min-height: 240px;">
<div class="card-content white-text">
<span class="card-title" style="color: black;"><strong>ScriptsDump</strong> </span>
<p style="color: #777777">ScriptsDump is a complete repository of all kind of scripts we and you can think of.</p>
</div>
<div style="width: 100%; text-align: center;">
<a href="https://github.com/codezoned/"><h5 style="color: darkgray;" href=>And many more...</a></h5>

</div><br><br>
<div class="card-action">
<a href="https://github.com/codezoned/ScriptsDump">
<div class='button -regular center' style="background-color: #2196F3; color: white;" id="hoverbtn">Check it out!</div>
</a>
</div>
</div>
</div>

<div style="width: 100%; text-align: center;">
<span style="font-size: 22px;">Wanna Partner with us? Sponsor us? Or talk to us?</span><br>
<span style="font-size: 22px;"><b><a href = "mailto: [email protected]">Contact us at [email protected]</a><b></span>
<div class="col s12 m12">
<div class="card darken-1" style="background-color: white; min-height: 240px;">
<div class="card-content white-text">
<span class="card-title" style="color: black;"><strong>RIG</strong></span>
<p style="color: #777777">RIG (Randomized ID Generator) is an app to generate IDs and badges for any event or meetup!</p>
</div>
<div class="card-action">
<a href="https://github.com/codezoned/rig">
<div class='button -regular center hoverbtn' style="background-color: #2196F3; color: white;">Check it out!</div>
</a>
</div>
</div>
</div>

<div class="col s12 m12">
<div class="card darken-1" style="background-color: white; min-height: 240px;">
<div class="card-content white-text">
<span class="card-title" style="color: black;"><strong>BlogCast</strong> </span>
<p style="color: #777777">BlogCast is a 100% Opensource blogging App/Platform.</p>
</div><br>
<div class="card-action">
<a href="https://github.com/codezoned/BlogCast">
<div class='button -regular center hoverbtn' style="background-color: #2196F3; color: white;">Check it out!</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>

<div style="width: 100%; text-align: center;">
<a href="https://github.com/codezoned/"><h5 style="color: darkgray;">And many more...</h5></a>
</div><br><br>

<div style="width: 100%; text-align: center;">
<span style="font-size: 22px;">Wanna Partner with us? Sponsor us? Or talk to us?</span><br>
<span style="font-size: 22px;"><b><a href = "mailto: [email protected]">Contact us at [email protected]</a></b></span>
</div>
</section>
<br><br>

Expand Down

0 comments on commit 17cf2b0

Please sign in to comment.