fix: google review text styling
This commit is contained in:
parent
ad39804e06
commit
9bfe2fc700
@ -32,9 +32,9 @@ export function GoogleReviews({ data }: GoogleReviewProps) {
|
|||||||
<div className="flex justify-center items-center space-x-2">
|
<div className="flex justify-center items-center space-x-2">
|
||||||
<h2 className="text-xl text-center font-bol mt-[15px]">{data.ratingValue}</h2>
|
<h2 className="text-xl text-center font-bol mt-[15px]">{data.ratingValue}</h2>
|
||||||
<div className="mt-1">
|
<div className="mt-1">
|
||||||
<StarRating size={20} value={data.ratingValue} />
|
<StarRating size={30} value={data.ratingValue} />
|
||||||
</div>
|
</div>
|
||||||
<div className="text-xs font-medium">Over {data.totalRating} Reviews</div>
|
<div className="font-medium">Over {data.totalRating} Reviews</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="mt-20 relative">
|
<div className="mt-20 relative">
|
||||||
|
@ -1,5 +1,6 @@
|
|||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
import StarRating from "./StarRating";
|
import StarRating from "./StarRating";
|
||||||
|
import { limitString } from "@/utils/general";
|
||||||
|
|
||||||
export interface CardStarRatingProps {
|
export interface CardStarRatingProps {
|
||||||
data: {
|
data: {
|
||||||
@ -12,10 +13,10 @@ export function CardStarRating({ data }: CardStarRatingProps) {
|
|||||||
return (
|
return (
|
||||||
<div className="bg-white p-2 rounded-lg shadow-md">
|
<div className="bg-white p-2 rounded-lg shadow-md">
|
||||||
<div className="flex justify-between">
|
<div className="flex justify-between">
|
||||||
<StarRating size={20} value={data.star} />
|
<StarRating size={30} value={data.star} />
|
||||||
<Image src="/assets/images/google-provider.svg" width={20} height={20} alt="" />
|
<Image src="/assets/images/google-provider.svg" width={30} height={30} alt="" />
|
||||||
</div>
|
</div>
|
||||||
<p className="text-xs pl-1 mt-4">{data.description}</p>
|
<p className="p-1 mt-4 text-[22px]">{limitString(data.description)}</p>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -0,0 +1,3 @@
|
|||||||
|
export function limitString(text: string) {
|
||||||
|
return `${text.length > 100 ? `${text.slice(0, 100)}...` : text}`;
|
||||||
|
}
|
Loading…
x
Reference in New Issue
Block a user