even more improvements
This commit is contained in:
		
							parent
							
								
									6aa3fbd265
								
							
						
					
					
						commit
						92237f747c
					
				| @ -2,8 +2,8 @@ | |||||||
| 
 | 
 | ||||||
| <style> | <style> | ||||||
|     :global(html, body) { |     :global(html, body) { | ||||||
|         width: 100%; |         min-width: 100%; | ||||||
|         height: 100%; |         min-height: 100%; | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     :global(*) { |     :global(*) { | ||||||
| @ -13,7 +13,12 @@ | |||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     :global(body) { |     :global(body) { | ||||||
|         background: linear-gradient(135deg, #1e1e2f, #252547); |         background: linear-gradient( | ||||||
|  |             135deg, | ||||||
|  |             #1e1e2f 0, | ||||||
|  |             #252547 100vh, | ||||||
|  |             #252547 100% | ||||||
|  |         ); | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     :global(main) { |     :global(main) { | ||||||
| @ -21,7 +26,7 @@ | |||||||
|         flex-direction: column; |         flex-direction: column; | ||||||
|         justify-content: center; |         justify-content: center; | ||||||
|         align-items: center; |         align-items: center; | ||||||
|         min-height: 100vh; |         min-height: 80vh; | ||||||
|         color: white; |         color: white; | ||||||
|         font-family: "Inter", sans-serif; |         font-family: "Inter", sans-serif; | ||||||
|         text-align: center; |         text-align: center; | ||||||
|  | |||||||
| @ -24,9 +24,9 @@ | |||||||
|             star.classList.add("star"); |             star.classList.add("star"); | ||||||
| 
 | 
 | ||||||
|             star.style.width = `${sizes[i]}vw`; |             star.style.width = `${sizes[i]}vw`; | ||||||
|             star.style.position = "fixed"; |             star.style.position = "absolute"; | ||||||
|             star.style.left = `${100 * x}%`; |             star.style.left = `${100 * x}vw`; | ||||||
|             star.style.top = `${100 * y}%`; |             star.style.top = `${100 * y}vh`; | ||||||
| 
 | 
 | ||||||
|             return star; |             return star; | ||||||
|         }); |         }); | ||||||
| @ -56,7 +56,7 @@ | |||||||
|             if (Math.random() < 0.05) lidx = chooseRandom(indices); |             if (Math.random() < 0.05) lidx = chooseRandom(indices); | ||||||
| 
 | 
 | ||||||
|             let iter = 0; |             let iter = 0; | ||||||
|             while (iter++ < 1000) { |             while (iter++ < 300) { | ||||||
|                 const nidx = chooseRandom(indices); |                 const nidx = chooseRandom(indices); | ||||||
|                 if (lidx === nidx) continue; |                 if (lidx === nidx) continue; | ||||||
| 
 | 
 | ||||||
| @ -77,8 +77,11 @@ | |||||||
|                 ); |                 ); | ||||||
| 
 | 
 | ||||||
|                 lidx = nidx; |                 lidx = nidx; | ||||||
|                 break; |                 return; | ||||||
|             } |             } | ||||||
|  | 
 | ||||||
|  |             // nothing found -> choose next random | ||||||
|  |             lidx = chooseRandom(indices); | ||||||
|         }, 650); |         }, 650); | ||||||
| 
 | 
 | ||||||
|         document.getElementById("stars")?.append(...stars); |         document.getElementById("stars")?.append(...stars); | ||||||
| @ -157,10 +160,10 @@ | |||||||
| <svg | <svg | ||||||
|     id="stars-lines" |     id="stars-lines" | ||||||
|     aria-hidden="true" |     aria-hidden="true" | ||||||
|     style="position: fixed; left: 0; top: 0; height: 100%; width: 100%; z-index: 0;" |     style="position: absolute; left: 0; top: 0; height: 100%; width: 100%; z-index: 0;" | ||||||
| ></svg> | ></svg> | ||||||
| 
 | 
 | ||||||
| <div id="stars" style="position: fixed; left: 0; top: 0; z-index: 2;"></div> | <div id="stars" style="position: absolute; left: 0; top: 0; z-index: 2;"></div> | ||||||
| 
 | 
 | ||||||
| <main style="position: relative; z-index: 1;"> | <main style="position: relative; z-index: 1;"> | ||||||
|     <h1>Hey, I'm Ludwig 🚀</h1> |     <h1>Hey, I'm Ludwig 🚀</h1> | ||||||
| @ -190,6 +193,8 @@ | |||||||
|     </div> |     </div> | ||||||
| </main> | </main> | ||||||
| 
 | 
 | ||||||
|  | <!-- <div style="height: 1000px;"></div> --> | ||||||
|  | 
 | ||||||
| <style> | <style> | ||||||
|     h1 { |     h1 { | ||||||
|         font-size: 3.5rem; |         font-size: 3.5rem; | ||||||
|  | |||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user