365DevNet/365devnet
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor Hero2 component by removing unnecessary animation classes for cleaner markup

Browse Source 
- Simplified class attributes in the Hero2 component by removing redundant animation classes, enhancing readability and maintainability.
This commit is contained in:
Richard Bergsma
2025-06-07 17:38:40 +02:00
parent 4321824bf5
commit 347050a538
1 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/widgets/Hero2.astro
View File

@@ -41,7 +41,7 @@ const {
{ {
title && ( title && (
<h1 <h1
class="text-5xl md:text-6xl font-bold leading-tighter tracking-tighter mb-4 font-heading dark:text-gray-200 intersect-once motion-safe:md:intersect:animate-fade motion-safe:md:opacity-0 intersect-quarter content-backdrop p-2 inline-block rounded-md" class="text-5xl md:text-6xl font-bold leading-tighter tracking-tighter mb-4 font-heading dark:text-gray-200 content-backdrop p-2 inline-block rounded-md"
set:html={title} set:html={title}
/> />
) )
@@ -50,7 +50,7 @@ const {
{ {
subtitle && ( subtitle && (
<p <p
class="text-xl text-muted mb-6 dark:text-slate-300 intersect-once motion-safe:md:intersect:animate-fade motion-safe:md:opacity-0 intersect-quarter content-backdrop p-2 rounded-md" class="text-xl text-muted mb-6 dark:text-slate-300 content-backdrop p-2 rounded-md"
set:html={subtitle} set:html={subtitle}
/> />
) )
@@ -58,7 +58,7 @@ const {
{ {
actions && ( actions && (
<div class="max-w-xs sm:max-w-md m-auto flex flex-nowrap flex-col sm:flex-row sm:justify-center gap-4 lg:justify-start lg:m-0 lg:max-w-7xl intersect-once motion-safe:md:intersect:animate-fade motion-safe:md:opacity-0 intersect-quarter content-backdrop p-2 rounded-md"> <div class="max-w-xs sm:max-w-md m-auto flex flex-nowrap flex-col sm:flex-row sm:justify-center gap-4 lg:justify-start lg:m-0 lg:max-w-7xl content-backdrop p-2 rounded-md">
{Array.isArray(actions) ? ( {Array.isArray(actions) ? (
actions.map((action) => ( actions.map((action) => (
<div class="flex w-full sm:w-auto"> <div class="flex w-full sm:w-auto">
@@ -77,7 +77,7 @@ const {
<div class="basis-1/2"> <div class="basis-1/2">
{ {
image && ( image && (
<div class="relative m-auto max-w-5xl z-10 intersect-once intercept-no-queue motion-safe:md:intersect:animate-fade motion-safe:md:opacity-0 intersect-quarter"> <div class="relative m-auto max-w-5xl z-10">
{typeof image === 'string' ? ( {typeof image === 'string' ? (
<Fragment set:html={image} /> <Fragment set:html={image} />
) : ( ) : (