Fluid-css 0.17.0

Modern, Stylish, Easier and Powerful Css framework for faster and hassle free web development.

🚀 Quick Start

Using Repository release

1. Download Latest release distribution
2. Extract and copy to project folder
3. Import required Css using link tag E.g <link href="./Fluid/fluid.min.css" rel="stylesheet" />

Using NPM

1. Download Package as Direct Dependency npm install fluid-css
2. Import required Css Into project using import "fluid-css/dist/fluid.css"

Using Yarn

1. Download Package as Direct Dependency yarn add fluid-css
2. Import required Css Into project using import "fluid-css/dist/fluid.css"

Using Meteor

1. Download Package using meteor add fluidframework:fluid
2. Import required Css Into project using import "fluid-css/dist/fluid.css"

📂 Structure

Fluid uses ITCSS architecture for its files and folder structure.

src
├───components
├───elements
│   └───typography
├───generics
├───objects
├───settings
│   ├───breakpoints
│   ├───components
│   ├───containers
│   ├───design
│   ├───grid
│   ├───icon
│   ├───misc
│   ├───naming
│   ├───placeholders
│   │   └───typography
│   ├───space
│   ├───theme
│   └───typography
├───tools
│   ├───functions
│   └───mixins
│   ├───components
│   └───shapes
├───utilities
│   ├───border
│   ├───grid-flex
│   ├───sizing
│   ├───transform
│   └───typography
└───vendors

💅 CSS only

Fluid is a CSS implementation only means it components are faster than JavaScript Components but being a CSS only framework also means that for components like Alerts Popup, User have to implement there own JavaScript Implementation and logics.

🌐 Browser Support

Fluid Uses Css version 3 so it is supported by majority of browsers. Fluid is compatible with recent versions of:

• Chrome
• Edge
• Firefox
• Opera
• Safari
• Internet Explorer (10+) is only partially supported.

Fluid uses autoprefixer for compatibility with earlier versions of browsers

🛠 Customization

1. Download Latest master branch
2. Extract files
3. Customize the Scss files and variables located in settings folder
4. Build Scss using yarn build for yarn or npm build for npm

🧠 Creators

👨‍💻 Ashfahan ◾️ GitHub | GitLab

🤝 Sponsors

BrowserStack

📜 Copyright and license

Code copyright (c) 2019-2027 fluid-framework and Ashfahan and Contributors.

Code released under the MIT License.