mirror of
https://github.com/BewlyBewly/BewlyBewly.git
synced 2025-04-14 13:15:29 +00:00
294 lines
9.9 KiB
SCSS
294 lines
9.9 KiB
SCSS
.bewly-design {
|
|
// #region new comments components
|
|
// 評論人用戶名
|
|
.reply-item .root-reply-container .content-warp .user-info .user-name,
|
|
.sub-reply-item .sub-user-info .sub-user-name {
|
|
// --520c991b: var(--bew-theme-color);
|
|
color: var(--bew-text-1) !important;
|
|
}
|
|
|
|
// UP主觉得很赞
|
|
.reply-item
|
|
.root-reply-container
|
|
.content-warp
|
|
.root-reply
|
|
.reply-tag-list
|
|
.reply-tag-item {
|
|
color: var(--bew-text-2) !important;
|
|
background-color: var(--bew-fill-1) !important;
|
|
}
|
|
|
|
// Like & dislike icon
|
|
.like-icon,
|
|
.dislike-icon,
|
|
.sub-like-icon,
|
|
.sub-dislike-icon {
|
|
color: var(--bew-text-3) !important;
|
|
}
|
|
|
|
.like-icon:hover,
|
|
.like-icon.liked,
|
|
.dislike-icon:hover,
|
|
.dislike-icon.disliked,
|
|
.sub-like-icon:hover,
|
|
.sub-like-icon.liked,
|
|
.sub-dislike-icon:hover,
|
|
.sub-dislike-icon.disliked {
|
|
color: var(--bew-theme-color) !important;
|
|
}
|
|
|
|
.reply-operation .operation-icon:hover {
|
|
color: var(--bew-theme-color);
|
|
}
|
|
|
|
.bili-comment.browser-pc * a:hover {
|
|
color: var(--bew-theme-color-80);
|
|
}
|
|
|
|
.reply-content-container .reply-content .icon {
|
|
filter: saturate(0) brightness(2)
|
|
drop-shadow(0 0 1px var(--bew-theme-color))
|
|
drop-shadow(0 0 4px var(--bew-theme-color));
|
|
}
|
|
|
|
&.dark {
|
|
// Comment input box
|
|
.reply-box .box-normal .reply-box-warp .reply-box-textarea {
|
|
background-color: var(--bew-fill-1);
|
|
border-color: var(--bew-border-color);
|
|
}
|
|
|
|
.bili-comment.browser-pc {
|
|
// background-color: var(--bew-content-solid-1);
|
|
}
|
|
}
|
|
// #endregion
|
|
|
|
// #region Old comments components
|
|
.bb-comment .comment-send .comment-submit,
|
|
.comment-bilibili-fold .comment-send .comment-submit,
|
|
.bb-comment .comment-send-lite .comment-submit,
|
|
.comment-bilibili-fold .comment-send-lite .comment-submit,
|
|
.bb-comment .stick.assist,
|
|
.comment-bilibili-fold .stick.assist,
|
|
.bb-comment .stick.up,
|
|
.comment-bilibili-fold .stick.up {
|
|
background-color: var(--bew-theme-color);
|
|
}
|
|
|
|
.bb-comment .comment-send .comment-submit:hover,
|
|
.comment-bilibili-fold .comment-send .comment-submit:hover,
|
|
.bb-comment .comment-send-lite .comment-submit:hover,
|
|
.comment-bilibili-fold .comment-send-lite .comment-submit:hover {
|
|
background-color: var(--bew-theme-color-80);
|
|
}
|
|
|
|
.bb-comment .comment-header .tabs-order li:hover,
|
|
.comment-bilibili-fold .comment-header .tabs-order li:hover,
|
|
.bb-comment .comment-list .list-item .user .name:hover,
|
|
.comment-bilibili-fold .comment-list .list-item .user .name:hover,
|
|
.bb-comment a,
|
|
.comment-bilibili-fold a,
|
|
.bili-dyn-forward-item__action,
|
|
.bb-comment .comment-list .list-item .info .btn-hover:hover,
|
|
.comment-bilibili-fold .comment-list .list-item .info .btn-hover:hover,
|
|
.bb-comment .comment-list .list-item .reply-box .view-more .btn-more:hover,
|
|
.comment-bilibili-fold
|
|
.comment-list
|
|
.list-item
|
|
.reply-box
|
|
.view-more
|
|
.btn-more:hover,
|
|
.bb-comment .stick,
|
|
.comment-bilibili-fold .stick,
|
|
.bb-comment .comment-header .tabs-order li.on,
|
|
.comment-bilibili-fold .comment-header .tabs-order li.on {
|
|
color: var(--bew-theme-color);
|
|
}
|
|
|
|
.bb-comment .stick.assist,
|
|
.comment-bilibili-fold .stick.assist,
|
|
.bb-comment .stick.up,
|
|
.comment-bilibili-fold .stick.up {
|
|
color: white !important;
|
|
}
|
|
|
|
.bb-comment .comment-list .list-item .info span.liked i,
|
|
.comment-bilibili-fold .comment-list .list-item .info span.liked i,
|
|
.bb-comment .comment-list .list-item .info span.hated i,
|
|
.comment-bilibili-fold .comment-list .list-item .info span.hated i,
|
|
.bb-comment .comment-list .list-item .info span:hover i,
|
|
.comment-bilibili-fold .comment-list .list-item .info span:hover i,
|
|
.bb-comment .operation .spot:hover,
|
|
.comment-bilibili-fold .operation .spot:hover {
|
|
filter: var(--bew-filter-icon-glow);
|
|
}
|
|
|
|
.bb-comment .comment-header .tabs-order li.on:after,
|
|
.comment-bilibili-fold .comment-header .tabs-order li.on:after {
|
|
display: none;
|
|
}
|
|
|
|
.bili-dyn-forward-publishing__action__btn,
|
|
.textarea-container .comm-tool .comm-submit {
|
|
background-color: var(--bew-theme-color) !important;
|
|
}
|
|
|
|
.textarea-container .comm-tool .comm-submit:hover {
|
|
background-color: var(--bew-theme-color-80) !important;
|
|
}
|
|
|
|
.textarea-container textarea:hover,
|
|
.textarea-container textarea:focus,
|
|
.bb-comment .comment-send .textarea-container:hover textarea,
|
|
.comment-bilibili-fold .comment-send .textarea-container:hover textarea,
|
|
.bb-comment .comment-send-lite .textarea-container:hover textarea,
|
|
.comment-bilibili-fold .comment-send-lite .textarea-container:hover textarea,
|
|
.bb-comment .comment-send .textarea-container.focus textarea,
|
|
.comment-bilibili-fold .comment-send .textarea-container.focus textarea,
|
|
.bb-comment .comment-send-lite .textarea-container.focus textarea,
|
|
.comment-bilibili-fold .comment-send-lite .textarea-container.focus textarea,
|
|
.bili-dyn-forward-publishing__editor:not(.disabled):focus,
|
|
.bili-dyn-forward-publishing__editor:not(.disabled):hover,
|
|
.bb-comment .comment-send .comment-submit,
|
|
.comment-bilibili-fold .comment-send .comment-submit,
|
|
.bb-comment .comment-send-lite .comment-submit,
|
|
.comment-bilibili-fold .comment-send-lite .comment-submit,
|
|
.bb-comment .comment-header .tabs-order li.on,
|
|
.comment-bilibili-fold .comment-header .tabs-order li.on,
|
|
.bb-comment .stick,
|
|
.comment-bilibili-fold .stick {
|
|
border-color: var(--bew-theme-color);
|
|
}
|
|
|
|
.textarea-container textarea:hover,
|
|
.textarea-container textarea:focus {
|
|
border-color: var(--bew-theme-color) !important;
|
|
}
|
|
|
|
.bb-comment .comment-send .comment-submit:hover,
|
|
.comment-bilibili-fold .comment-send .comment-submit:hover,
|
|
.bb-comment .comment-send-lite .comment-submit:hover,
|
|
.comment-bilibili-fold .comment-send-lite .comment-submit:hover {
|
|
border-color: var(--bew-theme-color-80);
|
|
}
|
|
|
|
&.dark {
|
|
.bb-comment,
|
|
.comment-bilibili-fold,
|
|
.bb-comment .comment-send.comment-send-lite,
|
|
.comment-bilibili-fold .comment-send.comment-send-lite,
|
|
.bb-comment .comment-send-lite.comment-send-lite,
|
|
.comment-bilibili-fold .comment-send-lite.comment-send-lite,
|
|
.comment-wrapper .comment-m {
|
|
// background-color: var(--bew-content-solid-1);
|
|
background-color: var(--bew-bg);
|
|
}
|
|
|
|
.bili-dyn-item .bb-comment {
|
|
background-color: unset;
|
|
}
|
|
|
|
.bb-comment .comment-send .textarea-container:hover textarea,
|
|
.comment-bilibili-fold .comment-send .textarea-container:hover textarea,
|
|
.bb-comment .comment-send-lite .textarea-container:hover textarea,
|
|
.comment-bilibili-fold
|
|
.comment-send-lite
|
|
.textarea-container:hover
|
|
textarea,
|
|
.bb-comment .comment-send .textarea-container.focus textarea,
|
|
.comment-bilibili-fold .comment-send .textarea-container.focus textarea,
|
|
.bb-comment .comment-send-lite .textarea-container.focus textarea,
|
|
.comment-bilibili-fold
|
|
.comment-send-lite
|
|
.textarea-container.focus
|
|
textarea,
|
|
.bili-dyn-forward-publishing__editor:not(.disabled):focus,
|
|
.bili-dyn-forward-publishing__editor:not(.disabled):hover {
|
|
background-color: var(--bew-content-solid-1);
|
|
}
|
|
|
|
.forw-area {
|
|
background-color: transparent;
|
|
}
|
|
|
|
.textarea-container .comm-tool .comm-emoji {
|
|
background-color: var(--bew-fill-1);
|
|
}
|
|
|
|
.bb-comment .comment-list .list-item .info .btn-hover:hover,
|
|
.comment-bilibili-fold .comment-list .list-item .info .btn-hover:hover,
|
|
.bb-comment .comment-list .list-item .reply-box .view-more .btn-more:hover,
|
|
.comment-bilibili-fold
|
|
.comment-list
|
|
.list-item
|
|
.reply-box
|
|
.view-more
|
|
.btn-more:hover {
|
|
background-color: var(--bew-fill-2);
|
|
}
|
|
|
|
// .bb-comment .comment-list .list-item .user .name,
|
|
.comment-bilibili-fold .comment-list .list-item .user .name,
|
|
.bb-comment .comment-header .tabs-order li,
|
|
.comment-bilibili-fold .comment-header .tabs-order li,
|
|
.bili-dyn-forward-publishing__editor .bili-rich-textarea__inner,
|
|
.comment-wrapper .comment-m .b-head {
|
|
color: var(--bew-text-1);
|
|
}
|
|
|
|
.bili-dyn-forward-item__uname,
|
|
.bb-comment .comment-list .list-item .user .name {
|
|
color: var(--bew-text-1) !important;
|
|
}
|
|
|
|
.bb-comment .comment-header,
|
|
.comment-bilibili-fold .comment-header,
|
|
.bb-comment .comment-list .list-item .con,
|
|
.comment-bilibili-fold .comment-list .list-item .con,
|
|
.bb-comment .comment-send .comment-emoji,
|
|
.comment-bilibili-fold .comment-send .comment-emoji,
|
|
.bb-comment .comment-send-lite .comment-emoji,
|
|
.comment-bilibili-fold .comment-send-lite .comment-emoji,
|
|
.bb-comment .bottom-page.center,
|
|
.bili-dyn-forward__item,
|
|
.bili-dyn-forward__more,
|
|
.forw-area .forw-more,
|
|
.textarea-container .comm-tool .comm-emoji {
|
|
border-color: var(--bew-border-color);
|
|
}
|
|
|
|
.bb-comment .comment-send .comment-emoji,
|
|
.comment-bilibili-fold .comment-send .comment-emoji,
|
|
.bb-comment .comment-send-lite .comment-emoji,
|
|
.comment-bilibili-fold .comment-send-lite .comment-emoji {
|
|
box-shadow: unset;
|
|
}
|
|
|
|
.bb-comment .comment-send .textarea-container .ipt-txt,
|
|
.comment-bilibili-fold .comment-send .textarea-container .ipt-txt,
|
|
.bb-comment .comment-send-lite .textarea-container .ipt-txt,
|
|
.comment-bilibili-fold .comment-send-lite .textarea-container .ipt-txt,
|
|
.bili-dyn-forward-publishing__editor,
|
|
.textarea-container textarea {
|
|
background-color: var(--bew-fill-1);
|
|
border-color: var(--bew-border-color);
|
|
color: var(--bew-text-1);
|
|
}
|
|
|
|
// UP主觉得很赞
|
|
.bb-comment .comment-list .list-item .info .reply-tags span,
|
|
.comment-bilibili-fold .comment-list .list-item .info .reply-tags span {
|
|
background-color: var(--bew-fill-1) !important;
|
|
color: var(--bew-text-2) !important;
|
|
}
|
|
|
|
.bb-comment .reply-notice .notice-item, .comment-bilibili-fold .reply-notice .notice-item{
|
|
background-color: var(--Ye1);
|
|
border-color: var(--Ye1);
|
|
color: var(--Or7);
|
|
}
|
|
}
|
|
// #endregion
|
|
}
|