diff options
Diffstat (limited to 'src/components/LandingInfoCard.svelte')
| -rw-r--r-- | src/components/LandingInfoCard.svelte | 21 |
1 files changed, 10 insertions, 11 deletions
diff --git a/src/components/LandingInfoCard.svelte b/src/components/LandingInfoCard.svelte index d693d78d..2b2dd2a1 100644 --- a/src/components/LandingInfoCard.svelte +++ b/src/components/LandingInfoCard.svelte @@ -1,5 +1,4 @@ <script> - export let gradients; export let image; export let title; export let description; @@ -7,17 +6,17 @@ </script> <div class="block lg:flex justify-center lg:space-x-20 items-center"> - <div - class="{order === 'reverse' && - 'order-last'} bg-gradient-to-r {gradients} rounded-full w-[250px] h-[250px] md:w-[300px] md:h-[300px] lg:w-[350px] lg:h-[350px] xl:w-[450px] xl:h-[450px] 2xl:w-[500px] 2xl:h-[500px] flex justify-center items-center mx-auto lg:mx-0 mb-10 lg:mb-0" - > - {#if image} - <img src="/images/{image}.svg" alt={image} class="w-5/6" /> - {/if} - </div> + {#if image} + <img + src="/images/{image}.png" + alt={image} + class="w-2/3 md:w-5/12 lg:w-2/5 xl:w-1/3 2xl:w-1/4 max-w-xl mx-auto lg:mx-0 mb-10 lg:mb-0 {order === + 'reverse' && 'order-last'}" + /> + {/if} <div class="w-full lg:w-1/2 max-w-3xl space-y-10 mx-auto lg:mx-0"> - <h3 class="text-5xl font-medium text-left">{title}</h3> - <p class="text-secondary text-xl font-medium w-full lg:w-3/4 mx-auto lg:mx-0"> + <h3 class="text-5xl font-medium text-left w-full mx-auto lg:mx-0 md:w-[500px]">{title}</h3> + <p class="text-secondary text-xl font-medium w-full md:w-[500px] mx-auto lg:mx-0"> {#if description} {description} {:else} |