Skip to content

Commit d27bd8e

Browse files
enZaneenZane
authored
✨ feat: Update remix starter to latest version (#145)
* ✨ feat: Update remix and set up feature flags * ✨ feat: Update to tailwind 4 * ✨ feat: Update storybook starter * ✨ feat: Update remix by split components * ✨ feat: Pass linter
1 parent f3dd70e commit d27bd8e

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

57 files changed

+1599
-1657
lines changed

‎starters/remix/app/components/blocks/Article/Article.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ export const Article = ({
6363
/>
6464
</div>
6565
<div className="mx-auto mb-8 max-w-4xl px-4 sm:px-6 lg:px-8">
66-
<h1 className="mb-6 text-4xl font-bold text-gray-900 dark:text-gray-100 sm:text-5xl md:text-6xl">
66+
<h1 className="mb-6 text-4xl font-bold text-gray-900 sm:text-5xl md:text-6xl dark:text-gray-100">
6767
{title}
6868
</h1>
6969
<div className="mb-8 flex items-center justify-between">
@@ -80,7 +80,7 @@ export const Article = ({
8080
))}
8181
</div>
8282
)}
83-
{summary && <p className="mb-8 italic text-gray-400">{summary}</p>}
83+
{summary && <p className="mb-8 text-gray-400 italic">{summary}</p>}
8484
<RichText content={content} />
8585
</div>
8686
</article>

