Skip to main content

File & folder structure

Directories and Files​

Find out what's inside Ravenbright CSS library source code and how Ravenbright is structured. Ravenbright contains 2 folders and 1 main CSS file in root folder:

  • dist ─── The folder which contains the minified CSS output
  • src ─── The folder which contains all CSS source code (utilities, components & CSS variables)
  • main.css ─── The CSS file which acts as entry point & import all other CSS files

Ravenbright General Folder Tree Structure​

├── dist
│   ├── ravenbright.min.css
│   └── ravenbright-dark.min.css
├── src/
│   ├── components/
│   ├── utilities/
│   ├── reset.css
│   └── css-variable.css
│   └── css-variable-dark.css
└── main.css
└── index.html
└── license.md
└── readme.md
└── package.json

Ravenbright CSS Folder Tree Structure​

├── src/
│   ├── reset.css
│   ├── css-variable.css
│   └── css-variable-dark.css
│   ├── components/
│   │   ├── alert.css
│   │   ├── accordion.css
│   │   ├── avatar.css
│   │   ├── badge.css
│   │   ├── button.css
│   │   ├── blockquote.css
│   │   ├── checkbox.css
│   │   ├── divider.css
│   │   ├── empty-state.css
│   │   ├── text-field.css
│   │   ├── radio.css
│   │   ├── tabs.css
│   │   └── table.css
│   ├── utilities/
│   │   ├── light-mode/
│   │   │       ├── bg-color.css
│   │   │       ├── border.css
│   │   │       └── color.css
│   │   ├── dark-mode/
│   │   │       ├── dark-bg-color.css
│   │   │       ├── dark-border.css
│   │   │       └── dark-color.css
│   │   ├── bg-size.css
│   │   ├── border-radius.css
│   │   ├── border-width.css
│   │   ├── container.css
│   │   ├── display.css
│   │   ├── flexbox.css
│   │   ├── grid.css
│   │   ├── height.css
│   │   ├── margin.css
│   │   ├── object.css
│   │   ├── padding.css
│   │   ├── responsive-container.css
│   │   ├── responsive-display.css
│   │   ├── responsive-flexbox.css
│   │   ├── responsive-grid.css
│   │   ├── responsive-height.css
│   │   ├── responsive-margin.css
│   │   ├── responsive-padding.css
│   │   ├── responsive-width.css
│   │   ├── shadow.css
│   │   ├── text-color.css
│   │   ├── typography.css
│   │   └── width.css
└── main.css