Simplify post nav styles

This commit is contained in:
daudix
2024-09-18 20:08:25 +03:00
parent a432829499
commit 1ae5bdd329
2 changed files with 10 additions and 15 deletions

View File

@ -11,6 +11,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- Increased hover scale of aside images.
- Scale up the blurred article banner in article list on hover.
- Simplify prev/next post nav styles.
- Use decimals instead of percents (again).
## [5.0.0](https://codeberg.org/daudix/duckquill/compare/v4.8.0...v5.0.0)

View File

@ -1,16 +1,19 @@
#post-nav {
display: flex;
flex-direction: row;
gap: 0.25rem;
max-width: 100vw;
@media only screen and (max-width: 720px) {
flex-direction: column;
}
.post-nav-item {
flex: 1 1 0;
flex: 1;
transition: var(--transition);
border-radius: var(--rounded-corner);
padding: 1rem;
padding-block-end: 0.75rem;
width: 0;
max-width: calc(50% - 0.125rem);
min-width: 0;
text-decoration: none;
&:hover {
@ -35,7 +38,6 @@
}
&.post-nav-next {
margin-inline-start: auto;
text-align: end;
.nav-arrow::after {
@ -48,7 +50,7 @@
}
.nav-arrow {
margin-block-end: 0.5rem;
margin-block-end: 0.75rem;
color: var(--fg-muted-5);
font-weight: normal;
line-height: 1;
@ -57,19 +59,11 @@
.post-title {
display: block;
transition: var(--transition);
max-width: 90vw;
overflow: hidden;
color: var(--fg-color);
text-overflow: ellipsis;
white-space: nowrap;
}
}
@media only screen and (max-width: 720px) {
flex-direction: column;
.post-nav-item {
width: 100%;
max-width: 100%;
}
}
}