diff --git a/static/assets/css/main.css b/static/assets/css/main.css index 17b299d..5a7562d 100644 --- a/static/assets/css/main.css +++ b/static/assets/css/main.css @@ -217,7 +217,7 @@ table.alt thead { border-bottom: 0; } table.alt tfoot { border-top: 0; } /* Panel */ -.panel { padding: 4em 4em 2em 4em ; -moz-transform: translateY(100vh); -webkit-transform: translateY(100vh); -ms-transform: translateY(100vh); transform: translateY(100vh); -moz-transition: -moz-transform 0.3s ease; -webkit-transition: -webkit-transform 0.3s ease; -ms-transition: -ms-transform 0.3s ease; transition: transform 0.3s ease; -webkit-overflow-scrolling: touch; background: rgba(36, 38, 41, 0.975); bottom: 4em; left: 0; max-height: calc(80vh - 4em); overflow-y: auto; position: fixed; width: 100%; z-index: 10001; } +.panel { padding: 4em 4em 2em 4em ; -moz-transform: translateY(-100vh); -webkit-transform: translateY(100vh); -ms-transform: translateY(-100vh); transform: translateY(-100vh); -moz-transition: -moz-transform 0.3s ease; -webkit-transition: -webkit-transform 0.3s ease; -ms-transition: -ms-transform 0.3s ease; transition: transform 0.3s ease; -webkit-overflow-scrolling: touch; background: rgba(36, 38, 41, 0.975); top: 3em; left: 0; max-height: calc(80vh - 4em); overflow-y: auto; position: fixed; width: 100%; z-index: 10001; } .panel.active { -moz-transform: translateY(1px); -webkit-transform: translateY(1px); -ms-transform: translateY(1px); transform: translateY(1px); } .panel > .inner { margin: 0 auto; max-width: 100%; width: 75em; } .panel > .inner.split { display: -moz-flex; display: -webkit-flex; display: -ms-flex; display: flex; } @@ -268,8 +268,8 @@ body.loading #wrapper:before { -moz-transition: opacity 1s ease-out !important; /* Header */ body { padding: 0 0 4em 0; } -#header { -moz-transform: translateY(0); -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); -moz-transition: -moz-transform 1s ease; -webkit-transition: -webkit-transform 1s ease; -ms-transition: -ms-transform 1s ease; transition: transform 1s ease; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; background: #1f2224; bottom: -1em; height: 5em; left: 0; line-height: 4em; padding: 0 1.5em; position: fixed; user-select: none; width: 100%; z-index: 10002; } -body.loading #header { -moz-transform: translateY(4em); -webkit-transform: translateY(4em); -ms-transform: translateY(4em); transform: translateY(4em); } +#header { -moz-transform: translateY(0); -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); -moz-transition: -moz-transform 1s ease; -webkit-transition: -webkit-transform 1s ease; -ms-transition: -ms-transform 1s ease; transition: transform 1s ease; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; background: #1f2224; top: 0; height: 4em; left: 0; line-height: 4em; padding: 0 1.5em; position: static; user-select: none; width: 100%; z-index: 10002; } +body.loading #header { -moz-transform: translateY(-4em); -webkit-transform: translateY(-4em); -ms-transform: translateY(-4em); transform: translateY(-4em); } #header h1 { color: #a0a0a1; display: inline-block; font-size: 1em; line-height: 1; margin: 0; vertical-align: middle; } #header h1 a { border: 0; color: inherit; } #header h1 a:hover { color: inherit !important; }