Cyper/CyBySide
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Finished all blog posts layout page

Browse Source
This commit is contained in:
Cyper
2025-08-22 22:47:43 -04:00
parent 4195aa8d8f
commit abb4861389
14 changed files with 43 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
public/css/posts.css
View File

@ -9,13 +9,32 @@
grid-column-gap: 2rem;
grid-row-gap: 2rem;
}
.posts > a {
text-decoration: none;
color: rgba(var(--black), .76);
}
.posts > div {
width: 100%;
}
.post-card {
background-color: white;
border-radius: 1rem;
box-shadow: 0 2px 4px rgba(var(--black), .21);
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.post-card:hover {
transform: translate(-4px, -4px); /* Up and left by 4px */
box-shadow: 0 8px 16px rgba(var(--black), 0.3); /* deeper shadow for “lifted” look */
}
.post-card > img {
width: 100%;
object-fit: cover;
object-position: center;
border-top-left-radius: 1rem;
border-top-right-radius: 1rem;
}
.post-card .post-body {
padding: 2rem;
}
@media (min-width: 992px) {