vue kaiui

Kaios 앱 용 Vue 구성 요소 라이브러리.

• 설치
• 용법
  • 구성 요소 API
  • 스타일
• 상태
  • 구성 요소
  • 항해
  • 타이포그래피
  • 여러 가지 잡다한
• 스타일링, 색상, 글꼴
• 아이콘
• 기여

설치

 npm install vue-kaiui

main.js 추가

 import Vue from 'vue'
import App from './App.vue'

import VueKaiUI from "vue-kaiui" ; // !
Vue . use ( VueKaiUI ) // !

new Vue ( {
  render : h => h ( App ) ,
} ) . $mount ( '#app' )

용법

가장 중요한 것은 모든 구성 요소를 <kaiui-content> 루트에 넣어 Kaiui가 모든 소프트 키 및 헤더 디자인 요소를 관리 할 수 ​​있도록하는 것입니다.

구성 요소 API

사용 예제는 구성 요소 API 문서 및 샘플 앱을 참조하십시오.

스타일

:root 범위를 사용하여 스타일에서 CSS 변수를 간단히 재정의 할 수 있습니다. 모든 테마 CSS 변수는 여기에 있습니다.

<style >

: root{
  - - primary - col or : red; 
  - - primary - dark - col or : darkred;
  ...
  --tabbar-tabs-selected-color : blue;
  ...
}

< / style >

상태

기고를 참조하십시오.

구성 요소

• 헤더
• 꼬리표
• 소프트웨어 키
• 목록 항목
• 분리 기호
• 확인란
• 단추
• 입력
• 다중 라인 입력
• 토스트
• 라디오 버튼 (그룹)
• 진전
• 슬라이더 (업데이트 디자인!)
• 날짜/시간 값 선택기
• 대화 / 값 선택기 / 옵션 메뉴
• 알아채다

항해

• 목록보기
• 탭보기
• 그리드보기

타이포그래피

• 글꼴
• 이오니콘 아이콘

여러 가지 잡다한

• 테마
• 번역
• 대단히
• 초상화/조경 모드

스타일링, 색상, 글꼴

타이포그래피 세부 사항은 여기에서 찾을 수 있습니다.

표준화 된 스타일, 색상 및 글꼴은 자산 디렉토리에 있습니다.

아이콘

Vue Kaiui는 멋진 Ionicons 아이콘을 사용합니다.

아이콘은 자산 디렉토리에 있습니다.

기여

더 많은 UI 구성 요소를 구축하고 테스트 작성 등을 구축하는 데 필요한 작업이 많이 있습니다.

현재 열린 문제와 기여 가이드를 살펴보십시오.

프로젝트 실행을 구축하고 테스트하려면 :

npm install

npm run build

프로젝트를 구축하고 API 문서를 만들려면 다음을 수행합니다.

npm run release

---

영감을 주신 Adrian Machado에게 감사드립니다. 그의 멋진 Kaiui (Kaios 앱의 React 구성 요소 라이브러리)를 확인하십시오.

---