Fix comment-container form background color #3 and adjust comment-marker position #8

This commit is contained in:
Timothée Goguely 2024-11-20 16:43:00 +01:00
parent fddde41166
commit ee30eb2b6e

View file

@ -81,7 +81,7 @@
v-if="isAddOpen" v-if="isAddOpen"
action="" action=""
method="post" method="post"
class="flow | bg-white-20 | p-12 | rounded-xl" class="flow | p-12 | rounded-xl"
@submit="handleSubmit" @submit="handleSubmit"
> >
<label class="sr-only" for="comment">Votre commentaire</label> <label class="sr-only" for="comment">Votre commentaire</label>
@ -345,6 +345,7 @@ function openComment(comment) {
position: -webkit-sticky; position: -webkit-sticky;
position: sticky; position: sticky;
bottom: 5.5rem; bottom: 5.5rem;
background: #333;
} }
#comments-container textarea { #comments-container textarea {
position: sticky; position: sticky;
@ -375,16 +376,19 @@ function openComment(comment) {
} }
.comment-marker { .comment-marker {
--marker-size: 1.75rem;
position: absolute; position: absolute;
display: block; display: block;
width: 1.75rem; width: var(--marker-size);
height: 1.75rem; height: var(--marker-size);
background: var(--icon-comment-default) no-repeat center / contain; background: var(--icon-comment-default) no-repeat center / contain;
cursor: pointer !important; cursor: pointer !important;
z-index: 999; z-index: 999;
overflow: visible; overflow: visible;
transition: transform 0.1s ease-out; transition: transform 0.1s ease-out;
transform-origin: bottom left; transform-origin: bottom left;
margin-left: calc(var(--marker-size) * -0.025);
margin-top: calc(var(--marker-size) / -1.025);
} }
.comment-marker:hover { .comment-marker:hover {
transform: scale(1.1); transform: scale(1.1);