mirror of
https://github.com/supabase/supabase.git
synced 2026-06-04 03:41:38 +08:00
This PR migrates the whole monorepo to use Tailwind v4: - Removed `@tailwindcss/container-queries` plugin since it's included by default in v4, - Bump all instances of Tailwind to v4. Made minimal changes to the shared config to remove non-supported features (`alpha` mentions), - Migrate all apps to be compatible with v4 configs, - Fix the `typography.css` import in 3 apps, - Add missing rules which were included by default in v3, - Run `pnpm dlx @tailwindcss/upgrade` on all apps, which renames a lot of classes - Rename all misnamed classes according to https://tailwindcss.com/docs/upgrade-guide#renamed-utilities in all apps. --------- Co-authored-by: Jordi Enric <jordi.err@gmail.com>
54 lines
1.2 KiB
TypeScript
54 lines
1.2 KiB
TypeScript
import 'swiper/css'
|
|
|
|
import React, { FC } from 'react'
|
|
import { useRouter } from 'next/router'
|
|
import { Swiper, SwiperSlide } from 'swiper/react'
|
|
import ExampleCard from '../ExampleCard'
|
|
|
|
import content from '~/data/home/content'
|
|
import type { Example } from 'data/Examples'
|
|
|
|
interface Props {
|
|
examples: Example[]
|
|
className?: string
|
|
}
|
|
|
|
const ExamplesMobile: FC<Props> = ({ examples, className }: any) => {
|
|
const { basePath } = useRouter()
|
|
|
|
return (
|
|
<div className={className}>
|
|
<Swiper
|
|
style={{ zIndex: 0, marginRight: '1px' }}
|
|
initialSlide={0}
|
|
spaceBetween={12}
|
|
slidesPerView={1.1}
|
|
speed={300}
|
|
watchOverflow
|
|
threshold={2}
|
|
updateOnWindowResize
|
|
className="px-6! w-full overflow-visible"
|
|
breakpoints={{
|
|
320: {
|
|
slidesPerView: 1.1,
|
|
},
|
|
540: {
|
|
slidesPerView: 1.6,
|
|
},
|
|
720: {
|
|
slidesPerView: 2.5,
|
|
},
|
|
}}
|
|
>
|
|
{examples.map((example: Example, i: number) => (
|
|
<SwiperSlide key={`${content}-${i}`}>
|
|
<ExampleCard {...example} showProducts inHomepage />
|
|
</SwiperSlide>
|
|
))}
|
|
</Swiper>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default ExamplesMobile
|