====== 버튼 퍼블리싱 기본 ======
버튼 퍼블리싱에 관련된 기본 정보를 제공한다.

버튼 컴포넌트는 클릭시 동작을 수행하기 위한 기능을 제공한댜.

===== 버튼 아키텍처 =====
버튼 컴포넌트는 배경, 경계선등을 처리하기 위한 BUTTON 요소와
BUTTON 내부에 배경 이미지를 표시하기 위한 DIV 요소와
DIV 요소 내부에 문자열을 표시히가 위한 SPAN 요소로 구성된다.

===== 버튼 생성과 삭제 =====
==== 버튼 생성 ====
버튼 생성 방법은 아래와 같다.
  * "컴포넌트"창 이용 방법
    - "컴포넌트" 창에서 "버튼" 컴포넌트 선택
    - 화면 캔버스내 생성 위치를 클릭(컴포넌트 초기값 설정에 설정된 크기로 생성됨)
    - 표시할 문자열 지정 방법
      * 생성된 버튼 컴포넌트를 선택하고, "속성"창의 "text" 속성 값 설정
      * 생성된 버튼 컴포넌트를 더블클릭하고, 텍스트를 편집하여 설정

==== 버튼 삭제 ====
버튼 삭제는 아래의 방법중 한가지를 사용합니다.
  * 버튼 클릭후, 키보드 <DELETE> 입력
  * 버튼 클릭후, 키보드 <CONTROL> + "D" 입력
  * 버튼 우클릭후, 컨텍스트 메뉴에서 "삭제" 메뉴 선택

===== 버튼 주요 속성 =====
버튼 컴포넌트 주요 속성은 아래와 같다.

|<100% 160px ->|
^ 용어 ^ 설명 ^
| text | 표시할 문자열 |
| style_class | CSS 속성이 미리 정의된 버튼 CSS 클래스 유형(아래 내용 참조) |
| font | 문자열에 적용될 폰트 정보 |
| fore_color | 문자열 표시에 적용될 색상 |
| horz_align | 문자열 수평 정렬 방식 |
| text_margin | 문자열 외부 여백 |

==== style_class 속성 ====
속성값이 "0:none"이 아닌 경우 아래의 속성값은 무시된다.

|<100% 160px ->|
^ 용어 ^ 설명 ^
| fore_color | 문자열 색상 |
| border_color | 경계선 색상 |
| transparent | 배경색 투명 여부 |
| back_color | 배경 색상색 |
| back_color_opacity | 배경 색상 투명도 유형 |
| back_image | 배경 이미지 경로 |
| gradient_effect | 배경 그라데이션 적용 유형 |
| gradient_startcolor | 배경 그라데이션 시작 색샹 |
| gradient_endcolor | 배경 그라데이터 종료 색상 |

===== 버튼 이미지 설정 =====
버튼 컴포넌트 내부에 이미지를 설정하는 방법은 아래와 같다.

|<100% 160px ->|
^ 용어 ^ 설명 ^
| image_show | 이미지 표시 여부 |
| image_normal | 일반 상태(포커스를 가지지 않고, 마우스가 올려져 있지 않은)에 표시할 이미지 경로 |
| image_focus | 포커스된 상태에 표시할 이미지 경로 |
| image_disable | 비활성된 상태에 표시할 표시할 이미지 경로 |
| image_down | 눌린 상태에 표시할 이미지 경로 |
| image_hover | 마우스가 올려져만 있는 상태별 표시할 이미지 경로 |
| imagesize | 이미지 크기 타입 |
| image_horz_align | 이미지 수평 정렬 유형 |
| image_vert_align | 이미지 수직 정렬 유형 |
| image_margin | 이미지 수평/수직 정렬 기준으로 이미지 외부 여백 간격 |

===== 웹 아이콘 폰트 설정 =====
버튼 텍스트에 웹 아이콘 폰트를 설정하는 방법은 아래와 같다.

|<100% 160px ->|
^ 용어 ^ 설명 ^
| text_prefixicon_class | Font Awesome과 같이 클래스 기반 웹 폰트 사용시, 버튼 텍스트 앞 아이콘에 적용될 사용자 정의 클래스 이름 |
| text_postfixicon_class | Font Awesome과 같이 클래스 기반 웹 폰트 사용시, 버튼 텍스트 뒤 아이콘에 적용될 사용자 정의 클래스 이름 |
| text_prefixicon_text | Google Material Symbols 웹 폰트 사용시, 버튼 텍스트 앞 아이콘에 적용될 텍스트 |
| text_postfixicon_text | Google Material Symbols 웹 폰트 사용시, 버튼 텍스트 뒤 아이콘에 적용될 텍스트 |