renun/BewlyBewly
1
0
Fork 0
mirror of https://github.com/BewlyBewly/BewlyBewly.git synced 2025-04-14 13:15:29 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

refactor: rename --bew-filter-glass to --bew-filter-glass-1

Browse Source
This commit is contained in:
Hakadao
2024-03-10 13:25:13 -03:00
parent dd52392147
commit c13a56a203
17 changed files with 21 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/BackToTopAndRefreshButtons.vue
View File

@@ -19,7 +19,7 @@ const emit = defineEmits(['refresh', 'back-to-top'])
--b-button-shadow: var(--bew-shadow-1);
--b-button-shadow-hover: var(--bew-shadow-2);
--b-button-shadow-active: var(--bew-shadow-1);
backdrop-filter: var(--bew-filter-glass);
backdrop-filter: var(--bew-filter-glass-1);
"
@click="showRefreshButton ? emit('refresh') : emit('back-to-top')"
>

2
src/components/Dock/Dock.vue
View File

@@ -179,7 +179,7 @@ function toggleDockHide(hide: boolean) {
bottom: settings.dockPosition === 'bottom',
hide: hideDock,
}"
style="backdrop-filter: var(--bew-filter-glass);"
style="backdrop-filter: var(--bew-filter-glass-1);"
absolute duration-300 ease-in-out
p-2 m-2 bg="$bew-content-1" flex="~ col gap-2 shrink-0"
rounded="$bew-radius" border="1px $bew-border-color"

4
src/components/RightSideButtons/RightSideButtons.vue
View File

