fix author block render
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
ci/woodpecker/deployment/woodpecker Pipeline was successful

This commit is contained in:
Simon Vieille 2023-08-19 18:23:20 +02:00
parent dedf105f06
commit bad87d913e
Signed by: deblan
GPG key ID: 579388D585F70417
2 changed files with 32 additions and 27 deletions

View file

@ -522,6 +522,34 @@ pre[class*="language-"] {
}
}
.post-author-wrapper {
.post-author-avatar {
vertical-align: top;
width: 100px;
padding: 10px;
display: inline-block;
}
.post-author {
display: inline-block;
width: calc(100% - 100px);
padding: 10px 10px 10px 30px;
}
@media screen and (max-width: 774px) {
.post-author-avatar {
display: block;
margin: auto;
}
.post-author {
display: block;
width: 100%;
padding-right: 20px;
}
}
}
.content hr, .content .hr {
border: 0;
border-bottom: 1px dashed $color-hr-border;
@ -1287,29 +1315,6 @@ $links: (
}
}
// @keyframes avatarlogo {
// 0% {
// -webkit-mask: linear-gradient(135deg,#000c 40%,#000,#000c 60%) 100% 100%/250% 250%;
// }
// 40% {
// -webkit-mask-position: 0 0;
// }
// 90% {
// -webkit-mask: linear-gradient(135deg,#000c 40%,#000,#000c 60%) 100% 100%/250% 250%;
// }
// 100% {
// -webkit-mask: linear-gradient(135deg,#000c 40%,#000,#000c 60%) 100% 100%/250% 250%;
// }
// }
//
// .avatar-logo {
// img, svg {
// _animation-name: avatarlogo;
// animation-duration: 7s;
// animation-iteration-count: infinite;
// }
// }
@media (prefers-color-scheme: dark) {
.bg-box {
background: #343c53;

View file

@ -55,14 +55,14 @@
{% set description = setting('post_author_description') %}
{%- if description and not post.isQuick -%}
<div class="body">
<div class="rounded-2xl shadow-md p-2 md:p-8 flex justify-start bg-box">
<div class="body post-author-wrapper">
<div class="rounded-2xl shadow-md p-2 md:p-8 bg-box">
{%- set avatar = setting('avatar_image') -%}
{%- if avatar -%}
<p class="mr-8">
<div class="post-author-avatar">
<img src="{{ asset(avatar)|imagine_filter('site_avatar') }}" alt="Simon Vieille" title="Simon Vieille" class="rounded-full">
</p>
</div>
{%- endif -%}
<div class="post-author">