shrunk devlog overview text sizes; changed media queries; removed redundant CSS classes

This commit is contained in:
2025-12-05 18:34:18 +00:00
parent 50f2e259e8
commit dcf75ddc55
2 changed files with 15 additions and 196 deletions

View File

@@ -64,41 +64,10 @@
--color-laura: #C76668CC;
--color-laura-darker: #A55051CC;
}
/* Live update list */
.live-devlog-panel {
margin: 16px;
}
.live-devlog-container {
display: flex;
gap: 4px;
margin: 0 16px;
flex-direction: column;
}
.live-devlog-entry {
background-color: var(--color-background-highlight-hover);
}
.live-devlog-entry-time {
font-family: var(--font-mono);
font-size: 0.8rem;
font-weight: 700;
width: 100%;
background-color: #00000066;
}
.live-devlog-entry-content, .live-devlog-entry-time {
padding: 8px 16px;
margin: 0;
}
.live-devlog-entry-content {
font-size: 1.0rem;
}
/* Post list */
.post-supercontainer {
width: 30%;
width: 32%;
}
.post-container {
@@ -121,8 +90,8 @@
transition: background-color 0.16s ease-in-out;
margin: 4px;
--notch-size-devlog: 42px;
--notch-size-devlog-img: 36px;
--notch-size-devlog: 30px;
--notch-size-devlog-img: 24px;
clip-path: polygon(
0% var(--notch-size-devlog),
var(--notch-size-devlog) 0%,
@@ -138,7 +107,7 @@
background-color: var(--color-background-highlight-hover);
}
.post:hover .post-title, .post:hover .post-date, .post-number {
.post:hover .post-title, .post:hover .post-date {
color: var(--color-text-dark);
}
@@ -166,8 +135,8 @@
}
.post-img {
width: 150px;
height: 120px;
width: 125px;
height: 100px;
margin: 0;
object-fit: cover;
@@ -190,40 +159,31 @@
justify-content: center;
}
.post-date, .post-title, .post-number {
.post-date, .post-title {
font-family: 'Space Mono', monospace;
margin: 4px 0;
transition: color 0.16s ease-in-out;
}
.post-date {
font-size: 1.1rem;
font-size: 0.8rem;
line-height: 0.7rem;
font-weight: 500;
}
.post-title {
font-size: 1.3rem;
font-size: 1.1rem;
line-height: 1.4rem;
font-weight: 700;
}
.post-number {
font-size: 0.77rem;
font-weight: 700;
position: absolute;
right: 2px;
bottom: 1px;
margin: 0;
padding: 0;
line-height: 1rem;
}
@media screen and (max-width: 1700px) {
@media screen and (max-width: 1250px) {
.post-supercontainer {
width: 50% !important;
}
}
@media screen and (max-width: 1200px) {
@media screen and (max-width: 900px) {
.post-supercontainer {
width: 100% !important;
}
@@ -231,8 +191,8 @@
@media screen and (max-width: 800px) {
.post {
--notch-size-devlog: 24px;
--notch-size-devlog-img: 18px;
--notch-size-devlog: 18px;
--notch-size-devlog-img: 12px;
}
.post-img {
width: 100px;