rankrunners-dev/next-cochise
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: google review text styling

Browse Source
This commit is contained in:
RizqiSyahrendra 2025-03-10 23:25:27 +07:00
parent ad39804e06
commit 9bfe2fc700
3 changed files with 9 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/Blocks/GoogleReviews/GoogleReviews.tsx
View File

@ -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">

7
src/components/Ratings/CardStarRating.tsx
View File

@ -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>
); );
} }

3
src/utils/general.ts
View File

@ -0,0 +1,3 @@
export function limitString(text: string) {
return `${text.length > 100 ? `${text.slice(0, 100)}...` : text}`;
}