## cinnamon 관리자 가이드

기존 화면 + 추가 화면에서 공통으로 사용하는 컴포넌트에 대한 가이드입니다

### 버튼

### btn_wrap(공통으로 사용 버튼그룹 클래스 : 블록)

위로 아래로

### 상태[버튼아님]

자동접수 중도포기

### 태그 버튼

멍멍아
멍멍아

### 텍스트 정렬 (사용시 .border 삭제)

float:left
float:right
왼쪽정렬
오른쪽정렬
가운데 정렬

### 정렬 2 display: flex; (사용시 .border 삭제)

좌측 정렬

우측 정렬

양쪽 정렬

양쪽 정렬

가운데 정렬

### 공통 타이틀

## 시뮬레이터 관리

시뮬레이터 관리

### 폰트 사이즈

font-size-14px

font-size-16px

font-size-18px

font-size-20px

### 폰트 굵기

font-weight-light

font-weight-normal

### 로더

### 보더

border-top
border-top 1px
border-bottom 1px
border
border-container

### 패딩

- n : 0~ 9까지의 숫자
- padding-bottom >> .pb-{{n}}
- padding-top >> .pt-{{n}}
- padding x축 >> .px-{{n}}
- padding y축 >> .py-{{n}}
- padding >> .p-{{n}}

### 마진

- n : 0~ 9까지의 숫자
- margin-bottom >> .pb-{{n}}
- margin-top >> .mt-{{n}}
- margin x축 >> .mx-{{n}}
- margin y축 >> .my-{{n}}
- margin >> .m-{{n}}

### .row .col-

- col 간에 간격 없앨 경우 .row.no-gutters
- col-{{숫자}}
- col-auto

### 테이블1 .edit 클래스 추가

왼쪽 정렬 | (테이블 내에서만 사용가능)
가운데 정렬 | (테이블 내에서만 사용가능)

### 테이블2 .search 클래스 추가

왼쪽 정렬 | (테이블 내에서만 사용가능)
가운데 정렬 | (테이블 내에서만 사용가능)

### 테이블5 부트스트랩 데이터 테이블 구조(페이지 네이션이 필요한데 쏠팅이 필요없을때 쓰는거 같아요!

### 테이블3
업앤다운 기능 때문에 table태그 사용 아니에요

- 선택
- 대표어
- 동의어

- No data available in table
  멍멍아
  에이씨
  나쁜 사람
  멍멍아
  멍멍아
  에이씨
  나쁜 사람

위로 아래로
저장

### 테이블4
태이블 태그 사용 클릭효과 click 추가

전화번호 | 시나리오 | 통화시간 | 총 통화시간
--- | --- | --- | ---
1 | 2 | 3 | 4

### 스크롤 영역1

스크롤 생겨야 할영역
height: calc(100vh - 208px);
min-height: 600px;로 정의 되어있음
높이 조절 해줘야함
안에 테이블을 넣어도 됨.
더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미더ㅁ미

### 스크롤 영역2

스크롤 생겨야 할영역
보더 양옆 없음
min-height: 425px;
height: calc(100vh - 381px);
높이 조절 해줘야함
안에 테이블을 넣어도 됨.

### 폼

~
파일선택