mirror of
https://github.com/the1812/Bilibili-Evolved.git
synced 2025-11-04 21:22:45 +08:00
Support side block
This commit is contained in:
parent
1a31a42a7a
commit
1719be93a7
@ -41,7 +41,7 @@
|
|||||||
<div
|
<div
|
||||||
v-for="[id, type] of Object.entries(allSideCards)"
|
v-for="[id, type] of Object.entries(allSideCards)"
|
||||||
:key="id"
|
:key="id"
|
||||||
class="filter-side-card-switch feeds-filter-swtich"
|
class="filter-side-card-switch feeds-filter-switch"
|
||||||
@click="toggleBlockSide(id)"
|
@click="toggleBlockSide(id)"
|
||||||
>
|
>
|
||||||
<label :class="{ disabled: sideDisabled(id) }">
|
<label :class="{ disabled: sideDisabled(id) }">
|
||||||
@ -228,44 +228,12 @@ export default Vue.extend({
|
|||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
@import "common";
|
@import "common";
|
||||||
@import "./side-block";
|
@import "./blocker";
|
||||||
|
|
||||||
body.enable-feeds-filter:not(.disable-feeds-filter) {
|
body.enable-feeds-filter:not(.disable-feeds-filter) {
|
||||||
@each $name,
|
@include type-block();
|
||||||
$value
|
|
||||||
in (
|
|
||||||
'repost': 1,
|
|
||||||
'textWithImages': 2,
|
|
||||||
'text': 4,
|
|
||||||
'video': 8,
|
|
||||||
'miniVideo': 16,
|
|
||||||
'column': 64,
|
|
||||||
'audio': 256,
|
|
||||||
'bangumi': 512,
|
|
||||||
'liveRecord': 2047,
|
|
||||||
'share': 2048
|
|
||||||
)
|
|
||||||
{
|
|
||||||
&:not(.by-type).feeds-filter-block-#{$name} {
|
|
||||||
.bili-dyn-list__item[data-type='#{$value}'],
|
|
||||||
.feed-card .card[data-type='#{$value}'] {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@each $name in ('self-repost') {
|
|
||||||
&:not(.by-type).feeds-filter-block-#{$name} {
|
|
||||||
.bili-dyn-list__item[data-#{$name}],
|
|
||||||
.feed-card .card[data-#{$name}] {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@include side-block();
|
@include side-block();
|
||||||
.bili-dyn-list__item.pattern-block,
|
@include pattern-block();
|
||||||
.feed-card .card.pattern-block {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.feeds-filter {
|
.feeds-filter {
|
||||||
background-color: white;
|
background-color: white;
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="filter-type-switch feeds-filter-swtich">
|
<div class="filter-type-switch feeds-filter-switch">
|
||||||
<label :class="{ disabled }">
|
<label :class="{ disabled }">
|
||||||
<span class="name" :class="{ disabled }">{{ type.name }}</span>
|
<span class="name" :class="{ disabled }">{{ type.name }}</span>
|
||||||
<input v-model="disabled" type="checkbox" />
|
<input v-model="disabled" type="checkbox" />
|
||||||
@ -67,7 +67,7 @@ export default Vue.extend({
|
|||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
.feeds-filter-swtich {
|
.feeds-filter-switch {
|
||||||
&:not(:last-child) {
|
&:not(:last-child) {
|
||||||
margin-bottom: 4px;
|
margin-bottom: 4px;
|
||||||
}
|
}
|
||||||
|
|||||||
104
registry/lib/components/feeds/filter/_blocker.scss
Normal file
104
registry/lib/components/feeds/filter/_blocker.scss
Normal file
@ -0,0 +1,104 @@
|
|||||||
|
@mixin type-block {
|
||||||
|
@each $name,
|
||||||
|
$value
|
||||||
|
in (
|
||||||
|
'repost': 1,
|
||||||
|
'textWithImages': 2,
|
||||||
|
'text': 4,
|
||||||
|
'video': 8,
|
||||||
|
'miniVideo': 16,
|
||||||
|
'column': 64,
|
||||||
|
'audio': 256,
|
||||||
|
'bangumi': 512,
|
||||||
|
'liveRecord': 2047,
|
||||||
|
'share': 2048
|
||||||
|
)
|
||||||
|
{
|
||||||
|
&:not(.by-type).feeds-filter-block-#{$name} {
|
||||||
|
.bili-dyn-list__item[data-type='#{$value}'],
|
||||||
|
.feed-card .card[data-type='#{$value}'] {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@each $name in ('self-repost') {
|
||||||
|
&:not(.by-type).feeds-filter-block-#{$name} {
|
||||||
|
.bili-dyn-list__item[data-#{$name}],
|
||||||
|
.feed-card .card[data-#{$name}] {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@mixin side-block {
|
||||||
|
$side-block: 'feeds-filter-side-block';
|
||||||
|
.left-panel,
|
||||||
|
.right-panel {
|
||||||
|
.scroll-content > * {
|
||||||
|
margin: 0 !important;
|
||||||
|
margin-bottom: 8px !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.left-panel {
|
||||||
|
> :not(:last-child) {
|
||||||
|
margin: 0 !important;
|
||||||
|
margin-bottom: 8px !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.left-panel .user-panel.f-left {
|
||||||
|
float: none !important;
|
||||||
|
}
|
||||||
|
.bili-dyn-home--member {
|
||||||
|
main section,
|
||||||
|
aside section {
|
||||||
|
margin-bottom: 0 !important;
|
||||||
|
> * {
|
||||||
|
margin-bottom: 8px !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.#{$side-block}-profile {
|
||||||
|
.left-panel .user-wrapper,
|
||||||
|
.bili-dyn-my-info {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.#{$side-block}-following-tags {
|
||||||
|
.left-panel .tag-panel,
|
||||||
|
.right-panel .dyn-topic-panel,
|
||||||
|
.right-panel .new-topic-panel,
|
||||||
|
section .topic-panel {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.#{$side-block}-notice {
|
||||||
|
.right-panel .notice-panel,
|
||||||
|
.bili-dyn-banner {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.#{$side-block}-live {
|
||||||
|
.left-panel .live-panel,
|
||||||
|
.bili-dyn-live-users {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.#{$side-block}-trending-tags {
|
||||||
|
.right-panel .tag-panel,
|
||||||
|
.topic-panel {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.#{$side-block}-most-viewed {
|
||||||
|
.bili-dyn-up-list,
|
||||||
|
.card-list .most-viewed-panel {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@mixin pattern-block {
|
||||||
|
.bili-dyn-list__item.pattern-block,
|
||||||
|
.feed-card .card.pattern-block {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -1,51 +0,0 @@
|
|||||||
@mixin side-block {
|
|
||||||
$side-block: 'feeds-filter-side-block';
|
|
||||||
.left-panel,
|
|
||||||
.right-panel {
|
|
||||||
.scroll-content > * {
|
|
||||||
margin: 0 !important;
|
|
||||||
margin-bottom: 8px !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.left-panel {
|
|
||||||
> :not(:last-child) {
|
|
||||||
margin: 0 !important;
|
|
||||||
margin-bottom: 8px !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.left-panel .user-panel.f-left {
|
|
||||||
float: none !important;
|
|
||||||
}
|
|
||||||
&.#{$side-block}-profile {
|
|
||||||
.left-panel .user-wrapper {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&.#{$side-block}-following-tags {
|
|
||||||
.left-panel .tag-panel,
|
|
||||||
.right-panel .dyn-topic-panel,
|
|
||||||
.right-panel .new-topic-panel {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&.#{$side-block}-notice {
|
|
||||||
.right-panel .notice-panel {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&.#{$side-block}-live {
|
|
||||||
.left-panel .live-panel {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&.#{$side-block}-trending-tags {
|
|
||||||
.right-panel .tag-panel {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&.#{$side-block}-most-viewed {
|
|
||||||
.card-list .most-viewed-panel {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,9 +1,18 @@
|
|||||||
|
import { feedsCardsManager } from '@/components/feeds/api'
|
||||||
import { ComponentMetadata, ComponentOptions } from '@/components/types'
|
import { ComponentMetadata, ComponentOptions } from '@/components/types'
|
||||||
import { feedsFilterPlugin } from './plugin'
|
import { feedsFilterPlugin } from './plugin'
|
||||||
|
|
||||||
const entry = async () => {
|
const entry = async () => {
|
||||||
const { select } = await import('@/core/spin-query')
|
const { select } = await import('@/core/spin-query')
|
||||||
const leftPanel = await select('.home-container .left-panel, .bili-dyn-home--member aside.left section:first-child')
|
let leftPanel: HTMLElement
|
||||||
|
if (feedsCardsManager.managerType === 'v2') {
|
||||||
|
const leftAside = await select('.bili-dyn-home--member aside.left')
|
||||||
|
const section = document.createElement('section')
|
||||||
|
leftAside.insertAdjacentElement('afterbegin', section)
|
||||||
|
leftPanel = section
|
||||||
|
} else {
|
||||||
|
leftPanel = await select('.home-container .left-panel')
|
||||||
|
}
|
||||||
if (leftPanel === null) {
|
if (leftPanel === null) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user