vue kaiui

Vue -Komponentenbibliothek für Kaios -Apps.

• Installation
• Verwendung
  • Komponenten API
  • Stile
• Status
  • Komponenten
  • Navigation
  • Typografie
  • Verschiedenes
• Styling, Farben, Schriftarten
• Ikonen
• Beitragen

Installation

 npm install vue-kaiui

In Ihrem main.js hinzufügen

 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' )

Verwendung

Stellen Sie vor allem alle Komponenten in die Wurzel <kaiui-content> ein, damit Kaiui alle Softkeys und Header-Designelemente für Sie verwalten kann.

Komponenten API

In den API -Dokumenten der Komponenten und der Beispiel -App finden Sie Nutzungsbeispiele.

Stile

Sie können CSS -Variablen einfach in Ihren Stilen überschreiben :root Alle Themen -CSS -Variablen finden Sie hier.

<style >

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

< / style >

Status

Siehe Beitrag.

Komponenten

• Kopfball
• Tab
• Softwareschlüssel
• Listenelement
• Separator
• Kontrollkästchen
• Taste
• Eingang
• Multiple-Line-Eingang
• Toast
• Optionsknopf (Gruppe)
• Fortschritt
• Slider (Update -Design!)
• Datum/Zeitwertauswahl
• Menü Dialog- / Value Selector / Option
• Beachten

Navigation

• Listenansicht
• Registerkartenansicht
• Netzansicht

Typografie

• Schriftarten
• Ionicons Ikonen

Verschiedenes

• Themen
• Übersetzung
• Fargetext
• Porträt-/Landschaftsmodus

Styling, Farben, Schriftarten

Typografiedetails finden Sie hier.

Im Vermögensverzeichnis finden sich standardisierte Stile, Farben und Schriftarten.

Ikonen

Vue Kaiui verwendet die fantastischen Ionicons -Ikonen.

Ikonen finden sich im Verzeichnisverzeichnis.

Beitragen

Es gibt viel Arbeit, um mehr UI -Komponenten auszubauen, Tests zu schreiben usw.

Bitte sehen Sie sich die aktuell offenen Ausgaben und unseren beitragenden Leitfaden an.

Um den Projektlauf zu erstellen und zu testen:

npm install

npm run build

Um das Projekt zu erstellen und API -Dokumente zu erstellen: Run:

npm run release

---

Danke Adrian Machado für die Inspiration. Schauen Sie sich seine fantastische Kaiui (React Component Library für Kaios Apps) an.

---