fabs/website
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Use list for grid

Browse source
This commit is contained in:
Fabien Freling 2019-06-13 13:56:15 +02:00
parent 1a28e9287f
commit ca953a991e
2 changed files with 16 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
css/style.css
View file

@ -55,18 +55,24 @@ blockquote {
padding: 10px 10px 10px 10px; padding: 10px 10px 10px 10px;
} }
.projects { ul.projects {
display: grid; display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
grid-auto-rows: minmax(100px, auto); grid-auto-rows: minmax(100px, auto);
gap: 10px; gap: 10px;
grid-gap: var(gap); /* fallback */ grid-gap: var(gap); /* fallback */
list-style: none;
padding-left: 0;
font-size: 14pt;
} }
.project { ul.projects a {
display: block;
border: 1pt solid #ddd; border: 1pt solid #ddd;
font-size: 14pt; height: 100%;
text-align: center; text-align: center;
text-transform: uppercase;
} }
#footer { #footer {

14
projects.md
View file

@ -2,10 +2,10 @@
title: Projects title: Projects
--- ---
<div class="projects"> <ul class="projects">
<div class="project"><a href="projects/oboy/index.html">OBoy</a></div> <li><a href="projects/oboy/index.html">OBoy</a></li>
<div class="project"><a href="projects/trailr/index.html">Trailr</a></div> <li><a href="projects/trailr/index.html">Trailr</a></li>
<div class="project"><a href="projects/whereiscar/index.html">Where is my car?</a></div> <li><a href="projects/whereiscar/index.html">Where is my car?</a></li>
<div class="project"><a href="projects/maestro/index.html">Maestro</a></div> <li><a href="projects/maestro/index.html">Maestro</a></li>
<div class="project"><a href="projects/dawnchaos/index.html">Dawn of Chaos</a></div> <li><a href="projects/dawnchaos/index.html">Dawn of Chaos</a></li>
</div> </ul>