@@ -103,7 +103,7 @@ function toggleDark(e: MouseEvent) {
<Tooltip :content="currentAppColorScheme === 'dark' ? $t('dock.dark_mode') : $t('dock.light_mode')" placement="left">
<Button
class="ctrl-btn"
style="backdrop-filter: var(--bew-filter-glass);"
style="backdrop-filter: var(--bew-filter-glass-1);"
center size="small" round
@click="toggleDark"
@mouseenter="hoveringDockItem.themeMode = true"
@@ -126,7 +126,7 @@ function toggleDark(e: MouseEvent) {
<Tooltip :content="$t('dock.settings')" placement="left">
<Button
class="ctrl-btn"
style="backdrop-filter: var(--bew-filter-glass);"
style="backdrop-filter: var(--bew-filter-glass-1);"
center size="small" round
@click="emit('settings-visibility-change')"
>

2
src/components/SearchBar/SearchBar.vue
View File

@@ -333,7 +333,7 @@ async function handleClearSearchHistory() {
@mixin card-content {
--at-apply: text-base outline-none w-full
bg-$b-search-bar-color shadow-$bew-shadow-2;
backdrop-filter: var(--bew-filter-glass);
backdrop-filter: var(--bew-filter-glass-1);
}
.search-bar {

2
src/components/Select.vue
View File

@@ -86,7 +86,7 @@ function onMouseEnter() {
<transition>
<div
v-if="showOptions"
style="backdrop-filter: var(--bew-filter-glass)"
style="backdrop-filter: var(--bew-filter-glass-1)"
pos="absolute" bg="$bew-elevated-2" shadow="$bew-shadow-2" p="2"
m="t-2"
rounded="$bew-radius" z="1" flex="~ col gap-1"

4
src/components/Settings/Settings.vue
View File

@@ -124,7 +124,7 @@ function setCurrentTitle() {
shrink-0 p="x-4" pos="absolute left--84px" z-2
>
<ul
style="backdrop-filter: var(--bew-filter-glass)"
style="backdrop-filter: var(--bew-filter-glass-2)"
flex="~ gap-2 col" rounded="30px hover:25px" bg="$bew-elevated-1 hover:$bew-elevated-2" p-2 shadow="$bew-shadow-3"
scale="group-hover:105" duration-300 overflow-hidden antialiased
border="1 $bew-border-color"
@@ -181,7 +181,7 @@ function setCurrentTitle() {
{{ title }}
</div>
<div
style="backdrop-filter: var(--bew-filter-glass)"
style="backdrop-filter: var(--bew-filter-glass-1)"
text-2xl leading-0 bg="$bew-fill-1 hover:$bew-theme-color-30" w="32px" h="32px"
p="1" rounded-8 cursor="pointer"
hover:ring="2 $bew-theme-color" hover:text="$bew-theme-color" duration-300

2
src/components/Settings/components/ChildSettingsDialog.vue
View File

@@ -52,7 +52,7 @@ function handleClose() {
</div>
<div
style="backdrop-filter: var(--bew-filter-glass)"
style="backdrop-filter: var(--bew-filter-glass-1)"
text-2xl leading-0 bg="$bew-fill-1 hover:$bew-theme-color-30" w="32px" h="32px"
ml-auto p="1" rounded-8 cursor="pointer"
hover:ring="2 $bew-theme-color" hover:text="$bew-theme-color" duration-300

4
src/components/TopBar/TopBar.vue
View File

@@ -307,7 +307,7 @@ defineExpose({
v-if="showLogo"
ref="logo" href="//www.bilibili.com"
class="group logo"
style="backdrop-filter: var(--bew-filter-glass)"
style="backdrop-filter: var(--bew-filter-glass-1)"
flex items-center border="1 $bew-border-color"
rounded="50px" p="x-4" shadow="$bew-shadow-2" duration-300
bg="$bew-elevated-1 hover:$bew-theme-color dark-hover:white"
@@ -362,7 +362,7 @@ defineExpose({
flex="inline xl:1 justify-center items-center"
>
<div
style="backdrop-filter: var(--bew-filter-glass)"
style="backdrop-filter: var(--bew-filter-glass-1)"
ml-auto flex h-55px p-2 bg="$bew-elevated-1"
text="$bew-text-1" border="1 $bew-border-color" rounded-full shadow="$bew-shadow-2"
>

2
src/components/TopBar/components/ChannelsPop.vue
View File

@@ -44,7 +44,7 @@ const genres = [
<template>
<div
style="backdrop-filter: var(--bew-filter-glass);"
style="backdrop-filter: var(--bew-filter-glass-1);"
shadow="$bew-shadow-3"
flex="~"
p="4"

2
src/components/TopBar/components/FavoritesPop.vue
View File

@@ -134,7 +134,7 @@ defineExpose({
>
<!-- top bar -->
<header
style="backdrop-filter: var(--bew-filter-glass)"
style="backdrop-filter: var(--bew-filter-glass-1)"
flex="~" items-center justify-between
p="x-6"
pos="fixed top-0 left-0"

2
src/components/TopBar/components/HistoryPop.vue
View File

@@ -175,7 +175,7 @@ function getHistoryList(type: HistoryType, viewAt = 0 as number) {
>
<!-- top bar -->
<header
style="backdrop-filter: var(--bew-filter-glass);"
style="backdrop-filter: var(--bew-filter-glass-1);"
flex="~"
justify="between"
p="y-4 x-6"

2
src/components/TopBar/components/MomentsPop.vue
View File

@@ -283,7 +283,7 @@ function toggleWatchLater(aid: number) {
>
<!-- top bar -->
<header
style="backdrop-filter: var(--bew-filter-glass)"
style="backdrop-filter: var(--bew-filter-glass-1)"
flex="~"
justify="between"
items-center

2
src/components/TopBar/components/WatchLaterPop.vue
View File

@@ -50,7 +50,7 @@ function getAllWatchLaterList() {
>
<!-- top bar -->
<header
style="backdrop-filter: var(--bew-filter-glass);"
style="backdrop-filter: var(--bew-filter-glass-1);"
flex="~"
justify="between"
p="y-4 x-6"

2
src/components/VideoCard/VideoCard.vue
View File

@@ -379,7 +379,7 @@ function handelMouseLeave() {
rounded="$bew-radius"
style="
box-shadow: var(--bew-shadow-2);
backdrop-filter: var(--bew-filter-glass);
backdrop-filter: var(--bew-filter-glass-1);
"
>
<p p="2" text="$bew-text-3">

2
src/contentScripts/views/Home/Home.vue
View File

@@ -179,7 +179,7 @@ function toggleTabContentLoading(loading: boolean) {
<li
v-for="tab in currentTabs" :key="tab.page"
:class="{ 'tab-activated': activatedPage === tab.page }"
style="backdrop-filter: var(--bew-filter-glass)"
style="backdrop-filter: var(--bew-filter-glass-1)"
px-4 lh-35px bg="$bew-elevated-1 hover:$bew-elevated-1-hover" rounded="$bew-radius"
cursor-pointer shadow="$bew-shadow-1" box-border border="1 $bew-border-color" duration-300
flex="~ gap-2 items-center"

2
src/styles/adaptedStyles/homePage.scss
View File

@@ -12,7 +12,7 @@
// .header-channel-fixed {
// background-color: var(--bew-elevated-2);
// backdrop-filter: var(--bew-filter-glass);
// backdrop-filter: var(--bew-filter-glass-1);
// border-radius: var(--bew-radius);
// box-shadow: var(--bew-shadow-2);
// }

3
src/styles/variables.scss
View File

@@ -3,7 +3,8 @@
--bew-radius: 12px;
--bew-radius-half: calc(var(--bew-radius) / 2);
--bew-filter-glass: blur(20px) saturate(180%);
--bew-filter-glass-1: blur(20px) saturate(180%);
--bew-filter-glass-2: blur(40px) saturate(180%);
--bew-filter-icon-glow: saturate(0) brightness(2)
drop-shadow(0 0 0.2px white)
drop-shadow(0 0 0.5px var(--bew-theme-color))