+2

src/components/blog/Background.astro

··· 1 1 --- 2 2 import Cloud from "./background/Cloud.astro"; 3 3 + import Sun from "./background/Sun.astro"; 3 4 --- 4 5 5 6 <style is:inline> ··· 38 39 39 40 <div id="background"> 40 41 <Cloud /> 42 42 + <Sun /> 41 43 </div>

+19

src/components/blog/background/Sun.astro

··· 1 1 + --- 2 2 + import { blog } from "@/config"; 3 3 + --- 4 4 + 5 5 + <style> 6 6 + img { 7 7 + position: absolute; 8 8 + border-radius: 100%; 9 9 + top: 15rem; 10 10 + left: 5rem; 11 11 + z-index: -1; 12 12 + } 13 13 + </style> 14 14 + 15 15 + <img 16 16 + src="https://upload.wikimedia.org/wikipedia/commons/thumb/6/67/BBSO_full-disk_H-alpha_2002-07-26_153931_color.png/250px-BBSO_full-disk_H-alpha_2002-07-26_153931_color.png" 17 17 + alt="" 18 18 + style={`--parallax-speed: ${blog.background.parallax.sun}`} 19 19 + />

+1

src/config.ts

··· 10 10 background: { 11 11 parallax: { 12 12 clouds: 50, 13 13 + sun: 10, 13 14 }, 14 15 clouds: { 15 16 count: 8,