/Cirrus

:cloud: The CSS framework for the modern web.

Primary LanguageCSSMIT LicenseMIT

Cirrus

Build Status v.0.5.4 MIT License

A fully responsive CSS and UI framework with custom design controls and simplistic structure. A components are customizable and work with your CSS.

Framework Components

  • Animations
    • Consists of animations that will work with the controls.
  • Buttons
    • Styles for the button with 3 different variations.
  • Cards
    • Base for card controls.
  • Code
    • Style for code markup blocks.
  • Default (Base)
    • The core of this framework.
  • Frames
    • A more flexible version of a Card with a basic structure system. This is shown in the Layout documentation.
  • Font
    • All text styles for this framework for headers, articles, blockquotes, and paragraphs.
  • Footer
    • Basic styles for setting up a page footer.
  • Forms
    • Form styles for textboxes, textfields, selects, and layout.
  • Header
    • Styles for header elements including drop down menus.
  • Layout
    • Rules for grids, item alignment, and layout borders.
  • Links
    • Link styles with different effects.
  • Lists
    • A simple stylesheet to simplify list UI.
  • Media
    • Rules for styling images, videos, figures, avatars, and other media components.
  • Modal
    • Styles for a pop up modal dialog.
  • Placeholder
    • A padded generic container to display additional information.
  • Tables
    • Clean designs for tables.
  • Toast
    • A small overaly notification for websites.
  • Util
    • Designed to solve many common headaches with CSS.

Why not other frameworks?

Even with a multitude of CSS frameworks, some are either too basic to develop more complex websites and some are too bogged down with a lot of styles that don't end up getting used. Cirrus is meant to bridge a gap between boilerplate stylesheets and UI frameworks.

Getting Started

Install with npm

npm install cirrus-ui

Install with Yarn

yarn add cirrus-ui

Link

https://unpkg.com/cirrus-ui

Supported Browsers

  • Chrome
  • Opera
  • Firefox
  • Safari
  • Edge (Untested)
  • Internet Explorer (Untested)

Examples that use Cirrus

License and Attribution

Cirrus is licensed under the MIT license. If this frame work has helped you in any way, attribution in the footer of your website would be much appreciated.