Cirrus
Gamma 8
เฟรมเวิร์ก SCSS ส่วนประกอบและยูทิลิตี้เป็นศูนย์กลางที่ออกแบบมาสำหรับการสร้างต้นแบบอย่างรวดเร็ว ใช้ส่วนประกอบที่สร้างไว้ล่วงหน้าที่สวยงามเพื่อบูตโปรเจ็กต์โครงการต่อไปและคลาสยูทิลิตี้ของคุณเพื่อขัดเกลาการออกแบบขั้นสุดท้ายของคุณ
ตรวจสอบเอกสาร»
ขอคุณสมบัติ / รายงานข้อผิดพลาด / ตัวอย่าง
Cirrus ขึ้นอยู่กับสิ่งที่ CSS เป็นคำนำหน้า? เพื่อพิจารณาว่าตัวเลือกใดจำเป็นต้องใช้คำนำหน้า
เช่น / ขอบ | Firefox | โครเมี่ยม | ซาฟารี | โอเปร่า | อิเล็กตรอน |
|---|---|---|---|---|---|
| IE11, EDGE | 3 เวอร์ชันล่าสุด ESR | 3 เวอร์ชันล่าสุด | 3 เวอร์ชันล่าสุด | 3 เวอร์ชันล่าสุด | 3 เวอร์ชันล่าสุด |
npm install cirrus-uiyarn add cirrus-uiสำหรับ CDN ขอแนะนำให้แนบเวอร์ชันเฉพาะเข้ากับ URL เพื่อหลีกเลี่ยงการอัปเดตที่ไม่คาดคิดเพื่อรักษาความสอดคล้องในโครงการของคุณ
โปรดอย่าอ้างอิงสิ่งประดิษฐ์โฟลเดอร์ dist โดยตรงเนื่องจากอาจมีการเปลี่ยนแปลงได้ตลอดเวลา
< 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 ,
)
)
),
);ตรวจสอบคู่มือการตั้งค่าสำหรับข้อมูลเพิ่มเติม
ใช้ gitpod สภาพแวดล้อม dev ออนไลน์ฟรีสำหรับ gitHub
หรือโคลนในพื้นที่:
$ git clone [email protected]:Spiderpig86/Cirrus.git
$ cd cirrus
$ yarn install
$ yarn watchcore และ ext| โครงการ | คำอธิบาย |
|---|---|
| Vue-cirrus | ส่วนประกอบ Cirrus สำหรับ vue.js ด้วยไวยากรณ์ตรงไปตรงมา |
| ตึกดำบ | คอลเลกชันของส่วนประกอบที่สวยงามที่สร้างขึ้นด้วย Cirrus พร้อมที่จะคัดลอกและวาง |
| ม่านตา | CSS ง่าย ๆ รีเซ็ตจาก Cirrus |
Cirrus ได้รับใบอนุญาตภายใต้ใบอนุญาต MIT หากเฟรมนี้ช่วยคุณได้ แต่อย่างใดการระบุแหล่งที่มาในส่วนท้ายของเว็บไซต์ของคุณจะได้รับการชื่นชมมาก
อ่านคู่มือการสนับสนุนของเราและปรับปรุง Cirrus ด้วยกัน
เรายินดีต้อนรับการมีส่วนร่วมทั้งหมด โปรดอ่านการสนับสนุนของเราก่อน คุณสามารถส่งแนวคิดใด ๆ เป็นคำขอดึงหรือเป็นปัญหา GitHub หากคุณต้องการปรับปรุงรหัสให้ตรวจสอบคำแนะนำการพัฒนาและมีช่วงเวลาที่ดี! -
เมื่อสร้างปัญหาโปรดติดตามเทมเพลตที่ให้ไว้สำหรับประเภทปัญหาที่คุณเลือก รายละเอียดและการจัดรูปแบบเพิ่มเติมจะช่วยให้ฉันเข้าใจและแก้ไขปัญหาของคุณได้เร็วขึ้น
ฉันขอขอบคุณการสนับสนุนอย่างต่อเนื่องสำหรับการพัฒนาโครงการนี้อย่างต่อเนื่อง -
