Merge pull request 'Make blog cover clickable' (#976) from clickable-blog-image into main
Reviewed-on: https://git.joinplu.me/Plume/Plume/pulls/976
This commit is contained in:
commit
3daf405ae2
@ -219,17 +219,21 @@ p.error {
|
|||||||
margin: 20px;
|
margin: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.cover-link {
|
||||||
|
margin: 0;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
opacity: 0.9;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.cover {
|
.cover {
|
||||||
min-height: 10em;
|
min-height: 10em;
|
||||||
background-position: center;
|
background-position: center;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
margin: 0px;
|
margin: 0px;
|
||||||
|
|
||||||
&:hover {
|
|
||||||
opacity: 0.9;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
header {
|
header {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
@ -245,6 +249,9 @@ p.error {
|
|||||||
position: relative;
|
position: relative;
|
||||||
a {
|
a {
|
||||||
display: block;
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
padding-block-start: 0.5em;
|
||||||
transition: color 0.1s ease-in;
|
transition: color 0.1s ease-in;
|
||||||
color: $text-color;
|
color: $text-color;
|
||||||
|
|
||||||
@ -611,4 +618,4 @@ code {
|
|||||||
.function{
|
.function{
|
||||||
color:inherit;
|
color:inherit;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -6,7 +6,9 @@
|
|||||||
|
|
||||||
<div class="card h-entry">
|
<div class="card h-entry">
|
||||||
@if article.cover_id.is_some() {
|
@if article.cover_id.is_some() {
|
||||||
<a href="@uri!(posts::details: blog = article.get_blog_fqn(ctx.0), slug = &article.slug, responding_to = _)"><div class="cover" style="background-image: url('@Html(article.cover_url(ctx.0).unwrap_or_default())')"></div></a>
|
<a class="cover-link" href="@uri!(posts::details: blog = article.get_blog_fqn(ctx.0), slug = &article.slug, responding_to = _)">
|
||||||
|
<div class="cover" style="background-image: url('@Html(article.cover_url(ctx.0).unwrap_or_default())')"></div>
|
||||||
|
</a>
|
||||||
}
|
}
|
||||||
<header dir="auto">
|
<header dir="auto">
|
||||||
<h3 class="p-name">
|
<h3 class="p-name">
|
||||||
|
@ -18,7 +18,10 @@
|
|||||||
@for blog in blogs {
|
@for blog in blogs {
|
||||||
<div class="card">
|
<div class="card">
|
||||||
@if blog.banner_id.is_some() {
|
@if blog.banner_id.is_some() {
|
||||||
<div class="cover" style="background-image: url('@Html(blog.banner_url(ctx.0).unwrap_or_default())')"></div>
|
<a class="cover-link" href="@uri!(blogs::details: name = &blog.actor_id, page = _)">
|
||||||
|
<div class="cover" style="background-image: url('@Html(blog.banner_url(ctx.0).unwrap_or_default())')">
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
}
|
}
|
||||||
<h3><a href="@uri!(blogs::details: name = blog.actor_id, page = _)">@blog.title</a></h3>
|
<h3><a href="@uri!(blogs::details: name = blog.actor_id, page = _)">@blog.title</a></h3>
|
||||||
<main><p>@Html(blog.summary_html)</p></main>
|
<main><p>@Html(blog.summary_html)</p></main>
|
||||||
|
Loading…
Reference in New Issue
Block a user