CCHub Logo CCHub Tailwind Collection
구성 요소 피드백 구성 요소 피드백 구성 요소

피드백 구성 요소

매력적인 애니메이션과 마이크로 상호 작용을 통합하는 반응형 피드백 구성 요소입니다. 다크 모드를 지원하도록 설계되었으며 자리 표시자 이미지 및 아바타와 함께 사용자 피드백을 위한 요소를 제공합니다.

미리 보기

HTML 코드 

<div class="flex flex-col items-center p-5 bg-white dark:bg-gray-800 rounded-lg shadow-lg">
  <h2 class="text-lg font-semibold dark:text-white mb-4">We Value Your Feedback!</h2>
  <div class="flex items-center mb-4">
    <img src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar" class="w-12 h-12 rounded-full shadow-md">
    <textarea class="ml-3 w-full h-24 p-2 border border-gray-300 dark:border-gray-600 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 transition-shadow duration-200 ease-in-out" placeholder="Share your thoughts..."></textarea>
  </div>
  <div class="flex justify-between w-full">
    <button class="bg-blue-600 text-white font-semibold py-2 px-4 rounded-md transition-transform transform hover:scale-105 duration-200 ease-in-out">Submit</button>
    <button class="bg-gray-300 text-gray-700 font-semibold py-2 px-4 rounded-md hover:bg-gray-400 transition-colors duration-200 ease-in-out dark:bg-gray-700 dark:text-white dark:hover:bg-gray-600">Cancel</button>
  </div>
  <p class="text-sm text-gray-500 dark:text-gray-400 mt-3">Your feedback helps us improve!</p>
</div>

관련 구성 요소

Memphis_Social_Media_Feedback_Component

Memphis 디자인이 따뜻한 중립 색상을 사용하여 영향을 미치는 간단하고 반응이 빠른 소셜 미디어 피드백 구성 요소에는 좋아요 버튼과 댓글 표시기가 있습니다. 다크 모드를 지원합니다.

열다

Feedback Components 구성 요소

소셜 미디어를 위한 간단한 Glassmorphism 피드백 구성 요소로, 트라이어딕 색 구성표, 반응형 디자인 및 어두운 테마 지원을 특징으로 합니다. JavaScript가 필요하지 않습니다.

열다

Feedback Components 구성 요소

복잡하고 반응이 빠르며 어두운 테마로 지원되는 피드백 구성 요소 구성 요소는 대시보드에 대해 제공되며, 미니멀리스트/플랫 미학과 파스텔 색상 구성표로 설계되었습니다. Tailwind CSS 클래스와 함께 HTML만 사용하여 진행률 표시줄, 상태 표시기 및 최근 활동과 같은 다양한 피드백 요소를 표시합니다.

열다