피드백 구성 요소
반응형 디자인, 어두운 테마 지원 및 JavaScript 없음을 특징으로 하는 미니멀리스트 피드백 구성 요소입니다. 여기에는 아바타, 사용자 피드백 텍스트 및 별표로 표시되는 등급이 포함됩니다.
HTML 코드
<div class="max-w-md mx-auto p-6 bg-white rounded-lg shadow-md dark:bg-gray-800 transition-shadow duration-300 ease-in-out">
<div class="flex items-center mb-4">
<img class="w-12 h-12 rounded-full" src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar">
<div class="ml-4">
<h2 class="text-lg font-semibold text-gray-800 dark:text-white">John Doe</h2>
<span class="text-gray-500 dark:text-gray-400 text-sm">2 hours ago</span>
</div>
</div>
<div class="mb-4">
<div class="flex items-center">
<span class="text-yellow-500">
📍📍📍📍📍
</span>
<span class="text-gray-500 dark:text-gray-400 ml-2">Rating: 4.5/5</span>
</div>
</div>
<p class="text-gray-700 dark:text-gray-300">
This is a sample feedback message from the user. It highlights the positive aspects and any areas for improvement.
</p>
<div class="mt-4">
<img class="rounded-md" src="https://picsum.photos/400/200" alt="Feedback Image">
</div>
</div>
관련 구성 요소
Feedback Components 구성 요소
교육 플랫폼의 피드백 섹션을 위한 복잡한 트라이딕 색상의 다크 모드 UI로, 다양한 피드백 유형과 인터랙티브 요소를 제공합니다.
Feedback Components 구성 요소
포럼/커뮤니티 플랫폼을 위한 복잡한 머티리얼 디자인에서 영감을 받은 피드백 구성 요소로, 다양한 대화형 요소, 보색 구성표, 다크 모드 지원을 통한 완전한 응답성을 특징으로 합니다.