refactor: adjust spacing in CarouselSection and CategorySection for improved layout
This commit is contained in:
parent
ee816b8db7
commit
9f82779456
@ -84,7 +84,7 @@ export const CarouselSection = (properties: TNews) => {
|
|||||||
className="embla__slide w-full min-w-0 flex-none sm:w-1/3"
|
className="embla__slide w-full min-w-0 flex-none sm:w-1/3"
|
||||||
key={index}
|
key={index}
|
||||||
>
|
>
|
||||||
<div className="flex flex-col justify-between">
|
<div className="flex flex-col justify-between gap-3">
|
||||||
<img
|
<img
|
||||||
className="aspect-[174/100] max-h-[280px] w-full rounded-md object-cover sm:aspect-[5/4]"
|
className="aspect-[174/100] max-h-[280px] w-full rounded-md object-cover sm:aspect-[5/4]"
|
||||||
src={featured}
|
src={featured}
|
||||||
|
|||||||
@ -54,7 +54,7 @@ export const CategorySection = (properties: TNews) => {
|
|||||||
) => (
|
) => (
|
||||||
<div
|
<div
|
||||||
key={index}
|
key={index}
|
||||||
className={twMerge('grid sm:gap-x-8')}
|
className={twMerge('grid gap-3 sm:gap-x-8')}
|
||||||
>
|
>
|
||||||
<img
|
<img
|
||||||
className={twMerge(
|
className={twMerge(
|
||||||
|
|||||||
@ -11,9 +11,7 @@ type TProperties = {
|
|||||||
export const Tags = (properties: TProperties) => {
|
export const Tags = (properties: TProperties) => {
|
||||||
const { tags, is_premium, className } = properties
|
const { tags, is_premium, className } = properties
|
||||||
return (
|
return (
|
||||||
<div
|
<div className={twMerge('flex gap-2 uppercase max-sm:text-sm', className)}>
|
||||||
className={twMerge('my-3 flex gap-2 uppercase max-sm:text-sm', className)}
|
|
||||||
>
|
|
||||||
{tags?.map((tag) => (
|
{tags?.map((tag) => (
|
||||||
<span
|
<span
|
||||||
key={tag.id}
|
key={tag.id}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user