forked from Minecraft/website
Improve important links layout (#11)
Improve mportant links layout Co-authored-by: Kevin Belisle <kev.belisle@gmail.com> Reviewed-on: https://git.etztech.xyz/BirbMC/birbmc.com/pulls/11 Reviewed-by: Etzelia <etzelia@hotmail.com>main
parent
5d562a2319
commit
edcd382cf6
|
@ -65,15 +65,7 @@ p {
|
||||||
margin: 0 0 _size(element-margin) 0;
|
margin: 0 0 _size(element-margin) 0;
|
||||||
|
|
||||||
&.content {
|
&.content {
|
||||||
-moz-columns: 20em 2;
|
text-align: left;
|
||||||
-webkit-columns: 20em 2;
|
|
||||||
-ms-columns: 20em 2;
|
|
||||||
columns: 20em 2;
|
|
||||||
-moz-column-gap: _size(element-margin);
|
|
||||||
-webkit-column-gap: _size(element-margin);
|
|
||||||
-ms-column-gap: _size(element-margin);
|
|
||||||
column-gap: _size(element-margin);
|
|
||||||
text-align: justify;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -41,14 +41,6 @@ ul {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@include breakpoint(">small") {
|
|
||||||
ul.content,
|
|
||||||
ol.content {
|
|
||||||
columns: 2;
|
|
||||||
column-gap: 2em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
ul p,
|
ul p,
|
||||||
li p {
|
li p {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
|
|
|
@ -11,6 +11,13 @@ article {
|
||||||
&.special {
|
&.special {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.two-column {
|
||||||
|
@include breakpoint(">small") {
|
||||||
|
columns: 2;
|
||||||
|
column-gap: 2em;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
header {
|
header {
|
||||||
|
|
186
src/index.html
186
src/index.html
|
@ -159,97 +159,107 @@
|
||||||
</li>
|
</li>
|
||||||
</ul> -->
|
</ul> -->
|
||||||
|
|
||||||
<h3>Important documents</h3>
|
<section class="two-column">
|
||||||
<ul class="content">
|
<div style="break-inside: avoid">
|
||||||
<li>
|
<h3>Important documents</h3>
|
||||||
<p class="content">
|
<ul class="content">
|
||||||
Make sure to read our
|
<li>
|
||||||
<a href="http://birbmc.com/rules">rules</a> before you join!
|
<p class="content">
|
||||||
</p>
|
Make sure to read our
|
||||||
</li>
|
<a href="http://birbmc.com/rules">rules</a> before you join!
|
||||||
<li>
|
</p>
|
||||||
<p class="content">
|
</li>
|
||||||
Learn about
|
<li>
|
||||||
<a href="https://birbmc.com/land_claims">land claims</a>
|
<p class="content">
|
||||||
</p>
|
Learn about
|
||||||
</li>
|
<a href="https://birbmc.com/land_claims">land claims</a>
|
||||||
<li>
|
</p>
|
||||||
<p class="content">
|
</li>
|
||||||
Help reduce <a href="https://birbmc.com/lag">lag</a> and keep
|
<li>
|
||||||
the server running smoothly
|
<p class="content">
|
||||||
</p>
|
Help reduce <a href="https://birbmc.com/lag">lag</a> and keep
|
||||||
</li>
|
the server running smoothly
|
||||||
<li>
|
</p>
|
||||||
<p class="content">
|
</li>
|
||||||
Set up your
|
<li>
|
||||||
<a href="https://birbmc.com/nether">nether</a> portal, and
|
<p class="content">
|
||||||
connect to the tunnel system
|
Set up your
|
||||||
</p>
|
<a href="https://birbmc.com/nether">nether</a> portal, and
|
||||||
</li>
|
connect to the tunnel system
|
||||||
</ul>
|
</p>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h3>Server IPs</h3>
|
<div style="break-inside: avoid">
|
||||||
<ul class="content">
|
<h3>Server IPs</h3>
|
||||||
<li>
|
<ul class="content">
|
||||||
<p class="content">
|
<li>
|
||||||
Survival server: <strong>play.birbmc.com</strong>
|
<p class="content">
|
||||||
</p>
|
Survival server: <strong>play.birbmc.com</strong>
|
||||||
</li>
|
</p>
|
||||||
<li>
|
</li>
|
||||||
<p class="content">
|
<li>
|
||||||
Creative server: <strong>creative.birbmc.com</strong>
|
<p class="content">
|
||||||
</p>
|
Creative server: <strong>creative.birbmc.com</strong>
|
||||||
</li>
|
</p>
|
||||||
</ul>
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h3>Fun stuff</h3>
|
<div style="break-inside: avoid">
|
||||||
<ul class="content">
|
<h3>Fun stuff</h3>
|
||||||
<li>
|
<ul class="content">
|
||||||
<p class="content">
|
<li>
|
||||||
Take a look around our
|
<p class="content">
|
||||||
<a href="http://map.birbmc.com/">dynmap</a>
|
Take a look around our
|
||||||
</p>
|
<a href="http://map.birbmc.com/">dynmap</a>
|
||||||
</li>
|
</p>
|
||||||
<li>
|
</li>
|
||||||
<p class="content">
|
<li>
|
||||||
<a href="https://stats.birbmc.com/">Stats.</a> So many stats.
|
<p class="content">
|
||||||
</p>
|
<a href="https://stats.birbmc.com/">Stats.</a> So many stats.
|
||||||
</li>
|
</p>
|
||||||
<li>
|
</li>
|
||||||
<p class="content">
|
<li>
|
||||||
Learn about <a href="https://birbmc.com/discord">Geoffrey</a>,
|
<p class="content">
|
||||||
our shop & location bot.
|
Learn about <a href="https://birbmc.com/discord">Geoffrey</a>,
|
||||||
</p>
|
our shop & location bot.
|
||||||
</li>
|
</p>
|
||||||
</ul>
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h3>Social links</h3>
|
<div style="break-inside: avoid">
|
||||||
<ul class="content">
|
<h3>Social links</h3>
|
||||||
<li>
|
<ul class="content">
|
||||||
<p class="content">
|
<li>
|
||||||
Join us on <a href="https://birbmc.com/discord">Discord</a>!
|
<p class="content">
|
||||||
</p>
|
Join us on <a href="https://birbmc.com/discord">Discord</a>!
|
||||||
</li>
|
</p>
|
||||||
<li>
|
</li>
|
||||||
<p class="content">
|
<li>
|
||||||
Follow us on <a href="https://twitter.com/birb_mc">Twitter</a>!
|
<p class="content">
|
||||||
</p>
|
Follow us on <a href="https://twitter.com/birb_mc">Twitter</a>!
|
||||||
</li>
|
</p>
|
||||||
<li>
|
</li>
|
||||||
<p class="content">
|
<li>
|
||||||
Give us some updoots on
|
<p class="content">
|
||||||
<a href="https://www.reddit.com/r/BirbMC/">Reddit</a>
|
Give us some updoots on
|
||||||
</p>
|
<a href="https://www.reddit.com/r/BirbMC/">Reddit</a>
|
||||||
</li>
|
</p>
|
||||||
<li>
|
</li>
|
||||||
<p class="content">
|
<li>
|
||||||
Join our
|
<p class="content">
|
||||||
<a href="https://steamcommunity.com/groups/BirbMC"
|
Join our
|
||||||
>Steam Group</a
|
<a href="https://steamcommunity.com/groups/BirbMC"
|
||||||
>
|
>Steam Group</a
|
||||||
</p>
|
>
|
||||||
</li>
|
</p>
|
||||||
</ul>
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<h3>Donations</h3>
|
<h3>Donations</h3>
|
||||||
<p>
|
<p>
|
||||||
|
|
Loading…
Reference in New Issue