javaxman/NexStudio
1
0
Fork 0
Code Issues 3 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Aggiunge un'illustrazione SVG earthrise nel footer.

Browse Source 
Inserisce in fondo pagina un elemento grafico full-width con orizzonte terrestre, bagliore centrale e fasci luminosi per rafforzare la chiusura visiva della homepage.

Made-with: Cursor
This commit is contained in:
Javaxman
2026-04-22 17:05:16 +02:00
parent d84163661b
commit 0070671f96
2 changed files with 45 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
src/components/FooterEarthrise.astro Normal file
View File

@ -0,0 +1,43 @@
<div class="pointer-events-none relative mt-10 h-28 overflow-hidden sm:h-32" aria-hidden="true">
<svg
class="absolute inset-x-0 bottom-0 h-full w-full"
viewBox="0 0 1440 260"
fill="none"
preserveAspectRatio="none"
>
<defs>
<linearGradient id="nx-earthrise-horizon" x1="0" y1="0" x2="1440" y2="0" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="rgba(56,189,248,0)" />
<stop offset="0.5" stop-color="rgba(186,230,253,0.95)" />
<stop offset="1" stop-color="rgba(56,189,248,0)" />
</linearGradient>
<radialGradient id="nx-earthrise-sun" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(720 182) rotate(90) scale(120 270)">
<stop offset="0" stop-color="rgba(251,191,36,0.5)" />
<stop offset="0.38" stop-color="rgba(125,211,252,0.24)" />
<stop offset="1" stop-color="rgba(15,23,42,0)" />
</radialGradient>
<radialGradient id="nx-earthrise-beam" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(720 84) rotate(90) scale(120 320)">
<stop offset="0" stop-color="rgba(255,255,255,0.3)" />
<stop offset="0.3" stop-color="rgba(125,211,252,0.2)" />
<stop offset="1" stop-color="rgba(15,23,42,0)" />
</radialGradient>
<filter id="nx-earthrise-soft" x="-12%" y="-20%" width="124%" height="160%" color-interpolation-filters="sRGB">
<feGaussianBlur stdDeviation="2.8" />
</filter>
<filter id="nx-earthrise-glow" x="-20%" y="-80%" width="140%" height="260%" color-interpolation-filters="sRGB">
<feGaussianBlur stdDeviation="6.5" />
</filter>
</defs>
<path d="M -160 228 Q 720 104 1600 228" stroke="rgba(56,189,248,0.22)" stroke-width="1.2" />
<path d="M -160 228 Q 720 104 1600 228" stroke="url(#nx-earthrise-horizon)" stroke-width="2.8" filter="url(#nx-earthrise-soft)" />
<path d="M -160 228 Q 720 104 1600 228" stroke="rgba(186,230,253,0.45)" stroke-width="1.25" />
<ellipse cx="720" cy="190" rx="210" ry="62" fill="url(#nx-earthrise-sun)" filter="url(#nx-earthrise-glow)" />
<path d="M 720 212 L 660 16 Q 720 -26 780 16 Z" fill="url(#nx-earthrise-beam)" />
<path d="M 720 210 L 700 42" stroke="rgba(186,230,253,0.3)" stroke-width="1.1" />
<path d="M 720 210 L 742 52" stroke="rgba(186,230,253,0.24)" stroke-width="0.95" />
<path d="M 720 210 L 674 58" stroke="rgba(186,230,253,0.2)" stroke-width="0.95" />
</svg>
</div>

2
src/components/SiteFooter.astro
View File

@ -1,5 +1,6 @@
--- ---
import { footer } from '../data/home'; import { footer } from '../data/home';
import FooterEarthrise from './FooterEarthrise.astro';
const hasNewsletterAction = const hasNewsletterAction =
typeof footer.newsletter.actionUrl === 'string' && typeof footer.newsletter.actionUrl === 'string' &&
@ -216,4 +217,5 @@ const linkClass =
</p> </p>
</div> </div>
</div> </div>
<FooterEarthrise />
</footer> </footer>