/react-spectre

React components for Spectre.css - a Lightweight, Responsive and Modern CSS Framework

Primary LanguageJavaScriptMIT LicenseMIT

react-spectre

React components for Spectre.css - a Lightweight, Responsive and Modern CSS Framework

lerna Build Status




This project is under development.

Not ready for production use.




Packages

Elements

Package Size (min+gzip) 1 Components
Elements 3.98 kB Contains all subsequent elements packages.
Typography 1.67 kB H1, H2, H3, H4, H5, H6, Label.
Table 1.67 kB Table, Header, Body, Row, Heading, Cell.
Button 1.74 kB Button, Group.
Form 1.82 kB FormGroup, Input, TextArea, Select, Radio, CheckBox, Switch.
Icon 1.49 kB Icon.
Label 1.6 kB Label.
Media 1.82 kB Image, Figure, Video, Container.

Layout

Package Size (min+gzip) 1 Components
Layout 2.07 kB Contains all subsequent layout packages.
Grid 1.77 kB Grid, Row, Col.
Navbar 1.59 kB Navbar, Section, Brand.

Components

Package Size (min+gzip) 1 Components
Components 3.11 kB Contains all subsequent components packages.
Accordion 1.6 kB Accordion, Header, Body.
Autocomplete 1.58 kB Autocomplete, Input, Menu.
Avatar 1.75 kB Avatar, Icon, Presence.
Badge 1.4 kB Badge.
Bar 1.75 kB Bar, Slider.
Toast 1.62 kB Toast.

Note: 1 the gzipped size of the UMD build.




Development

It is recommended to use yarn for easy development.

Setup

  1. yarn or npm install
  2. yarn lerna -- bootstrap o npm run lerna -- bootstrap

Creating a new package

The script way:

yarn package:create -- <name-of-package>

The manual way:

  1. Create a directory inside packages.
  2. Copy LICENSE file from another package.
  3. Copy README.md file from another package and modify it.
  4. Copy assets directory from another package.
  5. Run yarn init or npm package (don't worry for the version, it will be overriden on publishing).
  6. Modify the package.json file and add { "publishConfig": { "access": "public" } } (this allow the package to be published with lerna as scoped package).




Roadmap




Made with ❤️ by Rubens Mariuzzo.

MIT License