From 4ceef78599b7f3c47de1c97930d0e40e26ec627e Mon Sep 17 00:00:00 2001 From: syuilo Date: Tue, 29 Dec 2020 17:31:46 +0900 Subject: [PATCH] =?UTF-8?q?=E3=83=A2=E3=83=90=E3=82=A4=E3=83=AB=E3=81=AE?= =?UTF-8?q?=E4=B8=8B=E3=81=AE=E3=82=84=E3=81=A4=E6=94=B9=E4=BF=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/client/components/sidebar.vue | 6 ------ src/client/themes/_dark.json5 | 1 - src/client/themes/_light.json5 | 1 - src/client/ui/default.vue | 28 +++++++++++++++++++--------- 4 files changed, 19 insertions(+), 17 deletions(-) diff --git a/src/client/components/sidebar.vue b/src/client/components/sidebar.vue index 807a714ed1..723bd85ae9 100644 --- a/src/client/components/sidebar.vue +++ b/src/client/components/sidebar.vue @@ -357,12 +357,6 @@ export default defineComponent({ top: 0; left: 0; z-index: 1001; - - > div { - > .notifications { - display: none; - } - } } &:not(.hidden) { diff --git a/src/client/themes/_dark.json5 b/src/client/themes/_dark.json5 index 889436f03b..18075ac322 100644 --- a/src/client/themes/_dark.json5 +++ b/src/client/themes/_dark.json5 @@ -62,7 +62,6 @@ error: '#ec4137', warn: '#ecb637', htmlThemeColor: '@bg', - X1: ':alpha<0<@bg', X2: ':darken<2<@panel', X3: 'rgba(255, 255, 255, 0.05)', X4: 'rgba(255, 255, 255, 0.1)', diff --git a/src/client/themes/_light.json5 b/src/client/themes/_light.json5 index 2f059f0094..2b9bbdd5fd 100644 --- a/src/client/themes/_light.json5 +++ b/src/client/themes/_light.json5 @@ -62,7 +62,6 @@ error: '#ec4137', warn: '#ecb637', htmlThemeColor: '@bg', - X1: ':alpha<0<@bg', X2: ':darken<2<@panel', X3: 'rgba(0, 0, 0, 0.05)', X4: 'rgba(0, 0, 0, 0.1)', diff --git a/src/client/ui/default.vue b/src/client/ui/default.vue index 796e0d54f5..ed55b2b4bd 100644 --- a/src/client/ui/default.vue +++ b/src/client/ui/default.vue @@ -29,6 +29,7 @@
+ @@ -339,15 +340,13 @@ export default defineComponent({ position: fixed; z-index: 1000; bottom: 0; - padding: 0 32px 32px 32px; + padding: 16px; display: flex; width: 100%; box-sizing: border-box; - background: linear-gradient(0deg, var(--bg), var(--X1)); - - @media (max-width: 500px) { - padding: 0 16px 16px 16px; - } + -webkit-backdrop-filter: blur(32px); + backdrop-filter: blur(32px); + background-color: var(--header); &:not(.navHidden) { display: none; @@ -355,15 +354,26 @@ export default defineComponent({ > .button { position: relative; + flex: 1; padding: 0; margin: auto; - width: 64px; height: 64px; - border-radius: 100%; - box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12); + border-radius: 8px; background: var(--panel); color: var(--fg); + &:not(:last-child) { + margin-right: 12px; + } + + @media (max-width: 400px) { + height: 60px; + + &:not(:last-child) { + margin-right: 8px; + } + } + &:hover { background: var(--X2); }