Leilukin
/
leilukin-site
mirror of https://github.com/helenclx/leilukin-site.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Adjust guestbook form style

This commit is contained in:
Helen Chong 2024-05-25 00:27:57 +08:00
parent 79e9a79b02
commit 2f083f2aa2
2 changed files with 15 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/assets/css/comments.css
View File

@ -10,10 +10,6 @@
--icon-color: var(--clr-body-txt); --icon-color: var(--clr-body-txt);
} }
gw-comment-form, gw-comment-list {
width: 100%;
}
.comments-region { .comments-region {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -21,8 +17,14 @@ gw-comment-form, gw-comment-list {
gap: 0.8rem; gap: 0.8rem;
} }
.comment-form input { .form-footer input,
width: 135px; .comment-article > button {
cursor: pointer;
border: none;
background: var(--clr-link-btn-bg);
color: var(--clr-link-btn-txt);
padding: 0.3em 0.6em;
border-radius: 0.2em;
} }
.comments-container { .comments-container {
@ -58,23 +60,23 @@ gw-comment-form, gw-comment-list {
.comment-article blockquote { .comment-article blockquote {
max-width: unset !important; max-width: unset !important;
overflow-wrap: break-word; overflow-wrap: break-word;
margin: 0.8em 0;
} }
.comment-article > button { .comment-article > button {
max-width: fit-content; max-width: fit-content;
height: 30px;
} }
.comment-header { .comment-header {
display: grid; display: grid;
grid-template-columns: 0fr 1fr 1fr; grid-template-columns: 0fr max-content 1fr;
gap: 5px; gap: 0.4em;
align-items: baseline; align-items: baseline;
} }
.comment-article .comment-article { .comment-article .comment-article {
margin-left: 0.9em; margin-left: 2em;
margin-top: 0.9em; margin-top: 0.8em;
padding-right: 0; padding-right: 0;
} }
@ -100,6 +102,7 @@ form {
border-color: var(--general-border-color); border-color: var(--general-border-color);
width: 100%; width: 100%;
background-color: var(--content-color); background-color: var(--content-color);
margin: 2em 0;
} }
form.transparent-form { form.transparent-form {
@ -228,11 +231,6 @@ form > h1, form > h2, form > h3, form > h4, form > h5, form > h6 {
padding-right: 10px; padding-right: 10px;
} }
.sr-only {
position: absolute;
left: -99999999px;
}
.inline-banner-wrapper { .inline-banner-wrapper {
display: flex; display: flex;
} }

2
src/assets/js/comments.js
View File

@ -430,7 +430,7 @@ registerNamespace("GW.Controls", function (ns)
<div id="${this.idKey}-header" class="comment-header"> <div id="${this.idKey}-header" class="comment-header">
<div> <div>
<span aria-hidden="true" class="comment-id">#${this.commentId}</span> <span aria-hidden="true" class="comment-id">#${this.commentId}</span>
<span class="sr-only">${headerText}</span> <span class="visually-hidden">${headerText}</span>
</div> </div>
${commenterNameEl} ${commenterNameEl}
<time datetime="${this.isoTimestamp}" class="comment-timestamp">${displayTimestamp}</time> <time datetime="${this.isoTimestamp}" class="comment-timestamp">${displayTimestamp}</time>