diff --git a/app/css/misc.css b/app/css/misc.css index 8c0bc0e..76835e2 100644 --- a/app/css/misc.css +++ b/app/css/misc.css @@ -1,7 +1,3 @@ -:root{ - --tooltip-width: 250px; -} - .badge-color { background-color: var(--color) !important; border-color: var(--color) !important; @@ -70,8 +66,8 @@ .gallery { display: grid; - grid-template-columns: repeat(auto-fill, 520px); - grid-auto-rows: 280px; + grid-template-columns: repeat(auto-fill, 50rem); + grid-auto-rows: 27rem; justify-content: center; grid-gap: 2rem; padding: 2rem @@ -139,16 +135,41 @@ section:target { .trailer { padding-bottom: 56.25%; } -#episodes img{ + +#episodes img { max-height: 150px; } -#episodes > div{ + +#episodes>div { flex: none } -.ep-title{ + +.ep-title { background: rgba(31, 38, 49, 0.7); } +#search:focus { + box-shadow: none +} + +#pageWrapper { + transition: top .4s cubic-bezier(.25,.8,.25,1); +} +.nav-hidden > nav { + top: calc(-1* var(--navbar-height)) !important; +} +.nav-hidden > .content-wrapper { + top: 0 !important; + height: 100% !important; +} +.content-wrapper { + transition: top .4s cubic-bezier(.25,.8,.25,1); + transition-property: top, height; +} +nav { + transition: top .4s cubic-bezier(.25,.8,.25,1); +} + @keyframes load { from { left: -150px; diff --git a/app/css/player.css b/app/css/player.css index 3777b51..c3703f3 100644 --- a/app/css/player.css +++ b/app/css/player.css @@ -7,9 +7,9 @@ --height: 0; --download: 0%; color: #b6b6b6; - --sidebar-width: 19rem; --ts: ""; --miniplayer-display: flex; + --tooltip-width: 250px; } /* NAVBAR */ diff --git a/app/index.html b/app/index.html index 867aacf..dbcec91 100644 --- a/app/index.html +++ b/app/index.html @@ -6,7 +6,7 @@ - + @@ -109,37 +109,38 @@ -