mirror/mini-css
1
0
Fork 0
mirror of https://github.com/Chalarangelo/mini.css.git synced 2025-01-17 12:58:13 +01:00
Code Issues Releases Wiki Activity

Updated README.md

Browse Source 
Added new image, shields from https://shields.io/ and updated existing information for the next release. Should look a whole lot better now.
This commit is contained in:
Angelos Chalaris 2017-04-06 12:54:45 +03:00
parent 5ffc8fa1ac
commit 7bc15236de
1 changed files with 49 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
README.md
View File

@ -1,58 +1,74 @@
# mini.css v2.1.0
## A minimal, responsive, style-agnostic CSS toolkit
# mini.css v2.1.1
A minimal, responsive, style-agnostic CSS framework
[![npm](https://img.shields.io/npm/v/mini.css.svg)](https://www.npmjs.com/package/mini.css)
[![license](https://img.shields.io/badge/license-MIT-yellow.svg)](https://github.com/Chalarangelo/mini.css/blob/master/LICENSE)
[![website](https://img.shields.io/badge/website-online-green.svg)](https://chalarangelo.github.io/mini.css/)
![Logo](/docs/page_thumb.png)
**mini.css** is a tiny CSS toolkit (under 7KB gzipped) that works well on most modern browsers and devices and allows you to customize it quickly and easily. It's written in Sass and tries to make use of HTML5 semantics and modern patterns to deal with common web design problems. You can learn all about using it, its modules and components, as well as see a live demo [here](https://chalarangelo.github.io/mini.css/).
**mini.css** is a lightweight CSS framework (under 7KB gzipped) designed with mobile devices and modern browsers in mind. Responsiveness, ease of use and customization are some of the main features of the framework, while accessibility and extensive documentation are some of the secondary focuses of the project. The framework is written using Sass, while most of its components are based on Flexbox.
## Setup
## Setup & usage
**mini.css** is available in both NPM and Bower:
You have 3 options when it comes to setting up **mini.css**:
npm install mini.css
1. [Use a package manager](#method-1-use-a-package-manager-recommended-) (recommended)
2. [Use GitCDN](#method-2-use-gitcdn)
3. [Use cdnjs](#method-3-use-cdnjs-preferred-for-older-releases-) (preferred for older releases)
bower install mini.css
For instructions on how to use, best practices, templates and other usage information, please visit the framework's [documentation](https://chalarangelo.github.io/mini.css/modules.html).
#### Method 1: Use a package manager (recommended)
To try out **mini.css** using the default flavor, copy and paste the following code inside your HTML page's `<head>` tag:
1. Install **mini.css** either from `npm` or `bower`.
```
npm install mini.css
bower install mini.css
```
2. Pick one of the available [flavors](https://chalarangelo.github.io/mini.css/flavors.html) and use its CSS file.
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/version/dist/mini-default.min.css">
3. Start working on your project. Detailed documentation is available on the framework's [website](https://chalarangelo.github.io/mini.css/modules.html), so be sure to check it out.
Replace `version` with a release tag (`v2.0.0` or later) from the [Releases page](https://github.com/Chalarangelo/mini.css/releases).
#### Method 2: Use GitCDN
Alternatively, you can use one of the other [flavors](https://chalarangelo.github.io/mini.css/flavors.html). Simply replace the final part of the URL with the flavor's CSS file (minified or not) and you're good to go!
**mini.css** is also hosted on [GitCDN](http://gitcdn.link/), an open-source service, so you can easily grab the latest release's distributables. Simply link to your preferred flavor inside your HTML page's `<head>` tag:
```html
<link rel="stylesheet" href="https://gitcdn.link/repo/Chalarangelo/mini.css/master/dist/{mini-flavor}.css" />
```
## Customization
Remember to replace `{mini-flavor}` with the flavor's name (e.g. `mini-default` or `mini-default.min` for the default flavor).
If you want to develop your own flavor or tweak an existing one, head over to the [Customization page](https://chalarangelo.github.io/mini.css/customization.html) to get started.
#### Method 3: Use cdnjs (preferred for older releases)
If you would rather use an older version of the framework, you should head over to [cdnjs](https://cdnjs.com/libraries/mini.css) for a list of releases and flavor files supplied with them.
## Flavors & customizaton
*Flavors* are one of the key features of **mini.css**, allowing you to customize your website's design and make your project stand out. We provide you with a few pre-defined [flavors](https://chalarangelo.github.io/mini.css/flavors.html) that might suit your needs and will help you figure out how to use the framework and create websites and apps with it.
But you can easily build you own flavors by editing a flavor file and customizing almost everything. For more information, head over to the [Customization page](https://chalarangelo.github.io/mini.css/customization/index.html) and build your own flavor the way you like it.
---
## Contributing
### Flavors
- Have you found a bug in the framework? Do you want to request a new feature or suggest a new flavor? Maybe found some documentation that is unclear or incomplete? Open an [issue](https://github.com/Chalarangelo/mini.css/issues/new) and we will be with you shortly.
To develop your own flavor:
- Have you developed a new flavor and want to share it with the world? Open an [issue](https://github.com/Chalarangelo/mini.css/issues/new) about it, so that we can link to your repository from the framework's documentation and let the world know. We will try to keep you posted on any new releases coming, so that you can update your flavor as necessary.
- Fork into your own repository.
- Add a flavor file in the `src/flavors` folder by duplicating an existing file and renaming it to whatever you want to name it. **Make sure there are no naming conflicts between your flavor and any of the existing flavors**.
- Edit the flavor file as you desire.
- Submit a pull request. Please provide a brief description of your flavor and, if possible, a Codepen or some screenshots showcasing some of the styles in it.
- Have you developed a module for the framework? Well, we don't really accept new modules right now, but if it works, we will certainly tell people that it's available. Open an [issue](https://github.com/Chalarangelo/mini.css/issues/new) about it and we will figure it out together.
To develop a module:
## Maintainers & contributors
- Module contribution guidelines are very strict at the moment. New modules will only be created upon request and **should always be in a new repository**, unless they are part of a Roadmap of a later version. Please submit an issue before developing a module or asking for new modules, as the discussion of said implementations is key to deciding the direction **mini.css** will follow in the future.
The team behind **mini.css** is as follows:
- Angelos Chalaris ([@chalarangelo](https://github.com/Chalarangelo)) - Sass archmage, project manager
To develop some other part of **mini.css**:
- Create an issue for anything else.
- If you make any changes, submit a pull request with as much information as possible about what you changed.
## Contributors
- Angelos Chalaris (@chalarangelo)
- Angeliki Daskalakis (@angiedaskalakis)
- Rory Primrose (@roryprimrose)
- Sandro Magi (@naasking)
Special thanks to these fine folks for helping in the development of **mini.css**:
- Angeliki Daskalakis ([@angiedaskalakis](https://github.com/AngieDaskalakis)) - Author of the [Sucroa](https://github.com/Chalarangelo/mini.css/blob/master/dist/mini-sucroa.css) flavor
- Rory Primrose ([@roryprimrose](https://github.com/roryprimrose)) - Code restructure
- Sandro Magi ([@naasking](https://github.com/naasking)) - [Multiple](https://github.com/Chalarangelo/mini.css/issues?q=is%3Aissue+author%3Anaasking) suggestions, ideas, bug reports
## License
The project is licensed under the [MIT License](https://github.com/Chalarangelo/mini.css/blob/master/LICENSE).
**mini.css** is an open-source framework and is licensed under the [MIT License](https://github.com/Chalarangelo/mini.css/blob/master/LICENSE).