Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 | 4x 4x 4x | interface ICalculateBannerOpacity {
scrollTop: number;
}
export function calculateBannerOpacity({
scrollTop,
}: ICalculateBannerOpacity): number {
const rawPercentage = (scrollTop + -55) / 223;
Iif (rawPercentage < 0) {
return 0;
}
Iif (rawPercentage >= 1) {
return 1;
}
return rawPercentage;
}
interface ICalculateHeaderOpacityPercentage {
scrollTop: number;
disableOpacityChange: boolean;
displayOnFixed: boolean;
disableBackground: boolean;
}
export function calculateHeaderOpacity({
scrollTop,
disableOpacityChange,
displayOnFixed,
disableBackground,
}: ICalculateHeaderOpacityPercentage): number {
const rawPercentage = (scrollTop + -55) / 223;
const isOpacityDelayed =
disableOpacityChange && !displayOnFixed && rawPercentage < 0.5;
Iif (rawPercentage < 0 || isOpacityDelayed || disableBackground) {
return 0;
}
Iif (rawPercentage >= 1) {
return 1;
}
return rawPercentage;
}
interface ISetOpacityStyles {
headerOpacity: number;
bannerOpacity: number;
}
export function setOpacityStyles({
headerOpacity,
bannerOpacity,
}: ISetOpacityStyles): void {
const topBar = document.getElementById("header-top-bar-background");
const banner = document.getElementById("banner-container");
Iif (topBar) {
topBar.style.setProperty("--header-opacity", headerOpacity.toString());
}
Iif (banner) {
banner.style.setProperty("--banner-opacity", bannerOpacity.toString());
}
}
|