Files
vladfaust.github.io/public/styles/projects.css

78 lines
1.2 KiB
CSS

/* TODO: Improve scoping. */
small.annotation {
text-align: center;
margin-top: -1rem;
margin-bottom: 1rem;
}
/* TODO: Improve scoping. */
h1,
h2,
h3,
h4,
h5,
h6 {
margin: 1rem 0;
text-align: center;
}
ul.projects {
--gap: 1rem;
display: flex;
flex-wrap: wrap;
max-width: 768px;
padding: 0;
gap: var(--gap);
}
ul.projects>li.project-card {
--border-width: 1px;
--border-radius: 4px;
--padding: 1.5rem;
display: block;
width: calc(50% - (var(--padding) * 2) - var(--gap) / 2 - var(--border-width) * 2);
padding: var(--padding);
border-radius: var(--border-radius);
border: var(--border-width) solid rgba(0, 0, 0, 0.1)
}
ul.projects>li.project-card>.title {
display: block;
margin-bottom: -0.25rem;
font-weight: bold;
}
ul.projects>li.project-card>p {
margin: 0.5rem 0;
}
ul.projects>li.project-card>p:last-child {
margin-bottom: 0;
}
ul.projects>li.project-card .stack {
display: flex;
flex-wrap: wrap;
gap: 0.25rem;
}
ul.projects>li.project-card .stack>span {
display: block;
padding: 0.25rem 0.5rem;
background-color: rgba(0, 0, 0, 0.1);
border-radius: 4px;
font-size: small;
}
@media(max-width: 768px) {
ul.projects {
padding: 0
}
ul.projects>li.project-card {
width: 100%;
}
}