Browse Source

simplify article scss

Alexander Avery 3 months ago
parent
commit
2262e12184
  1. 59
      assets/sass/cards.scss

59
assets/sass/cards.scss

@ -13,65 +13,30 @@
} }
} }
.small-circle {
border-radius: 50%;
width: 250px;
height: 250px;
}
article { article {
display: flex;
background-color: $dark; background-color: $dark;
border-radius: 10px; border-radius: 10px;
}
article.card {
height: 420px; height: 420px;
flex: 1 1 305px; flex: 1 1 305px;
flex-direction: column;
overflow: hidden; overflow: hidden;
div.article-info-container, div.article-image { img {
overflow: hidden; height: 50%;
flex: 1; width: 100%;
object-fit: cover;
} }
div.article-info { div {
box-sizing: border-box; margin: auto 16px;
padding: 25px;
height: 200px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
a.article-title {
flex: 2;
display: flex;
justify-content: space-between; justify-content: space-between;
flex-direction: column;
text-decoration: none;
color: $font-color;
}
}
}
.circle {
border-radius: 50%;
} }
.article-link {
text-decoration: none;
color: $font-color;
}
article.card-alternate {
justify-content: space-evenly;
align-items: center;
flex-wrap: wrap;
gap: 40px;
div {
padding: 16px;
}
img {
width: 250px;
height: 250px;
border-radius: 50%;
}
p {
max-width: 500px;
}
} }

Loading…
Cancel
Save