august
/
augustkline.com
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Changed up image sizing

This commit is contained in:
august kline 2024-08-27 01:39:18 -04:00
parent 6f222a917c
commit 93985054f7
2 changed files with 2 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/main.ts
View File

@ -152,6 +152,7 @@ let setImages = () => {
const left = lefts[index]; const left = lefts[index];
const top = tops[index]; const top = tops[index];
const z = (Math.abs(left) + Math.abs(top)) / 2; const z = (Math.abs(left) + Math.abs(top)) / 2;
const size = Math.random() * 5 + 9;
const range = { x: window.innerWidth * 0.7, y: window.innerHeight * 0.7 }; const range = { x: window.innerWidth * 0.7, y: window.innerHeight * 0.7 };
img.style.setProperty( img.style.setProperty(
"left", "left",
@ -159,6 +160,7 @@ let setImages = () => {
); );
img.style.setProperty("top", `${top * range.y + window.innerHeight / 2}px`); img.style.setProperty("top", `${top * range.y + window.innerHeight / 2}px`);
img.style.setProperty("--translate-z", `${z * 3000}px`); img.style.setProperty("--translate-z", `${z * 3000}px`);
img.style.setProperty("inline-size", `${size}vmax`);
background.append(img); background.append(img);
} }
}; };

2
style.css
View File

@ -72,9 +72,7 @@ img {
transition: opacity 0.3s; transition: opacity 0.3s;
opacity: 0; opacity: 0;
position: absolute; position: absolute;
inline-size: 10%;
z-index: -1; z-index: -1;
min-inline-size: 10rem;
border: 0.01rem solid var(--img-border-color); border: 0.01rem solid var(--img-border-color);
border-radius: 1rem; border-radius: 1rem;
box-shadow: 0.05rem 0.05rem 0px var(--img-bg-color), box-shadow: 0.05rem 0.05rem 0px var(--img-bg-color),