fix 100% height header and added auth to /pokemon

This commit is contained in:
zach
2026-02-25 20:31:13 -05:00
parent d7c5a69d1d
commit a844c37800
5 changed files with 30 additions and 16 deletions

View File

@@ -94,6 +94,7 @@
}
.pokedex-page {
z-index: 99;
position: relative;
top: 50px;
@media (min-width: 768px) {
@@ -426,7 +427,7 @@ $hdr-big-btn-width: $hdr-side-width - $hdr-logo-width - 2 * $hdr-big-btn-margin;
margin: 0 auto; /* Remove default margin */
--a: 8deg;
/* Initial mask to create the shine line */
mask: linear-gradient(135deg, #000c 40%, #000, #000c 60%) 100% 100% / 240% 240%;
mask: linear-gradient(135deg, #fffc 40%, #fff, #fffc 60%) 100% 100% / 240% 240%;
transition: .4s;
transform: perspective(400px) rotate3d(var(--i, 1, -1), 0, var(--a));
}
@@ -444,7 +445,7 @@ $hdr-big-btn-width: $hdr-side-width - $hdr-logo-width - 2 * $hdr-big-btn-margin;
margin: 0 auto; /* Remove default margin */
--a: 8deg;
/* Initial mask to create the shine line */
mask: linear-gradient(135deg, #000c 40%, #000, #000c 60%) 100% 100% / 240% 240%;
mask: linear-gradient(135deg, #fffc 40%, #fff, #fffc 60%) 100% 100% / 240% 240%;
transition: .4s;
transform: perspective(400px) rotate3d(var(--i, 1, -1), 0, var(--a));
}
@@ -460,7 +461,7 @@ $hdr-big-btn-width: $hdr-side-width - $hdr-logo-width - 2 * $hdr-big-btn-margin;
margin: 0 auto; /* Remove default margin */
--a: 8deg;
/* Initial mask to create the shine line */
mask: linear-gradient(135deg, #000d 40%, #000, #000d 60%) 100% 100% / 240% 240%;
mask: linear-gradient(135deg, #fffc 40%, #fff, #fffc 60%) 100% 100% / 240% 240%;
transition: .4s;
transform: perspective(400px) rotate3d(var(--i, 1, -1), 0, var(--a));
}
@@ -483,7 +484,7 @@ $hdr-big-btn-width: $hdr-side-width - $hdr-logo-width - 2 * $hdr-big-btn-margin;
margin: 0 auto; /* Remove default margin */
--a: 8deg;
/* Initial mask to create the shine line */
mask: linear-gradient(135deg, #000c 40%, #000, #000c 60%) 100% 100% / 240% 240%;
mask: linear-gradient(135deg, #fffc 40%, #fff, #fffc 60%) 100% 100% / 240% 240%;
transition: .4s;
transform: perspective(400px) rotate3d(var(--i, 1, -1), 0, var(--a));
}
@@ -492,9 +493,11 @@ $hdr-big-btn-width: $hdr-side-width - $hdr-logo-width - 2 * $hdr-big-btn-margin;
.header-top {
/* pin to top - 0 is default */
bottom: 0;
position: fixed;
/* raise z-index to cover, higher here to allow
a range of z-indexes in the scrolling content */
z-index: 100;
max-height: 150px;
transform:rotate(180deg);
/* height overflows */
@media (min-width:768px) {
@@ -661,9 +664,9 @@ $hdr-big-btn-width: $hdr-side-width - $hdr-logo-width - 2 * $hdr-big-btn-margin;
height: $hdr-topwell-height;
width: 100%;
border-radius: 0 0 $border-radius-hdr $border-radius-hdr;
@media (min-width:768px) {
border-radius: $border-radius-hdr 0 $border-radius-hdr 0;
}
@media (min-width:768px) {
border-radius: $border-radius-hdr 0 $border-radius-hdr 0;
}
}
/* NAV */