@yatoday/astro-ui 0.17.14 → 0.17.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/Card1/Card1.astro +6 -4
- package/components/Card2/Card2.astro +14 -12
- package/components/Card3/Card3.astro +6 -4
- package/components/Card6/Card6.astro +7 -5
- package/components/HeroSection/HeroSection.astro +8 -8
- package/components/SwiperSlider/SwiperSlider.astro +13 -0
- package/package.json +1 -1
|
@@ -156,11 +156,13 @@ const isHtmlImage = typeof image === 'string' && !Array.isArray(image);
|
|
|
156
156
|
<div class={twMerge('px-6 space-y-6')}>
|
|
157
157
|
<!-- Title & Description -->
|
|
158
158
|
<div>
|
|
159
|
-
|
|
160
|
-
{
|
|
161
|
-
|
|
159
|
+
{title && (
|
|
160
|
+
<WrapperHeaderTag class={twMerge('text-base/5 md:text-xl font-bold', titleClass)}>
|
|
161
|
+
{title}
|
|
162
|
+
</WrapperHeaderTag>
|
|
163
|
+
)}
|
|
162
164
|
|
|
163
|
-
<div class={twMerge('mt-1', descriptionClass)}>
|
|
165
|
+
<div class={twMerge(title ? 'mt-1' : '', descriptionClass)}>
|
|
164
166
|
<slot />
|
|
165
167
|
{description}
|
|
166
168
|
</div>
|
|
@@ -118,19 +118,21 @@ const isHtmlImage = typeof image === 'string' && !Array.isArray(image);
|
|
|
118
118
|
<!-- Content -->
|
|
119
119
|
<div class={twMerge('px-6 space-y-6')}>
|
|
120
120
|
<div>
|
|
121
|
-
|
|
122
|
-
{
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
{
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
121
|
+
{title && (
|
|
122
|
+
<WrapperHeaderTag class={twMerge('text-xl font-bold', titleClass)}>
|
|
123
|
+
{
|
|
124
|
+
url || callToAction?.href ? (
|
|
125
|
+
<a href={url || callToAction?.href || '/'} class="after:content-[''] after:inset-0 after:absolute">
|
|
126
|
+
{title}
|
|
127
|
+
</a>
|
|
128
|
+
) : (
|
|
129
|
+
title
|
|
130
|
+
)
|
|
131
|
+
}
|
|
132
|
+
</WrapperHeaderTag>
|
|
133
|
+
)}
|
|
132
134
|
|
|
133
|
-
<div class={twMerge('mt-2', contentClass)}>
|
|
135
|
+
<div class={twMerge(title ? 'mt-2' : '', contentClass)}>
|
|
134
136
|
<slot />
|
|
135
137
|
{description}
|
|
136
138
|
</div>
|
|
@@ -145,11 +145,13 @@ const isHtmlImage = typeof image === 'string' && !Array.isArray(image);
|
|
|
145
145
|
|
|
146
146
|
<div class="flex items-start gap-2">
|
|
147
147
|
<div>
|
|
148
|
-
|
|
149
|
-
{
|
|
150
|
-
|
|
148
|
+
{title && (
|
|
149
|
+
<WrapperHeaderTag class={cn('text-lg md:text-xl font-bold', titleClass)}>
|
|
150
|
+
{title}
|
|
151
|
+
</WrapperHeaderTag>
|
|
152
|
+
)}
|
|
151
153
|
|
|
152
|
-
<div class={cn('mt-2 text-sm md:text-base leading-5 md:leading-6', descriptionClass)}>
|
|
154
|
+
<div class={cn(title ? 'mt-2' : '', 'text-sm md:text-base leading-5 md:leading-6', descriptionClass)}>
|
|
153
155
|
<slot />
|
|
154
156
|
{description}
|
|
155
157
|
</div>
|
|
@@ -86,12 +86,14 @@ const isHtmlImage = typeof image === 'string' && !Array.isArray(image);
|
|
|
86
86
|
</div>
|
|
87
87
|
)}
|
|
88
88
|
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
89
|
+
{title && (
|
|
90
|
+
<WrapperHeaderTag
|
|
91
|
+
class={cn('font-bold text-lg @lg:text-xl @2xl:text-2xl ', urlForImage && 'group-hover:underline', titleClass)}>
|
|
92
|
+
{title}
|
|
93
|
+
</WrapperHeaderTag>
|
|
94
|
+
)}
|
|
93
95
|
|
|
94
|
-
<div class={cn('text-sm @lg:text-base @2xl:text-lg mt-2 ', descriptionClass)}>
|
|
96
|
+
<div class={cn('text-sm @lg:text-base @2xl:text-lg', title ? 'mt-2' : '', descriptionClass)}>
|
|
95
97
|
<slot/>
|
|
96
98
|
{description}
|
|
97
99
|
</div>
|
|
@@ -101,10 +101,10 @@ const WrapperDescriptionTag = asDescription;
|
|
|
101
101
|
) : (
|
|
102
102
|
<Image
|
|
103
103
|
class={cn('w-full md:h-full bg-gray-400 dark:bg-slate-700', imageClass)}
|
|
104
|
-
widths={[
|
|
105
|
-
width={
|
|
106
|
-
height={
|
|
107
|
-
sizes="(max-width: 768px) 100vw,
|
|
104
|
+
widths={[600, 900, 1200, 1600, 1920]}
|
|
105
|
+
width={1920}
|
|
106
|
+
height={1080}
|
|
107
|
+
sizes="(max-width: 768px) 100vw, 60vw"
|
|
108
108
|
layout="cover"
|
|
109
109
|
loading={isFirstSlide ? "eager" : "lazy"}
|
|
110
110
|
fetchpriority={isFirstSlide ? "high" : undefined}
|
|
@@ -120,10 +120,10 @@ const WrapperDescriptionTag = asDescription;
|
|
|
120
120
|
) : (
|
|
121
121
|
<Image
|
|
122
122
|
class={cn('w-full h-full')}
|
|
123
|
-
widths={[
|
|
124
|
-
width={
|
|
125
|
-
height={
|
|
126
|
-
sizes="(max-width: 768px) 100vw,
|
|
123
|
+
widths={[600, 900, 1200, 1600, 1920]}
|
|
124
|
+
width={1920}
|
|
125
|
+
height={1080}
|
|
126
|
+
sizes="(max-width: 768px) 100vw, 60vw"
|
|
127
127
|
layout="cover"
|
|
128
128
|
loading={isFirstSlide ? "eager" : "lazy"}
|
|
129
129
|
fetchpriority={isFirstSlide ? "high" : undefined}
|
|
@@ -88,6 +88,19 @@ const {
|
|
|
88
88
|
}
|
|
89
89
|
</div>
|
|
90
90
|
|
|
91
|
+
<style>
|
|
92
|
+
/* Prevent iOS from triggering link clicks during horizontal swipe */
|
|
93
|
+
swiper-container {
|
|
94
|
+
touch-action: pan-y pinch-zoom;
|
|
95
|
+
}
|
|
96
|
+
swiper-slide {
|
|
97
|
+
touch-action: pan-y pinch-zoom;
|
|
98
|
+
}
|
|
99
|
+
swiper-slide a {
|
|
100
|
+
touch-action: pan-y pinch-zoom;
|
|
101
|
+
}
|
|
102
|
+
</style>
|
|
103
|
+
|
|
91
104
|
<script>
|
|
92
105
|
import { addClasses, removeClasses } from '../../utils';
|
|
93
106
|
|