‎starters/remix/app/components/blocks/CTA/CTA.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -31,14 +31,14 @@ export const CTA = ({
3131
return (
3232
<div className={cn(ctaVariants(), className)} {...props}>
3333
{subheading && (
34-
<h5 className="mb-4 text-lg font-semibold text-gray-900 dark:text-gray-100 sm:text-xl md:text-2xl">
34+
<h5 className="mb-4 text-lg font-semibold text-gray-900 sm:text-xl md:text-2xl dark:text-gray-100">
3535
{subheading}
3636
</h5>
3737
)}
38-
<h2 className="mb-5 text-3xl font-bold text-gray-900 dark:text-gray-100 sm:text-4xl md:text-5xl">
38+
<h2 className="mb-5 text-3xl font-bold text-gray-900 sm:text-4xl md:text-5xl dark:text-gray-100">
3939
{heading}
4040
</h2>
41-
<p className="mx-auto mb-4 max-w-2xl text-muted-foreground">
41+
<p className="text-muted-foreground mx-auto mb-4 max-w-2xl">
4242
{description}
4343
</p>
4444
{actions && actions.length > 0 && (

‎starters/remix/app/components/blocks/CardGroup/CardGroup.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -41,17 +41,17 @@ export const CardGroup = ({
4141
<div className="container mx-auto">
4242
<div className="mb-12 text-center">
4343
{subheading && (
44-
<h5 className="mb-4 text-lg font-semibold text-gray-900 dark:text-gray-100 sm:text-xl md:text-2xl">
44+
<h5 className="mb-4 text-lg font-semibold text-gray-900 sm:text-xl md:text-2xl dark:text-gray-100">
4545
{subheading}
4646
</h5>
4747
)}
4848
{heading && (
49-
<h2 className="mb-5 text-3xl font-bold text-gray-900 dark:text-gray-100 sm:text-4xl md:text-5xl">
49+
<h2 className="mb-5 text-3xl font-bold text-gray-900 sm:text-4xl md:text-5xl dark:text-gray-100">
5050
{heading}
5151
</h2>
5252
)}
5353
{description && (
54-
<p className="mx-auto max-w-2xl text-muted-foreground">
54+
<p className="text-muted-foreground mx-auto max-w-2xl">
5555
{description}
5656
</p>
5757
)}

‎starters/remix/app/components/blocks/FAQ/FAQ.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -33,11 +33,11 @@ export const FAQ = ({
3333
}: FAQProps) => {
3434
return (
3535
<div className={cn(faqVariants(), className)} {...props}>
36-
<h2 className="mb-5 text-center text-3xl font-bold text-gray-900 dark:text-gray-100 sm:text-4xl md:text-5xl">
36+
<h2 className="mb-5 text-center text-3xl font-bold text-gray-900 sm:text-4xl md:text-5xl dark:text-gray-100">
3737
{heading}
3838
</h2>
3939
{description && (
40-
<p className="mb-8 text-center text-lg text-muted-foreground">
40+
<p className="text-muted-foreground mb-8 text-center text-lg">
4141
{description}
4242
</p>
4343
)}

‎starters/remix/app/components/blocks/Footer/Footer.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -52,11 +52,11 @@ export const Footer = ({
5252
<FooterColumn key={index} {...column} />
5353
))}
5454
</div>
55-
<div className="mt-12 flex flex-col items-center justify-between border-t border-border pt-8 md:flex-row">
55+
<div className="border-border mt-12 flex flex-col items-center justify-between border-t pt-8 md:flex-row">
5656
<div className="mb-4 md:mb-0">
5757
<img src={logo.src} alt={logo.alt} className="h-8 w-auto" />
5858
</div>
59-
<div className="text-sm text-muted-foreground">{copyrightText}</div>
59+
<div className="text-muted-foreground text-sm">{copyrightText}</div>
6060
</div>
6161
</div>
6262
</footer>

‎starters/remix/app/components/blocks/Header/Header.tsx‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -40,17 +40,17 @@ const MobileNavItem = ({ item }: { item: NavigationMenuItemProps }) => {
4040
<div>
4141
<button
4242
onClick={() => setIsOpen(!isOpen)}
43-
className="flex w-full items-center justify-between px-4 py-2 text-sm font-medium text-foreground hover:bg-accent hover:text-accent-foreground"
43+
className="text-foreground hover:bg-accent hover:text-accent-foreground flex w-full items-center justify-between px-4 py-2 text-sm font-medium"
4444
>
4545
{item.label}
4646
{isOpen ? (
47-
<ChevronUp className="h-4 w-4" />
47+
<ChevronUp className="size-4" />
4848
) : (
49-
<ChevronDown className="h-4 w-4" />
49+
<ChevronDown className="size-4" />
5050
)}
5151
</button>
5252
{isOpen && (
53-
<ul className="ml-4 border-l border-border">
53+
<ul className="border-border ml-4 border-l">
5454
{item.children.map((child, index) => (
5555
<MobileNavItem key={index} item={child} />
5656
))}
@@ -60,7 +60,7 @@ const MobileNavItem = ({ item }: { item: NavigationMenuItemProps }) => {
6060
) : (
6161
<a
6262
href={item.href ?? undefined}
63-
className="block w-full px-4 py-2 text-sm font-medium text-foreground hover:bg-accent hover:text-accent-foreground"
63+
className="text-foreground hover:bg-accent hover:text-accent-foreground block w-full px-4 py-2 text-sm font-medium"
6464
>
6565
{item.label}
6666
</a>
@@ -108,9 +108,9 @@ export const Header = ({
108108
onClick={() => setMobileMenuOpen(!mobileMenuOpen)}
109109
>
110110
{mobileMenuOpen ? (
111-
<X className="h-6 w-6" />
111+
<X className="size-6" />
112112
) : (
113-
<Menu className="h-6 w-6" />
113+
<Menu className="size-6" />
114114
)}
115115
</MobileMenuButton>
116116
</div>

‎starters/remix/app/components/blocks/Hero/Hero.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -34,10 +34,10 @@ export const Hero = ({
3434
<div className={cn(heroVariants(), className)} {...props}>
3535
<div className="container mx-auto grid items-center gap-8 lg:grid-cols-2">
3636
<div className="space-y-4 text-center lg:text-left">
37-
<h1 className="mb-6 text-4xl font-bold text-gray-900 dark:text-gray-100 sm:text-5xl md:text-6xl">
37+
<h1 className="mb-6 text-4xl font-bold text-gray-900 sm:text-5xl md:text-6xl dark:text-gray-100">
3838
{heading}
3939
</h1>
40-
<p className="mx-auto max-w-2xl text-lg text-muted-foreground lg:mx-0">
40+
<p className="text-muted-foreground mx-auto max-w-2xl text-lg lg:mx-0">
4141
{description}
4242
</p>
4343
{actions && actions.length > 0 && (

‎starters/remix/app/components/blocks/LogoGroup/LogoGroup.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ export const LogoGroup = ({
3434
return (
3535
<div className={cn(logoGroupVariants(), className)} {...props}>
3636
<div className="container mx-auto">
37-
<h2 className="mb-5 text-3xl font-bold text-gray-900 dark:text-gray-100 sm:text-4xl md:text-5xl">
37+
<h2 className="mb-5 text-3xl font-bold text-gray-900 sm:text-4xl md:text-5xl dark:text-gray-100">
3838
{heading}
3939
</h2>
4040
<div className="flex flex-wrap items-center justify-center gap-8 md:gap-12">

‎starters/remix/app/components/blocks/Testimonial/Testimonial.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ export const Testimonial = ({
4040
<Avatar src={author.avatar.src} name={author.name} />
4141
<div className="text-center">
4242
<p className="font-semibold">{author.name}</p>
43-
<p className="text-sm text-muted-foreground">
43+
<p className="text-muted-foreground text-sm">
4444
{author.position}, {author.company}
4545
</p>
4646
</div>

‎starters/remix/app/components/primitives/Avatar/Avatar.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,14 +12,14 @@ export interface AvatarProps {
1212
export const Avatar = ({ src, name }: AvatarProps) => {
1313
if (src) {
1414
return (
15-
<ShadcnAvatar className="mb-4 h-16 w-16">
15+
<ShadcnAvatar className="mb-4 size-16">
1616
<AvatarImage src={src} alt={name} />
1717
<AvatarFallback>{name.charAt(0)}</AvatarFallback>
1818
</ShadcnAvatar>
1919
)
2020
}
2121
return (
22-
<ShadcnAvatar className="mb-4 h-16 w-16">
22+
<ShadcnAvatar className="mb-4 size-16">
2323
<AvatarFallback>{name.charAt(0)}</AvatarFallback>
2424
</ShadcnAvatar>
2525
)

0 commit comments

Comments
 (0)