feat: let galaxy show through preloader and widen orbit lines
- Make preloader background translucent so the animated starfield is visible during preload for a seamless transition into the hero - Widen orbit strokes (1px -> 2px) and raise opacity for visibility against the now-visible stars Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -40,10 +40,10 @@ const statusLetters = Array.from('Initializing the dark orbit')
|
|||||||
display: grid;
|
display: grid;
|
||||||
place-items: center;
|
place-items: center;
|
||||||
background:
|
background:
|
||||||
radial-gradient(circle at 50% 42%, rgba(222, 201, 255, 0.08), transparent 22rem),
|
radial-gradient(circle at 50% 42%, rgba(222, 201, 255, 0.06), transparent 22rem),
|
||||||
radial-gradient(circle at 68% 26%, rgba(93, 55, 184, 0.18), transparent 24rem),
|
radial-gradient(circle at 68% 26%, rgba(93, 55, 184, 0.12), transparent 24rem),
|
||||||
linear-gradient(180deg, rgba(2, 3, 10, 0.94), rgba(3, 5, 18, 0.97));
|
linear-gradient(180deg, rgba(2, 3, 10, 0.42), rgba(3, 5, 18, 0.52));
|
||||||
backdrop-filter: blur(10px);
|
backdrop-filter: blur(2px);
|
||||||
}
|
}
|
||||||
|
|
||||||
.preloader-core {
|
.preloader-core {
|
||||||
@@ -81,8 +81,8 @@ const statusLetters = Array.from('Initializing the dark orbit')
|
|||||||
|
|
||||||
.pre-orbit {
|
.pre-orbit {
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
border: 1px solid rgba(226, 208, 255, 0.2);
|
border: 2px solid rgba(226, 208, 255, 0.34);
|
||||||
filter: drop-shadow(0 0 14px rgba(168, 135, 255, 0.18));
|
filter: drop-shadow(0 0 16px rgba(168, 135, 255, 0.26));
|
||||||
}
|
}
|
||||||
|
|
||||||
.pre-orbit-one {
|
.pre-orbit-one {
|
||||||
@@ -94,7 +94,7 @@ const statusLetters = Array.from('Initializing the dark orbit')
|
|||||||
|
|
||||||
.pre-orbit-two {
|
.pre-orbit-two {
|
||||||
inset: 21%;
|
inset: 21%;
|
||||||
border-color: rgba(165, 144, 236, 0.18);
|
border-color: rgba(165, 144, 236, 0.3);
|
||||||
transform: rotate(11deg);
|
transform: rotate(11deg);
|
||||||
mask-image: conic-gradient(from 28deg, black 0deg 42deg, transparent 62deg 210deg, black 228deg 260deg, transparent 286deg);
|
mask-image: conic-gradient(from 28deg, black 0deg 42deg, transparent 62deg 210deg, black 228deg 260deg, transparent 286deg);
|
||||||
animation: preload-rotate-reverse 7.4s linear infinite;
|
animation: preload-rotate-reverse 7.4s linear infinite;
|
||||||
|
|||||||
Reference in New Issue
Block a user