add gaussian blur and fix for small screen

This commit is contained in:
xmcp
2019-08-01 15:44:34 +08:00
parent 7045350078
commit 7e70678257
3 changed files with 9 additions and 3 deletions

View File

@@ -21,10 +21,11 @@
position: fixed; position: fixed;
top: 0; top: 0;
height: 100%; height: 100%;
background-color: rgba(255,255,255,.8); background-color: rgba(255,255,255,.7);
overflow-y: auto; overflow-y: auto;
padding-top: 3em; padding-top: 3em;
padding-bottom: 1em; padding-bottom: 1em;
backdrop-filter: blur(10px);
} }
.sidebar, .sidebar-title { .sidebar, .sidebar-title {
@@ -48,6 +49,8 @@
padding-left: .5em; padding-left: .5em;
background-color: rgba(255,255,255,.6); background-color: rgba(255,255,255,.6);
pointer-events: none; pointer-events: none;
backdrop-filter: blur(10px);
box-shadow: 0 3px 5px rgba(0,0,0,.2);
} }
.sidebar-title a { .sidebar-title a {
pointer-events: initial; pointer-events: initial;

View File

@@ -8,6 +8,7 @@
background-color: rgba(255,255,255,.8); background-color: rgba(255,255,255,.8);
box-shadow: 0 0 25px rgba(0,0,0,.4); box-shadow: 0 0 25px rgba(0,0,0,.4);
margin-bottom: 1em; margin-bottom: 1em;
backdrop-filter: blur(10px);
} }
.control-bar { .control-bar {
@@ -37,6 +38,7 @@
color: black; color: black;
background-color: rgba(255,255,255,.5); background-color: rgba(255,255,255,.5);
margin: 0 .5em; margin: 0 .5em;
min-width: 8em;
} }
.list-menu { .list-menu {

View File

@@ -42,10 +42,11 @@
} }
.post-form-bar input[type=file] { .post-form-bar input[type=file] {
border: 0; border: 0;
padding: 0 .5em;
} }
@media screen and (max-width: 600px) { @media screen and (max-width: 570px) {
.post-form-bar input[type=file] { .post-form-bar input[type=file] {
width: 150px; width: 110px;
} }
} }
.post-form-bar button { .post-form-bar button {