SEED Design

Manner Temp

Manner Temp는 당근의 매너 온도를 시각적으로 표현하는 컴포넌트입니다. 사용자의 신뢰도와 거래 매너를 직관적으로 보여줄 때 사용됩니다.

import { VStack } from "@seed-design/react";
import { MannerTemp } from "seed-design/ui/manner-temp";

export default function MannerTempPreview() {
  return (
    <VStack gap="x1" align="flex-end">
      <MannerTemp temperature={12.5} />
      <MannerTemp temperature={30} />
      <MannerTemp temperature={36} />
      <MannerTemp temperature={36.5} />
      <MannerTemp temperature={37} />
      <MannerTemp temperature={40} />
      <MannerTemp temperature={45} />
      <MannerTemp temperature={55} />
      <MannerTemp temperature={65} />
      <MannerTemp temperature={80} />
    </VStack>
  );
}

Installation

npx @seed-design/cli@latest add ui:manner-temp

Props

Prop

Type

Last updated on

On this page

Installation
Props