mirror of
https://github.com/BewlyBewly/BewlyBewly.git
synced 2025-04-14 13:15:29 +00:00
fix(adaptedStyles): adapted unadapted contents (#834)
* fix: adaptation of theme styles * Fix: Code formatting issues in SCSS files * Fix: Code formatting issues in SCSS files * Fix: Code formatting issues in SCSS files * style addition * delete electric style * add noteListPage file * Fix the length of the input box * Fix issues with the previous commit * add style * fix theme style for more pages * docs: adjust FireFox link (#824) * 简中文档补全 * 火狐商店链接修正 * feat: video preview time jump (#821) * docs: update firefox link * fix: home page tab loading animation issues (#827) * fix: resolve i18n not affecting #822 * Create FUNDING.yml * fix(adaptedStyles): adapted user space page styles (#831) * fix: userSpace page style * add style * add style * fix(adaptedStyles): video page comment button disable style (#833) * fix videoPage comment button disable dark style * remove box-shadow * chore(TopBar): remove `important:` * fix(adaptedStyles): update note page class name && adjust note page styles --------- Co-authored-by: 夜晚的鸡鸣 <110297461+MidnightCrowing@users.noreply.github.com> Co-authored-by: 陈生杂物房 <88823709+TC999@users.noreply.github.com>
This commit is contained in:
Hakadao
@@ -49,7 +49,8 @@
|
||||
background-color: var(--bew-theme-color-80);
|
||||
}
|
||||
|
||||
[class*="mediainfo_mediaToolbar"] [class*="mediainfo_btnHome"] {
|
||||
[class*="mediainfo_mediaToolbar"] [class*="mediainfo_btnHome"],
|
||||
[class*="SectionSelector_SectionSelector"] [class*="SectionSelector_sectionItem"][class*="SectionSelector_active"] {
|
||||
background-color: var(--bew-theme-color-10);
|
||||
}
|
||||
|
||||
@@ -97,7 +98,8 @@
|
||||
.squirtle-single-side-setting
|
||||
.squirtle-single-setting-other-choice.active
|
||||
.squirtle-svg-icon.active
|
||||
path {
|
||||
path,
|
||||
.bui-danmaku-switch-on path:nth-child(2) {
|
||||
fill: var(--bew-theme-color);
|
||||
}
|
||||
|
||||
@@ -210,6 +212,7 @@
|
||||
fill: var(--bew-border-color);
|
||||
}
|
||||
}
|
||||
|
||||
// #endregion
|
||||
|
||||
// #region Old anime playback & movie page
|
||||
@@ -383,5 +386,6 @@
|
||||
background-color: var(--bew-bg);
|
||||
}
|
||||
}
|
||||
|
||||
// #endregion
|
||||
}
|
||||
|
||||
@@ -7,6 +7,10 @@
|
||||
line-height: 3em;
|
||||
}
|
||||
|
||||
.reply-box.fixed-box {
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
// #region theme color adaption part
|
||||
// Increase the priority of the style inside by writing a non-existent selector in :not()
|
||||
:not(fdjslfds) {
|
||||
@@ -33,7 +37,9 @@
|
||||
.interaction-info .hover-item:hover,
|
||||
.interaction-info .hover-item:hover i,
|
||||
.normal-article-holder a,
|
||||
.read-article-holder .card-text-label {
|
||||
.read-article-holder .card-text-label,
|
||||
.share-dynamic-dialog .sdd-card .name,
|
||||
.bili-dialog-bomb .appeal-box .wrap .container .textarea .memo a {
|
||||
color: var(--bew-theme-color);
|
||||
}
|
||||
|
||||
@@ -44,7 +50,8 @@
|
||||
.page-content .right-side .rank-module .rank-list .item:nth-child(-n + 3) .rank-index,
|
||||
.article-detail .unfollow,
|
||||
.modal-box-holder .modal-box .modal-footer .modal-btn-primary,
|
||||
.bili-dialog-bomb .appeal-box .submit .confirm {
|
||||
.bili-dialog-bomb .appeal-box .submit .confirm,
|
||||
.bili-dialog-bomb .appeal-box .wrap .container .options .option .checkbox.checked:before {
|
||||
background-color: var(--bew-theme-color);
|
||||
}
|
||||
|
||||
@@ -52,7 +59,8 @@
|
||||
.page-content .right-side .up-list .up-item .info-holder .head .follow,
|
||||
.categories-bar .tag-item.on,
|
||||
.modal-box-holder .modal-box .modal-footer .modal-btn-primary,
|
||||
.read-article-holder .card-text-label {
|
||||
.read-article-holder .card-text-label,
|
||||
.bili-dialog-bomb .appeal-box .wrap .container .options .option .checkbox.checked {
|
||||
border-color: var(--bew-theme-color);
|
||||
}
|
||||
|
||||
@@ -82,6 +90,7 @@
|
||||
filter: drop-shadow(680px 0 0 var(--bew-theme-color));
|
||||
}
|
||||
}
|
||||
|
||||
// #endregion
|
||||
|
||||
// #region dark mode adaption part
|
||||
@@ -112,7 +121,9 @@
|
||||
.view-note .note-content .ql-container .ql-editor,
|
||||
.bili-dialog-bomb .appeal-box .wrap .container .question,
|
||||
.van-popover.van-followed,
|
||||
.van-popover.van-followed .follow_dropdown li:hover {
|
||||
.van-popover.van-followed .follow_dropdown li:hover,
|
||||
.share-dynamic-dialog .sdd-head,
|
||||
.share-success-dialog .info {
|
||||
color: var(--bew-text-1);
|
||||
}
|
||||
|
||||
@@ -138,7 +149,10 @@
|
||||
.article-breadcrumb .slash,
|
||||
.article-detail .bangumi-rate-panel .info .desc,
|
||||
.modal-box-holder .modal-box .modal-footer .modal-btn-default,
|
||||
.bili-dialog-bomb .appeal-box .submit .cancel {
|
||||
.bili-dialog-bomb .appeal-box .submit .cancel,
|
||||
.interaction-info .toolbar .share-box .qrcode-tit,
|
||||
.share-dynamic-dialog .sdd-input,
|
||||
.share-success-dialog .hint {
|
||||
color: var(--bew-text-2);
|
||||
}
|
||||
|
||||
@@ -158,7 +172,8 @@
|
||||
.list-mark,
|
||||
.interaction-info .toolbar .share-box,
|
||||
.interaction-info,
|
||||
.followed {
|
||||
.followed,
|
||||
.share-dynamic-dialog .sdd-card .sdd-card-content {
|
||||
color: var(--bew-text-3);
|
||||
}
|
||||
|
||||
@@ -179,14 +194,27 @@
|
||||
|
||||
.article-container,
|
||||
.page-content .right-side .rank-module .complete-rank,
|
||||
.comment-wrapper .comment-m {
|
||||
.bili-comment.browser-pc,
|
||||
.reply-box.fixed-box,
|
||||
.comment-wrapper .comment-m,
|
||||
.share-dynamic-dialog,
|
||||
.share-dynamic-dialog .sdd-card .sdd-card-content,
|
||||
.share-success-dialog {
|
||||
background-color: var(--bew-content-solid-1);
|
||||
}
|
||||
|
||||
.interaction-info .toolbar .share-box .qrcode-box {
|
||||
background-color: var(--bew-content-solid-2);
|
||||
}
|
||||
|
||||
.comment-wrapper .comment-m {
|
||||
--bew-bg: var(--bew-content-solid-1);
|
||||
}
|
||||
|
||||
.share-dynamic-dialog .sdd-card {
|
||||
background-color: var(--bew-bg);
|
||||
}
|
||||
|
||||
.right-side-bar .to-top,
|
||||
.right-side-bar .side-toolbar,
|
||||
.right-side-bar .catalog,
|
||||
@@ -246,11 +274,15 @@
|
||||
.bili-dialog-bomb .appeal-box .submit,
|
||||
.van-popover.van-followed,
|
||||
.followed,
|
||||
.read-article-holder .row-video-holder {
|
||||
.read-article-holder .row-video-holder,
|
||||
.interaction-info .toolbar .share-box .qrcode-box,
|
||||
.share-dynamic-dialog .sdd-action-bar,
|
||||
.share-dynamic-dialog .sdd-head {
|
||||
border-color: var(--bew-border-color);
|
||||
}
|
||||
|
||||
.to-top {
|
||||
.to-top,
|
||||
.share-success-dialog {
|
||||
border-color: var(--bew-elevated-solid-1);
|
||||
}
|
||||
|
||||
@@ -261,6 +293,22 @@
|
||||
.page-content .right-side .up-list .fresh-btn:before {
|
||||
filter: brightness(2) contrast(0);
|
||||
}
|
||||
|
||||
.interaction-info .toolbar .share-box .qrcode-box {
|
||||
box-shadow: 0 0 4px var(--bew-border-color);
|
||||
}
|
||||
|
||||
.interaction-info .toolbar .share-box .qrcode-ctnr {
|
||||
background: white;
|
||||
box-sizing: border-box;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.interaction-info .toolbar .share-box .qrcode-ctnr canvas {
|
||||
width: 122px;
|
||||
height: 122px;
|
||||
}
|
||||
}
|
||||
|
||||
// #endregion
|
||||
}
|
||||
|
||||
@@ -38,6 +38,10 @@
|
||||
.international-footer .link-box .link-item {
|
||||
border-color: var(--bew-border-color);
|
||||
}
|
||||
|
||||
.bili-footer {
|
||||
min-width: fit-content;
|
||||
}
|
||||
}
|
||||
// #endregion
|
||||
}
|
||||
|
||||
@@ -45,6 +45,12 @@ async function setupStyles() {
|
||||
document.documentElement.classList.add('watchLaterPage')
|
||||
}
|
||||
|
||||
// user note page 笔记页
|
||||
else if (/https?:\/\/space.bilibili\.com\.*\/v\/note-list/.test(currentUrl)) {
|
||||
await import('./notePage.scss')
|
||||
document.documentElement.classList.add('notePage')
|
||||
}
|
||||
|
||||
// user space page 空间页
|
||||
else if (/https?:\/\/space.bilibili\.com\.*/.test(currentUrl)) {
|
||||
await import('./userSpacePage.scss')
|
||||
|
||||
@@ -20,6 +20,10 @@
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.reply-box.fixed-box {
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
:not(fjlsfd) {
|
||||
.dyn-orig-author__following.following-icon:before,
|
||||
.bili-dyn-live-users__more:hover:after,
|
||||
@@ -45,6 +49,10 @@
|
||||
background-color: var(--bew-theme-color);
|
||||
}
|
||||
|
||||
.bili-set-follow-group__add__btn {
|
||||
background-color: var(--bew-theme-color-10);
|
||||
}
|
||||
|
||||
.bili-dyn-publishing__action:not(.disabled):hover {
|
||||
background-color: var(--bew-theme-color-80);
|
||||
}
|
||||
@@ -102,7 +110,8 @@
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
.bili-button.primary.plain {
|
||||
.bili-button.primary.plain,
|
||||
.bili-set-follow-group__list.is-disabled:after {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
@@ -281,7 +290,7 @@
|
||||
}
|
||||
|
||||
.bili-topic-search__popover {
|
||||
background-color: var(--bew-fill-1);
|
||||
background-color: var(--bew-content-solid-2);
|
||||
border-color: var(--bew-border-color);
|
||||
}
|
||||
|
||||
|
||||
244
src/styles/adaptedStyles/notePage.scss
Normal file
244
src/styles/adaptedStyles/notePage.scss
Normal file
@@ -0,0 +1,244 @@
|
||||
.bewly-design.notePage {
|
||||
// #region theme color adaption part
|
||||
// Increase the priority of the style inside by writing a non-existent selector in `:not()`
|
||||
:not(fdjslfds) {
|
||||
#page-series-index .no-channel-container em,
|
||||
.manage-note--header .tools-btns .edit-btn--ghost,
|
||||
.note-single-item .go-video-btn,
|
||||
.note-list-del-popup span.btn-no,
|
||||
.ql-snow.ql-toolbar .ql-picker-item.ql-selected,
|
||||
.ql-snow .ql-toolbar .ql-picker-item.ql-selected,
|
||||
.ql-snow.ql-toolbar .ql-picker-item:hover,
|
||||
.ql-snow .ql-toolbar .ql-picker-item:hover,
|
||||
.ql-snow.ql-toolbar .ql-picker-label.ql-active,
|
||||
.ql-snow .ql-toolbar .ql-picker-label.ql-active,
|
||||
.ql-snow.ql-toolbar .ql-picker-label:hover,
|
||||
.ql-snow .ql-toolbar .ql-picker-label:hover,
|
||||
.ql-snow.ql-toolbar button.ql-active,
|
||||
.ql-snow .ql-toolbar button.ql-active,
|
||||
.ql-snow.ql-toolbar button:focus,
|
||||
.ql-snow .ql-toolbar button:focus,
|
||||
.ql-snow.ql-toolbar button:hover,
|
||||
.ql-snow .ql-toolbar button:hover,
|
||||
.dialog-note-content a {
|
||||
color: var(--bew-theme-color);
|
||||
}
|
||||
|
||||
.van-tabs-bar .van-tabs-tab.van-tabs-tab-active,
|
||||
.dialog-note-footer .btn-cancel {
|
||||
color: var(--bew-theme-color) !important;
|
||||
}
|
||||
|
||||
.manage-note--header .tools-btns .edit-btn--ghost,
|
||||
.note-single-item .go-video-btn,
|
||||
.dialog-note-footer .btn-cancel {
|
||||
border-color: var(--bew-theme-color);
|
||||
}
|
||||
|
||||
#page-series-index .channel-option.no-channel .create-channel,
|
||||
.manage-note--header .tools-btns .publish-btn,
|
||||
.note-single-item .go-video-btn:hover,
|
||||
.note-list-del-popup span.btn-ok,
|
||||
.el-pagination.is-background .el-pager li:not(.disabled).active,
|
||||
.dialog-note-footer .btn-confirm,
|
||||
.checkbox .box.checked {
|
||||
background-color: var(--bew-theme-color);
|
||||
}
|
||||
|
||||
.note-tabs .van-tabs_active-bar {
|
||||
background-color: var(--bew-theme-color) !important;
|
||||
}
|
||||
|
||||
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
|
||||
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,
|
||||
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
|
||||
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
|
||||
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,
|
||||
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,
|
||||
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
|
||||
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
|
||||
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
|
||||
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,
|
||||
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
|
||||
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
|
||||
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,
|
||||
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,
|
||||
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
|
||||
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
|
||||
.ql-snow.ql-toolbar button.ql-active .ql-fill,
|
||||
.ql-snow .ql-toolbar button.ql-active .ql-fill,
|
||||
.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,
|
||||
.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,
|
||||
.ql-snow.ql-toolbar button:focus .ql-fill,
|
||||
.ql-snow .ql-toolbar button:focus .ql-fill,
|
||||
.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,
|
||||
.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,
|
||||
.ql-snow.ql-toolbar button:hover .ql-fill,
|
||||
.ql-snow .ql-toolbar button:hover .ql-fill,
|
||||
.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,
|
||||
.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill {
|
||||
fill: var(--bew-theme-color);
|
||||
}
|
||||
|
||||
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
|
||||
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
|
||||
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
|
||||
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
|
||||
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,
|
||||
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,
|
||||
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
|
||||
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
|
||||
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
|
||||
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
|
||||
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
|
||||
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
|
||||
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
|
||||
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,
|
||||
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
|
||||
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
|
||||
.ql-snow.ql-toolbar button.ql-active .ql-stroke,
|
||||
.ql-snow .ql-toolbar button.ql-active .ql-stroke,
|
||||
.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,
|
||||
.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,
|
||||
.ql-snow.ql-toolbar button:focus .ql-stroke,
|
||||
.ql-snow .ql-toolbar button:focus .ql-stroke,
|
||||
.ql-snow.ql-toolbar button:focus .ql-stroke-miter,
|
||||
.ql-snow .ql-toolbar button:focus .ql-stroke-miter,
|
||||
.ql-snow.ql-toolbar button:hover .ql-stroke,
|
||||
.ql-snow .ql-toolbar button:hover .ql-stroke,
|
||||
.ql-snow.ql-toolbar button:hover .ql-stroke-miter,
|
||||
.ql-snow .ql-toolbar button:hover .ql-stroke-miter {
|
||||
stroke: var(--bew-theme-color);
|
||||
}
|
||||
|
||||
.note-single-item a.go-video-btn:hover {
|
||||
color: white !important;
|
||||
}
|
||||
}
|
||||
// #endregion
|
||||
|
||||
// #region dark mode adaption part
|
||||
&.dark {
|
||||
.note-list .note-header,
|
||||
.note-list .note-tabs,
|
||||
.note-list-item,
|
||||
.note-single-item,
|
||||
.van-dialog {
|
||||
background-color: var(--bew-bg);
|
||||
}
|
||||
|
||||
.note-list-del-popup {
|
||||
background-color: var(--bew-content-solid-1);
|
||||
}
|
||||
|
||||
.note-list-item,
|
||||
.editor-innter .ql-editor {
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(120, 120, 140, 0.44);
|
||||
}
|
||||
}
|
||||
|
||||
// .note-list-item::-webkit-scrollbar-track {
|
||||
// background-color: var(--bg1);
|
||||
// }
|
||||
|
||||
// .editor-innter .ql-editor::-webkit-scrollbar-track {
|
||||
// background-color: var(--bew-content-1);
|
||||
// }
|
||||
|
||||
.note-header .note-title .note-text,
|
||||
.note-single-item .note-item__detail--title,
|
||||
.ql-snow.ql-toolbar button,
|
||||
.ql-snow.ql-toolbar .ql-bar .ql-size,
|
||||
.protocal-dialog .van-dialog__title,
|
||||
.dialog-note-content {
|
||||
color: var(--bew-text-1);
|
||||
}
|
||||
|
||||
.van-tabs-bar .van-tabs-tab {
|
||||
color: var(--bew-text-1) !important;
|
||||
}
|
||||
|
||||
.ql-toolbar.ql-snow + .ql-container.ql-snow,
|
||||
.el-pagination.is-background .btn-next,
|
||||
.el-pagination.is-background .btn-prev,
|
||||
.el-pagination.is-background .el-pager li,
|
||||
.ql-container,
|
||||
.my-notes-empty,
|
||||
.pub-notes-empty {
|
||||
color: var(--bew-text-2);
|
||||
}
|
||||
|
||||
.manage-note--header .status-bar .text,
|
||||
.note-header .note-title .note-count,
|
||||
.note-single-item .note-item__detail--summary,
|
||||
.note-tooltip.info {
|
||||
color: var(--bew-text-3);
|
||||
}
|
||||
|
||||
.el-pagination.is-background .btn-next.disabled,
|
||||
.el-pagination.is-background .btn-next:disabled,
|
||||
.el-pagination.is-background .btn-prev.disabled,
|
||||
.el-pagination.is-background .btn-prev:disabled,
|
||||
.el-pagination.is-background .el-pager li.disabled {
|
||||
color: var(--bew-text-4);
|
||||
}
|
||||
|
||||
.note-list-del-popup p {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.ql-snow .ql-fill {
|
||||
fill: var(--bew-text-1);
|
||||
}
|
||||
|
||||
.ql-snow.readonly-toolbar .ql-fill {
|
||||
fill: var(--bew-text-2);
|
||||
}
|
||||
|
||||
.ql-snow .ql-stroke {
|
||||
fill: var(--bg2);
|
||||
}
|
||||
|
||||
.ql-snow .ql-stroke {
|
||||
stroke: var(--bew-text-1);
|
||||
}
|
||||
|
||||
.manage-note #web-toolbar {
|
||||
border-top-color: var(--bew-border-color);
|
||||
}
|
||||
|
||||
.protocal-dialog .van-dialog__header {
|
||||
border-bottom-color: var(--bew-border-color);
|
||||
}
|
||||
|
||||
.note-tabs .van-tabs-bar:after {
|
||||
background-color: var(--bew-border-color);
|
||||
}
|
||||
|
||||
.el-pagination.is-background .btn-next,
|
||||
.el-pagination.is-background .btn-prev,
|
||||
.el-pagination.is-background .el-pager li,
|
||||
.ql-container,
|
||||
#web-toolbar,
|
||||
#web-toolbar .ql-picker-options,
|
||||
.view-manage-note,
|
||||
.note-tooltip.info,
|
||||
.my-notes-manage-note {
|
||||
background-color: var(--bew-content-solid-1);
|
||||
}
|
||||
|
||||
.ql-toolbar.ql-snow + .ql-container.ql-snow {
|
||||
background-color: var(--bew-fill-1);
|
||||
}
|
||||
|
||||
.note-single-item--selected {
|
||||
background-color: var(--bew-fill-2);
|
||||
}
|
||||
|
||||
.ql-toolbar.ql-snow .ql-picker-options {
|
||||
box-shadow: 0 2px 8px rgb(255 255 255 / 20%);
|
||||
}
|
||||
}
|
||||
// #endregion
|
||||
}
|
||||
@@ -39,6 +39,10 @@
|
||||
position: static;
|
||||
}
|
||||
|
||||
.comment-bilibili-mask {
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
// #region theme color adaption part
|
||||
// Increase the priority of the style inside by writing a non-existent selector in :not()
|
||||
// 淺色模式下主要對 theme color 調整配合 bewlybewly 配色
|
||||
@@ -55,6 +59,7 @@
|
||||
.i-live .i-live-off-guest a,
|
||||
.modal-wrapper .modal-header-close:hover,
|
||||
a:hover,
|
||||
.h .h-v-host:hover,
|
||||
#page-index .channel .section-right-options .play-all-channel:hover .video-commonplayer_play,
|
||||
#page-follows .follow-tabs span.active,
|
||||
#page-follows .follow-tabs span:hover,
|
||||
@@ -88,11 +93,19 @@
|
||||
.video-container.can-hover:hover .text-area .title,
|
||||
.card .button-area .more-button:hover,
|
||||
.card .more-panel .child-button:hover,
|
||||
#page-series-index .no-channel-container em,
|
||||
.expand-btn,
|
||||
.up-info .up-focus-btn,
|
||||
.article-container:hover .text-area .title,
|
||||
.bp-popup-panel .title-ctnr .popup-title,
|
||||
.bl-button--ghost:not(:hover) {
|
||||
.bl-button--ghost:not(:hover),
|
||||
.modal-wrapper .modal-header-close:hover,
|
||||
.btn-container .btn:hover,
|
||||
.follow-dialog-wrap .follow-dialog-window .content .group-list li:hover,
|
||||
.follow-dialog-wrap .follow-dialog-window .content .group-list .add-group .input-group .submit,
|
||||
.bb-comment .operation .opera-list li:hover,
|
||||
.comment-bilibili-fold .operation .opera-list li:hover,
|
||||
.bili-topic-new__default__create__text {
|
||||
color: var(--bew-theme-color);
|
||||
}
|
||||
|
||||
@@ -112,7 +125,8 @@
|
||||
.fans-name[style*="color"],
|
||||
.dynamic-keyword,
|
||||
.card .main-content .user-name a[style*="color"],
|
||||
.dynamic-link-hover-bg {
|
||||
.dynamic-link-hover-bg,
|
||||
.im-popup .bp-popup-panel .title-ctnr .popup-title {
|
||||
color: var(--bew-theme-color) !important;
|
||||
}
|
||||
|
||||
@@ -136,7 +150,19 @@
|
||||
.be-pager-options-elevator input:focus,
|
||||
.up-info .up-focus-btn,
|
||||
.bl-button--ghost,
|
||||
.bl-button--ghost:hover {
|
||||
.bl-button--ghost:hover,
|
||||
.h .report-popup-item.checked .report-popup-item-checkbox,
|
||||
.h .report-popup .report-popup-tip__radio input[type="radio"]:checked + label:before,
|
||||
.btn-container .btn:hover,
|
||||
.follow-dialog-wrap .follow-dialog-window .content .group-list .add-group .add-btn:hover,
|
||||
.follow-dialog-wrap .follow-dialog-window .content .group-list .add-group .input-group,
|
||||
.follow-dialog-wrap .follow-dialog-window .content .group-list .add-group .input-group .submit,
|
||||
.content .group-list li:hover input[type="checkbox"] + i,
|
||||
.content .group-list li input[type="checkbox"]:checked + i,
|
||||
.content .group-list li input[type="checkbox"]:checked:hover + i,
|
||||
.comment-bilibili-con .btn .btn-cancel:hover,
|
||||
.comment-bilibili-con .btn .btn-submit,
|
||||
#page-setting #setting-new-tag:focus + #setting-new-tag-btn {
|
||||
border-color: var(--bew-theme-color);
|
||||
}
|
||||
|
||||
@@ -175,22 +201,42 @@
|
||||
.be-tags-container .tag.new-tag,
|
||||
#page-fav .fav-sidenav .fav-item.cur:hover .icon-cursor,
|
||||
.favInfo-box .collection-details .collection-btn,
|
||||
#page-series-index .channel-option.no-channel .create-channel,
|
||||
.video-container .types,
|
||||
.bl-button--primary,
|
||||
.bl-button--ghost:hover {
|
||||
.bl-button--ghost:hover,
|
||||
.h .report-popup-item.checked .report-popup-item-checkbox,
|
||||
.h .report-popup .report-popup-tip__radio input[type="radio"]:checked + label:after,
|
||||
.follow-dialog-wrap .follow-dialog-window .bottom .btn,
|
||||
.comment-bilibili-con .btn .btn-submit,
|
||||
.bili-topic-new__default__create__icon:after,
|
||||
.bili-topic-new__default__create__icon:before {
|
||||
background-color: var(--bew-theme-color);
|
||||
}
|
||||
|
||||
.follow-dialog-wrap .follow-dialog-window .content .group-list .add-group .input-group .submit {
|
||||
background-color: var(--bew-theme-color-10);
|
||||
}
|
||||
|
||||
.bili-topic-new__default__create__icon {
|
||||
background-color: var(--bew-theme-color-20);
|
||||
}
|
||||
|
||||
.btn.primary:focus,
|
||||
.btn.primary:hover,
|
||||
.h .h-follow:hover,
|
||||
.game-card__btn:hover,
|
||||
.favInfo-box .favInfo-details .fav-options .fav-play:hover,
|
||||
.favInfo-box .collection-details .collection-btn:hover,
|
||||
.bl-button--primary:hover {
|
||||
.bl-button--primary:hover,
|
||||
.comment-bilibili-con .btn .btn-submit:hover {
|
||||
background-color: var(--bew-theme-color-80);
|
||||
}
|
||||
|
||||
.h .h-guest-hint {
|
||||
background-color: var(--bew-theme-color-90);
|
||||
}
|
||||
|
||||
.create-wrapper .choose-action .confirm-btn,
|
||||
.create-wrapper .choose-action .next-btn,
|
||||
.create-wrapper .create-action .confirm-btn,
|
||||
@@ -223,10 +269,29 @@
|
||||
.search-nav-item.search-nav-actived .num,
|
||||
.search-nav-item.search-nav-actived .text,
|
||||
.bangumi-pagelistbox .p:hover,
|
||||
.bangumi-pagelistbox .p.active {
|
||||
.bangumi-pagelistbox .p.active,
|
||||
.comment-bilibili-con .btn .btn-submit:hover {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.content .group-list li input[type="checkbox"] + i {
|
||||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IArs4c6QAAAMZJREFUOBFjZACCY8cuSP/4+6ebkYHB4T8DgyRIjFgA1PMcqOcABzNLqZWVwVNGkGE///45w8DANIGZ898iOxOT58QaBlJ36MwZyb/fmeIYGP4VsDOzmDDuO3xmGSMD00VHW6NOUgxCV7v/8Lny/wz/9JlA3gS5DF0BqXyQGSCzGIAuBAYBdQDILCbqGIUwZdRARFiQyxoNQ3JDDqFvCIQhqDwDFUEIR5PHApkBMosJVDhCyjPyDILpApkBMov6BSzIBmpWAQCEVFxRmF8CTgAAAABJRU5ErkJggg==);
|
||||
border-width: 1px;
|
||||
border-radius: 5px;
|
||||
border-color: #bec3cc;
|
||||
}
|
||||
|
||||
.content .group-list li input[type="checkbox"]:hover + i {
|
||||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IArs4c6QAAAMZJREFUOBFjZACCY8cuSP/4+6ebkYHB4T8DgyRIjFgA1PMcqOcABzNLqZWVwVNGkGE///45w8DANIGZ898iOxOT58QaBlJ36MwZyb/fmeIYGP4VsDOzmDDuO3xmGSMD00VHW6NOUgxCV7v/8Lny/wz/9JlA3gS5DF0BqXyQGSCzGIAuBAYBdQDILCbqGIUwZdRARFiQyxoNQ3JDDqFvCIQhqDwDFUEIR5PHApkBMosJVDhCyjPyDILpApkBMov6BSzIBmpWAQCEVFxRmF8CTgAAAABJRU5ErkJggg==);
|
||||
}
|
||||
|
||||
.content .group-list li input[type="checkbox"]:checked + i,
|
||||
.content .group-list li input[type="checkbox"]:checked:hover + i {
|
||||
background: var(--bew-theme-color) url(//s1.hdslb.com/bfs/static/jinkela/note-list/assets/ic_check.svg) no-repeat
|
||||
50% / 9px;
|
||||
}
|
||||
}
|
||||
|
||||
// #endregion
|
||||
|
||||
// #region dark mode adaption part
|
||||
@@ -237,14 +302,6 @@
|
||||
--bg2: var(--bew-bg);
|
||||
}
|
||||
|
||||
.main-content .card-content .post-content.repost,
|
||||
.main-content .card-content .post-content .original-card-content .article-container,
|
||||
.main-content .card-content .deleted,
|
||||
.card .more-panel,
|
||||
.card .more-panel:after {
|
||||
background-color: var(--bg2);
|
||||
}
|
||||
|
||||
.n .n-inner,
|
||||
#page-index .col-1,
|
||||
#page-index .col-2 .section,
|
||||
@@ -287,7 +344,12 @@
|
||||
#page-follows .modal-container.edit-video-modal .target-followitem,
|
||||
#page-fav .fav-main .search-input input,
|
||||
#page-fav .fav-main .fav-action-bottom .search-results-num,
|
||||
.card .main-content .user-name a {
|
||||
.card .main-content .user-name a,
|
||||
.h .report-popup-tip,
|
||||
.follow-dialog-wrap .follow-dialog-window .title,
|
||||
.follow-dialog-wrap .follow-dialog-window .content .group-list li,
|
||||
.be-input,
|
||||
.pugv-container .pugv-item .item-infos .main-title {
|
||||
color: var(--bew-text-1);
|
||||
}
|
||||
|
||||
@@ -312,14 +374,20 @@
|
||||
#page-fav .search-empty-hint p,
|
||||
.small-item .meta,
|
||||
#page-fav .fav-main .fav-meta,
|
||||
.video-container .text-area .content {
|
||||
.video-container .text-area .content,
|
||||
.h .report-popup-item-text,
|
||||
.follow-dialog-wrap .follow-dialog-window .content .info .uname,
|
||||
.selector-box,
|
||||
.textarea {
|
||||
color: var(--bew-text-2);
|
||||
}
|
||||
|
||||
.bili-dyn-interaction__item__desc .bili-rich-text__content,
|
||||
.opus-list .opus-item-time,
|
||||
.list-item .meta,
|
||||
.favInfo-box .favInfo-details .fav-options .meta {
|
||||
.favInfo-box .favInfo-details .fav-options .meta,
|
||||
.content-text,
|
||||
.report-tip {
|
||||
color: var(--bew-text-3);
|
||||
}
|
||||
|
||||
@@ -423,7 +491,13 @@
|
||||
.section .operation,
|
||||
.section .count,
|
||||
.large-item .cover img,
|
||||
#page-follows .modal-container.edit-video-modal .modal-body .target-followlist {
|
||||
#page-follows .modal-container.edit-video-modal .modal-body .target-followlist,
|
||||
.btn-container .btn,
|
||||
.h .space-report-popup .modal-wrapper .modal-body,
|
||||
.follow-dialog-wrap .follow-dialog-window .title,
|
||||
.follow-dialog-wrap .follow-dialog-window .bottom,
|
||||
.static-popup,
|
||||
.bili-at-popup {
|
||||
border-color: var(--bew-border-color);
|
||||
}
|
||||
|
||||
@@ -431,6 +505,10 @@
|
||||
border-color: var(--bew-border-color) !important;
|
||||
}
|
||||
|
||||
.emoji-box {
|
||||
border-color: var(--bew-content-solid-2);
|
||||
}
|
||||
|
||||
#page-fav .fav-main .small-item {
|
||||
border-color: transparent;
|
||||
}
|
||||
@@ -444,52 +522,49 @@
|
||||
}
|
||||
|
||||
.section-title,
|
||||
#page-index .col-2 .section .user-auth.no-auth .no-auth-title .goto-auth,
|
||||
.user-info .user-info-title .info-title,
|
||||
.article-title,
|
||||
#page-index .channel.guest .channel-item .channel-title .channel-name,
|
||||
#page-index .channel .channel-item .channel-name,
|
||||
.large-item .title,
|
||||
#pin-wrapper .pin-layer-vlist .small-item .title,
|
||||
#page-setting .setting-privacy-item .setting-privacy-name,
|
||||
#page-setting .setting-index-module,
|
||||
.favInfo-box .favInfo-details .fav-name,
|
||||
#page-follows .follow-main .follow-action-bottom li,
|
||||
.modal-wrapper .modal-title,
|
||||
#page-fav .fav-sidenav .nav-title .text,
|
||||
.be-dropdown-item,
|
||||
a,
|
||||
// span,
|
||||
.create-wrapper .dialog-title,
|
||||
.create-wrapper .create-input .command,
|
||||
.create-wrapper .choose-action .back-btn,
|
||||
.create-wrapper .choose-action .cancel-btn,
|
||||
.create-wrapper .create-action .back-btn,
|
||||
.create-wrapper .create-action .cancel-btn,
|
||||
.edit-media-list .edit-mask .edit-board .head,
|
||||
.edit-media-list .edit-mask .edit-board .edit-info .info-wrap .title,
|
||||
.edit-media-list
|
||||
.edit-mask
|
||||
.edit-board
|
||||
.edit-info
|
||||
.upload-cover-wrapper
|
||||
.cover-title,
|
||||
.pgc-space-follow-item .bangumi-options .opt-list li,
|
||||
#page-setting #setting-new-tag-btn,
|
||||
#page-follows .follow-main .follow-action-top .back-to-info,
|
||||
#page-video .play-all-btn,
|
||||
#page-fav .fav-main .filter-item,
|
||||
#page-fav .fav-main .filter-item .filter-type .be-dropdown-item span,
|
||||
#page-fav .fav-main .fav-action-bottom li,
|
||||
.sub-tabs span,
|
||||
#page-follows .follow-tabs,
|
||||
#page-index .col-2 .section .user-auth .profession-description,
|
||||
.elec .elec-count,
|
||||
#page-index .col-2 .section .user-auth .auth-description,
|
||||
#page-series-index .channel-item .channel-name,
|
||||
#page-collection-detail .channel-detail .content .breadcrumb .item,
|
||||
.bangumi-pagelistbox .custom-right .custom-right-inner.custompage,
|
||||
.feed-dynamic-header-title {
|
||||
#page-index .col-2 .section .user-auth.no-auth .no-auth-title .goto-auth,
|
||||
.user-info .user-info-title .info-title,
|
||||
.article-title,
|
||||
#page-index .channel.guest .channel-item .channel-title .channel-name,
|
||||
#page-index .channel .channel-item .channel-name,
|
||||
.large-item .title,
|
||||
#pin-wrapper .pin-layer-vlist .small-item .title,
|
||||
#page-setting .setting-privacy-item .setting-privacy-name,
|
||||
#page-setting .setting-index-module,
|
||||
.favInfo-box .favInfo-details .fav-name,
|
||||
#page-follows .follow-main .follow-action-bottom li,
|
||||
.modal-wrapper .modal-title,
|
||||
#page-fav .fav-sidenav .nav-title .text,
|
||||
.be-dropdown-item,
|
||||
a,
|
||||
// span,
|
||||
.create-wrapper .dialog-title,
|
||||
.create-wrapper .create-input .command,
|
||||
.create-wrapper .choose-action .back-btn,
|
||||
.create-wrapper .choose-action .cancel-btn,
|
||||
.create-wrapper .create-action .back-btn,
|
||||
.create-wrapper .create-action .cancel-btn,
|
||||
.edit-media-list .edit-mask .edit-board .head,
|
||||
.edit-media-list .edit-mask .edit-board .edit-info .info-wrap .title,
|
||||
.edit-media-list .edit-mask .edit-board .edit-info .upload-cover-wrapper .cover-title,
|
||||
.pgc-space-follow-item .bangumi-options .opt-list li,
|
||||
#page-setting #setting-new-tag-btn,
|
||||
#page-follows .follow-main .follow-action-top .back-to-info,
|
||||
#page-video .play-all-btn,
|
||||
#page-fav .fav-main .filter-item,
|
||||
#page-fav .fav-main .filter-item .filter-type .be-dropdown-item span,
|
||||
#page-fav .fav-main .fav-action-bottom li,
|
||||
.sub-tabs span,
|
||||
#page-follows .follow-tabs,
|
||||
.elec .elec-count,
|
||||
#page-index .col-2 .section .user-auth .auth-description,
|
||||
#page-series-index .channel-item .channel-name,
|
||||
#page-collection-detail .channel-detail .content .breadcrumb .item,
|
||||
.bangumi-pagelistbox .custom-right .custom-right-inner.custompage,
|
||||
.feed-dynamic-header-title,
|
||||
.bb-comment .operation .opera-list,
|
||||
.comment-bilibili-fold .operation .opera-list,
|
||||
.bili-at-popup__user-name {
|
||||
color: var(--bew-text-1);
|
||||
}
|
||||
|
||||
@@ -503,15 +578,36 @@
|
||||
.v-search-result,
|
||||
.feed-dynamic-header-search,
|
||||
.section .count,
|
||||
.list-create .text {
|
||||
.list-create .text,
|
||||
.btn-container .btn {
|
||||
color: var(--bew-text-2);
|
||||
}
|
||||
|
||||
.emoji.kaomoji {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.section .count:before,
|
||||
.series-item .item-title .qipapnum:before {
|
||||
.series-item .item-title .qipapnum:before,
|
||||
.follow-dialog-wrap .follow-dialog-window .layout {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.emoji-box,
|
||||
.emoji-box .emoji-tabs .tab-link:hover,
|
||||
.comment-bilibili-con,
|
||||
.static-popup,
|
||||
.emoji-cover.selected,
|
||||
.emoji,
|
||||
.ps .ps__rail-x:hover,
|
||||
.ps .ps__rail-y:hover,
|
||||
.ps .ps__rail-x:focus,
|
||||
.ps .ps__rail-y:focus,
|
||||
.ps .ps__rail-x.ps--clicking,
|
||||
.ps .ps__rail-y.ps--clicking {
|
||||
background-color: var(--bew-bg);
|
||||
}
|
||||
|
||||
#pin-wrapper #pin-layer,
|
||||
.i-mp-action-menu,
|
||||
.modal-wrapper,
|
||||
@@ -519,7 +615,11 @@
|
||||
.dialog-wrapper,
|
||||
.edit-media-list .edit-mask .edit-board,
|
||||
.pgc-space-follow-item .bangumi-options .opt-list,
|
||||
.bp-popup-panel {
|
||||
.bp-popup-panel,
|
||||
.follow-dialog-wrap .follow-dialog-window,
|
||||
.follow-dialog-wrap .follow-dialog-window .title,
|
||||
.follow-dialog-wrap .follow-dialog-window .content,
|
||||
.bili-at-popup__user--selected {
|
||||
background-color: var(--bew-elevated-solid-1);
|
||||
}
|
||||
|
||||
@@ -594,10 +694,40 @@
|
||||
background-color: var(--bew-content-solid-1);
|
||||
}
|
||||
|
||||
.main-content .card-content .post-content.repost,
|
||||
.main-content .card-content .post-content .original-card-content .article-container,
|
||||
.main-content .card-content .deleted,
|
||||
.card .more-panel,
|
||||
.card .more-panel:after,
|
||||
.bb-comment .operation .opera-list,
|
||||
.comment-bilibili-fold .operation .opera-list,
|
||||
.bili-at-popup {
|
||||
background-color: var(--bew-content-solid-2);
|
||||
}
|
||||
|
||||
.emoji-box .emoji-tabs,
|
||||
.bb-comment .operation .opera-list li:hover,
|
||||
.comment-bilibili-fold .operation .opera-list li:hover,
|
||||
.pagination {
|
||||
background-color: var(--bew-content-1);
|
||||
}
|
||||
|
||||
.emoji-box .emoji-text:hover,
|
||||
.emoji-box .emoji-tabs .tab-link.on {
|
||||
background-color: var(--bew-content-2);
|
||||
}
|
||||
|
||||
.elec .new-elec-trigger:hover {
|
||||
background-color: rgb(65 31 39);
|
||||
}
|
||||
|
||||
.emoji-box.bottom:before,
|
||||
.btn-container .btn,
|
||||
.follow-dialog-wrap .follow-dialog-window .content .group-list ul .follow-group-mask,
|
||||
.comment-bilibili-con .btn .btn-cancel {
|
||||
background: unset;
|
||||
}
|
||||
|
||||
.be-dropdown-item:hover,
|
||||
.elec .elec-status,
|
||||
.elec .elec-status-bg,
|
||||
|
||||
@@ -12,9 +12,48 @@
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.qrcode .van-qrcode {
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.qrcode .van-qrcode canvas {
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
|
||||
// #region theme color adaption part
|
||||
// Increase the priority of the style inside by writing a non-existent selector in `:not()`
|
||||
:not(fdjslfds) {
|
||||
.content .group-list li input[type="checkbox"] + i {
|
||||
border-width: 1px;
|
||||
border-radius: 5px;
|
||||
border-color: #bec3cc;
|
||||
}
|
||||
|
||||
.coin-operated-m-exp .like-checkbox input[type="checkbox"]:checked + i {
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.content .group-list li input[type="checkbox"]:checked + i,
|
||||
.content .group-list li input[type="checkbox"]:checked:hover + i,
|
||||
.coin-operated-m-exp .like-checkbox input[type="checkbox"]:checked + i,
|
||||
.video-share-popover
|
||||
.video-share-dropdown
|
||||
.dropdown-top
|
||||
.dropdown-top-left
|
||||
.capture-bar
|
||||
.bar-left
|
||||
> label
|
||||
#check-timestamp:checked::after {
|
||||
background: var(--bew-theme-color) url(//s1.hdslb.com/bfs/static/jinkela/note-list/assets/ic_check.svg) no-repeat
|
||||
50% / 9px;
|
||||
}
|
||||
|
||||
.content .group-list li input[type="checkbox"] + i,
|
||||
.content .group-list li input[type="checkbox"]:hover + i {
|
||||
background: unset;
|
||||
}
|
||||
|
||||
.note-list .list-note-operation,
|
||||
.note-pc .note-container .note-header .note-operation,
|
||||
.note-up .up-desc-container .desc-top .attention-btn-container {
|
||||
@@ -46,6 +85,7 @@
|
||||
background-color: var(--bew-theme-color-80) !important;
|
||||
}
|
||||
|
||||
.collection-m-exp .content .group-list .add-group .input-group .submit,
|
||||
.follow-dialog-wrap-exp .follow-dialog-window .content .group-list .add-group .input-group .submitGroup {
|
||||
background-color: var(--bew-theme-color-10);
|
||||
}
|
||||
@@ -82,7 +122,11 @@
|
||||
|
||||
.coin-operated-m-exp .mc-box:hover,
|
||||
.coin-operated-m-exp .mc-box.on,
|
||||
.note-pc .note-container .note-header .note-operation {
|
||||
.note-pc .note-container .note-header .note-operation,
|
||||
.content .group-list li:hover input[type="checkbox"] + i,
|
||||
.content .group-list li input[type="checkbox"]:checked + i,
|
||||
.content .group-list li input[type="checkbox"]:checked:hover + i,
|
||||
.coin-operated-m-exp .like-checkbox input[type="checkbox"]:checked + i {
|
||||
border-color: var(--bew-theme-color);
|
||||
}
|
||||
|
||||
@@ -169,8 +213,7 @@
|
||||
.bpx-player-viewpoint-menu-item-active,
|
||||
.cur-play-icon,
|
||||
.playing-gif,
|
||||
.multi-page-v1 .cur-list .list-box li.on img,
|
||||
.coin-operated-m-exp .like-checkbox input[type="checkbox"]:checked + i {
|
||||
.multi-page-v1 .cur-list .list-box li.on img {
|
||||
filter: var(--bew-filter-icon-glow);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user