From 8f35537bbf116ff6361b8daa9de6ec9aac3e2c48 Mon Sep 17 00:00:00 2001
From: Shubham Palriwala <spalriwalau@gmail.com>
Date: Tue, 3 Oct 2023 18:29:32 +0530
Subject: [PATCH] fix: smiley rating question now fits inside container (#839)

* fix: smily rating question fit inside container

* wip

* fix: make row center aligned
---
 packages/surveys/src/components/RatingQuestion.tsx | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/packages/surveys/src/components/RatingQuestion.tsx b/packages/surveys/src/components/RatingQuestion.tsx
index 5f6f07b975..58a346d26a 100644
--- a/packages/surveys/src/components/RatingQuestion.tsx
+++ b/packages/surveys/src/components/RatingQuestion.tsx
@@ -81,7 +81,7 @@ export default function RatingQuestion({
                 key={number}
                 onMouseOver={() => setHoveredNumber(number)}
                 onMouseLeave={() => setHoveredNumber(0)}
-                className="max-w-10 relative max-h-10 flex-1 cursor-pointer bg-white text-center text-sm leading-10">
+                className="max-w-10 relative flex max-h-10 flex-1 cursor-pointer justify-center bg-white text-center text-sm leading-10">
                 {question.scale === "number" ? (
                   <label
                     className={cn(
@@ -131,7 +131,11 @@ export default function RatingQuestion({
                     )}
                   </label>
                 ) : (
-                  <label className="flex h-full w-full justify-center text-slate-800">
+                  <label
+                    className={cn(
+                      "flex items-center justify-center  text-slate-800",
+                      question.range === 10 ? "h-6 w-6" : "h-full w-full"
+                    )}>
                     <HiddenRadioInput number={number} />
                     <RatingSmiley
                       active={value === number || hoveredNumber === number}