Cirrus
Gamma 8
Ein Komponenten-und-utilitätszentrierter SCSS-Framework für schnelle Prototypen. Verwenden Sie schöne vorgefertigte Komponenten, um Ihr nächstes Projekt- und Dienstprogrammklassen zu starten, um Ihr endgültiges Design zu polieren.
Schauen Sie sich die Dokumente an »
Anforderungsfunktion / melden Sie einen Fehler / Beispiele
Cirrus ist darauf angewiesen, welches CSS vor dem Präfix? Um zu bestimmen, welche Selektoren Präfixe benötigen.
Dh / rande | Firefox | Chrom | Safari | Oper | Elektron |
|---|---|---|---|---|---|
| IE11, Edge | Letzte 3 Versionen, ESR | Letzte 3 Versionen | Letzte 3 Versionen | Letzte 3 Versionen | Letzte 3 Versionen |
npm install cirrus-uiyarn add cirrus-uiFür CDNs wird empfohlen, eine bestimmte Version an den URLs anzuhängen, um unerwartete Updates zu vermeiden, um die Konsistenz in Ihrem Projekt aufrechtzuerhalten.
Bitte verweisen Sie nicht auf die Artefakte von dist -Ordner direkt, da diese jederzeit geändert werden können.
< link rel =" stylesheet " href =" https://unpkg.com/cirrus-ui " > < link rel =" stylesheet " href =" https://www.jsdelivr.com/package/npm/cirrus-ui " >Weitere Informationen finden Sie im Setup -Handbuch.
<!DOCTYPE html >
< html >
< head >
< title > Hello World </ title >
< meta name =" viewport " content =" width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0 " />
< meta charset =" UTF-8 " />
< meta http-equiv =" X-UA-Compatible " content =" IE=edge; " />
< link href =" https://unpkg.com/cirrus-ui " type =" text/css " rel =" stylesheet " />
< link href =" https://fonts.googleapis.com/css?family=Nunito+Sans:200,300,400,600,700 " rel =" stylesheet " />
< link href =" https://fonts.googleapis.com/css?family=Montserrat:400,700 " rel =" stylesheet " />
</ head >
< body >
< h1 > Hello World </ h1 >
</ body >
</ html > import { StrictMode } from "react" ;
import ReactDOM from "react-dom" ;
import App from "./App" ;
import 'cirrus-ui' ; // You can import it here if you want
const rootElement = document . getElementById ( "root" ) ;
ReactDOM . render (
< StrictMode >
< App />
</ StrictMode > ,
rootElement
) ; import Vue from 'vue' ;
import App from './App.vue' ;
import 'cirrus-ui' ;
Vue . config . productionTip = false ;
new Vue ( {
render : ( h ) => h ( App ) ,
} ) . $mount ( '#app' ) ; import App from "./App.svelte" ;
import "cirrus-ui" ;
const app = new App ( {
target : document . body
} ) ;
export default app ; @use " node_modules/cirrus-ui/src/cirrus-ext " as * with (
$config : (
excludes: (
ABSOLUTES,
),
opacity : null, // Disable default opacity classes
extend: (
// Add your own
opacity : (
25 : .25 ,
50 : .5 ,
75 : .75 ,
)
)
),
);Weitere Informationen finden Sie im Setup -Handbuch.
Verwenden Sie Gitpod, eine kostenlose Online -Entwicklerumgebung für GitHub.
Oder vor Ort klonen:
$ git clone [email protected]:Spiderpig86/Cirrus.git
$ cd cirrus
$ yarn install
$ yarn watchcore und ext .| Projekt | Beschreibung |
|---|---|
| Vue-Cirrus | Cirrus -Komponenten für Vue.js mit unkomplizierter Syntax |
| Zirrus-Blocks | Eine Sammlung wunderschöner Komponenten, die mit Cirrus gebaut wurden, die zum kopierten und geklebt werden. |
| Cirrus-Reset | Ein einfaches CSS -Rücksetzen von Cirrus. |
Cirrus ist unter der MIT -Lizenz lizenziert. Wenn Ihnen diese Rahmenarbeit in irgendeiner Weise geholfen hat, wäre die Zuordnung in der Fußzeile Ihrer Website sehr geschätzt.
Lesen Sie unseren beitragenden Leitfaden und verbessern Sie Cirrus gemeinsam.
Wir begrüßen alle Beiträge. Bitte lesen Sie zuerst unseren Beitrag.md. Sie können alle Ideen als Pull -Anfragen oder als GitHub -Probleme einreichen. Wenn Sie den Code verbessern möchten, lesen Sie die Entwicklungsanweisungen und haben Sie eine gute Zeit! :)
Befolgen Sie beim Erstellen von Problemen die Vorlagen, die für den von Ihnen ausgewählten Problemtyp bereitgestellt wurden. Das hinzugefügte Detail und die Formatierung helfen mir, Ihr Problem schneller zu verstehen und zu lösen.
Ich würde jede Unterstützung für die fortgesetzte Entwicklung dieses Projekts sehr schätzen. ?
