1.0.0 • Published 1 year ago
limble v1.0.0
Quick install
Download the latest release
Clone the repo
git clone https://github.com/limble/limble.git
NPM
npm install limble
Yarn
yarn add limble
Import
After installation, you can import the CSS file into your project using this snippet:
@import 'limble/css/limble.css'
or
@import 'limble/css/limble.min.css'
or
You can import the CSS file in the <head>
tag of your desired HTML file.
<link type="text/css" rel="stylesheet" href="limble/css/limble.css" />
How to customize
Limble is based on CSS (SCSS). The output of all SCSS files is a single CSS file: limble.css
To adapt the framework to your personal needs, you need to change the values in the variables. The file is located in the folder limble/scss/utilities/variables.scss
Of course, if you have additional knowledge of Sass, other files are available for customize.
Structure
.
└── limble/
├── css/
│ ├── limble.css
│ ├── limble.css.map
│ └── limble.min.css
├── scss/
│ ├── backgrounds/
│ │ └── backgrounds.scss
│ ├── base/
│ │ └── reset.scss
│ ├── borders/
│ │ └── borders.scss
│ ├── components/
│ │ ├── button.scss
│ │ ├── card.scss
│ │ └── navbar.scss
│ ├── effects/
│ │ └── effects.scss
│ ├── filters/
│ │ └── filters.scss
│ ├── flex/
│ │ └── flex.scss
│ ├── grid/
│ │ └── grid.scss
│ ├── helpers/
│ │ └── colors.scss
│ ├── layout/
│ │ └── layout.scss
│ ├── responsive/
│ │ └── responsive.scss
│ ├── sizing/
│ │ └── sizing.scss
│ ├── spacing/
│ │ └── spacing.scss
│ ├── typography/
│ │ └── typography.scss
│ └── utilities/
│ ├── root.scss
│ └── variables.scss
└── limble.scss
Browser Support
Limble most features are compatible with earlier browser versions.
- Chrome
- Firefox
- Edge
- Opera
- Safari
😁 Who uses Internet Explorer?