Skip to content

Commit

Permalink
Responsiveness fixes + margin/padding fixes.
Browse files Browse the repository at this point in the history
  • Loading branch information
IMB11 authored and modmuss50 committed Oct 1, 2023
1 parent 07111e0 commit d652317
Show file tree
Hide file tree
Showing 2 changed files with 27 additions and 8 deletions.
29 changes: 24 additions & 5 deletions _sass/fabric.scss
Original file line number Diff line number Diff line change
Expand Up @@ -171,24 +171,43 @@ body {
.column {
display: flex;
flex-direction: column;
justify-content: space-between;
flex: 1;
padding-left: 12px;
padding-right: 12px;

.component-body {
padding-bottom: 12px;
margin-bottom: auto;
}

page-link {
margin-top: auto;
}
}

.showcase-image-large {
display: flex;
align-items: center;
justify-content: center;

img {
border-radius: 5px;
}
}

.row-heading {
padding-top: 12px;
padding-left: 12px;
}

@media screen and (max-width: 1024px) {
.hide-large {
@media screen and (max-width: 765px) {
.showcase-image-large {
display: none !important;
}

.component-body {
min-height: 170px;
.row {
flex-direction: column !important;
gap: 24px;
}
}
}
6 changes: 3 additions & 3 deletions index.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,16 +6,16 @@ layout: page
<div class='row'>
<div class='column'>
<h1>What is Fabric?</h1>
<p>Fabric provides a cohesive platform to develop and play with Minecraft mods. Fabric's lightweight and modular design allows for greater flexibility enabling releases for stable and snapshot versions of Minecraft. The Fabric toolchain is <a href="https://github.com/FabricMC">open source</a> for everyone to use, even if you only want some of it!</p>
<p>Fabric provides a cohesive platform to develop and play with Minecraft mods. Fabric's lightweight and modular design allows for greater flexibility enabling releases for stable and snapshot versions of Minecraft.<br><br>The Fabric toolchain is <a href="https://github.com/FabricMC">open source</a> for everyone to use, even if you only want some of it!</p>
<br>
<a class="page-link page-link-download" href="/use">Download</a>
</div>
<div class='column hide-large'>
<div class='column showcase-image-large'>
<img src="/assets/cliffs.png" alt="">
</div>
</div>
<hr>
<h1 class="row-heading">Core Components:</h1>
<h1 class="row-heading">Core Toolchain Projects</h1>
<div class='row'>
<div class='column'>
<h4>Fabric API</h4>
Expand Down

0 comments on commit d652317

Please sign in to comment.