피드백 구성 요소

반응형 디자인, 어두운 테마 지원 및 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 구성 요소

포럼/커뮤니티 플랫폼을 위한 복잡한 머티리얼 디자인에서 영감을 받은 피드백 구성 요소로, 다양한 대화형 요소, 보색 구성표, 다크 모드 지원을 통한 완전한 응답성을 특징으로 합니다.

열다