fix: rating input style on course details page

frontend/src/components/CourseCardOverlay.vue

@@ -116,7 +116,7 @@
 					v-if="parseInt(course.data.rating) > 0"
 					class="flex items-center text-ink-gray-9"
 				>
-					<Star class="h-4 w-4 stroke-1.5 fill-orange-500 text-gray-50" />
+					<Star class="size-4 stroke-1.5 fill-yellow-500 text-transparent" />
 					<span class="ml-2">
 						{{ course.data.rating }} {{ __('Rating') }}
 					</span>

frontend/src/components/CourseReviews.vue

@@ -35,14 +35,14 @@
 						<span class="text-ink-gray-7">
 							{{ review.creation }}
 						</span>
-						<div class="flex mt-2">
+						<div class="flex mt-2 space-x-1">
 							<Star
 								v-for="index in 5"
-								class="h-5 w-5 text-ink-gray-1 rounded-sm mr-2"
+								class="size-4 text-transparent rounded-sm"
 								:class="
 									index <= Math.ceil(review.rating)
-										? 'fill-orange-500'
-										: 'fill-gray-600'
+										? 'fill-yellow-500'
+										: 'fill-gray-300'
 								"
 							/>
 						</div>

frontend/src/components/Modals/ReviewModal.vue

@@ -15,26 +15,20 @@
 	>
 		<template #body-content>
 			<div class="flex flex-col gap-4">
-				<div>
-					<div class="mb-1.5 text-sm text-ink-gray-5">
-						{{ __('Rating') }}
-					</div>
-					<Rating v-model="review.rating" />
-				</div>
-				<div>
-					<div class="mb-1.5 text-sm text-ink-gray-5">
-						{{ __('Review') }}
-					</div>
-					<Textarea type="text" size="md" rows="5" v-model="review.review" />
-				</div>
+				<Rating v-model="review.rating" :label="__('Rating')" />
+				<FormControl
+					:label="__('Review')"
+					type="textarea"
+					v-model="review.review"
+					:rows="5"
+				/>
 			</div>
 		</template>
 	</Dialog>
 </template>
 <script setup>
-import { Dialog, Textarea, createResource, toast } from 'frappe-ui'
+import { Dialog, FormControl, createResource, toast, Rating } from 'frappe-ui'
 import { reactive } from 'vue'
-import Rating from '@/components/Controls/Rating.vue'
 
 const show = defineModel()
 const reviews = defineModel('reloadReviews')