빠른 프로토 타이핑을 위해 설계된 구성 요소 및 유틸리티 중심 SCSS 프레임 워크. 아름다운 사전 제작 된 구성 요소를 사용하여 다음 프로젝트 및 유틸리티 클래스를 부트 스트랩하여 최종 디자인을 연마하십시오.
문서를 확인하십시오»
기능을 요청 / 버그 / 예제를보고합니다
Cirrus는 어떤 CSS 접두사에 의존합니까? 어떤 선택기가 접두사가 필요한지 결정합니다.
IE / 엣지 | 파이어 폭스 | 크롬 | 원정 여행 | 오페라 | 전자 |
|---|---|---|---|---|---|
| IE11, 가장자리 | 마지막 3 가지 버전, ESR | 마지막 3 버전 | 마지막 3 버전 | 마지막 3 버전 | 마지막 3 버전 |
npm install cirrus-uiyarn add cirrus-uiCDN의 경우 프로젝트의 일관성을 유지하기 위해 예기치 않은 업데이트를 피하기 위해 특정 버전을 URL에 첨부하는 것이 좋습니다.
dist Folder Artifacts를 직접 참조하지 마십시오. 언제든지 변경 될 수 있습니다.
< link rel =" stylesheet " href =" https://unpkg.com/cirrus-ui " > < link rel =" stylesheet " href =" https://www.jsdelivr.com/package/npm/cirrus-ui " >자세한 내용은 설정 안내서를 확인하십시오.
<!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 ,
)
)
),
);자세한 내용은 설정 안내서를 확인하십시오.
GitHub의 무료 온라인 개발 환경 인 GitPod를 사용하십시오.
또는 현지에서 복제 :
$ git clone [email protected]:Spiderpig86/Cirrus.git
$ cd cirrus
$ yarn install
$ yarn watchcore 및 ext 용 파일 빌드.| 프로젝트 | 설명 |
|---|---|
| vue-cirrus | 간단한 구문이있는 vue.js 용 Cirrus 구성 요소 |
| Cirrus-Blocks | 복사 및 붙여 넣을 준비가 된 Cirrus로 제작 된 아름다운 구성 요소 모음. |
| Cirrus-Reset | 간단한 CSS는 Cirrus에서 재설정됩니다. |
Cirrus는 MIT 라이센스에 따라 라이센스가 부여됩니다. 이 프레임 작업이 어떤 식 으로든 도움이된다면 웹 사이트의 바닥 글의 속성에 감사드립니다.
기고 가이드를 읽고 Cirrus를 함께 개선하십시오.
우리는 모든 기여를 환영합니다. 우리의 기고금 .md를 먼저 읽으십시오. 풀 요청 또는 GitHub 문제로 아이디어를 제출할 수 있습니다. 코드를 개선하려면 개발 지침을 확인하고 즐거운 시간을 보내십시오! :)
문제를 만들 때 선택한 문제 유형에 제공된 템플릿을 따르십시오. 추가 세부 사항과 서식을 통해 문제를 더 빨리 이해하고 해결하는 데 도움이됩니다.
이 프로젝트의 지속적인 개발에 대한 지원에 크게 감사드립니다. ?