Skip to content

Commit

Permalink
Merge pull request #26 from michaelampr/release/v3.0.0
Browse files Browse the repository at this point in the history
Release/v3.0.0
  • Loading branch information
michaelampr authored Oct 22, 2020
2 parents 4c14878 + b6fe361 commit 2cc84c4
Show file tree
Hide file tree
Showing 906 changed files with 19 additions and 4,626 deletions.
Binary file removed .DS_Store
Binary file not shown.
107 changes: 19 additions & 88 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,113 +1,44 @@

<p align="center">
<img src="https://jam-icons.com/static/img/logo.svg">
<img src="https://jam-icons.com/logo.svg">
</p>

Jam icons is a set of icons designed for web projects, illustrations, print projects, etc. Shipped in JavaScript, font &amp; SVG versions. Licensed under MIT.
Jam icons is a set of SVG icons designed for web projects, illustrations, print projects, etc. Licensed under MIT.
Icons: [https://jam-icons.com](https://jam-icons.com)

## What's new?

Jam Icons v2 is a totally new version of this icons set. Read more below, especially if you are using the first version.
Each icon has been re-shaped with a 2px stroke on a 24x24 grid. I mainly used a 20x20 grid, letting 4px for extra design.
Recreating the entire set was huge, but needed. I wanted the set to be more reliable, more consistent, and bigger.


## Getting Started
This version is shipped in three formats: JavaScript, SVG and font and contains more than 890 icons.
### Javascript
#### Usage
The recommended approach. It turns your tag into a clean svg markup. You just have to use the `data-jam` attribute inside a `span` or a `whatever` tag to select your icon (The attributes are listed below). So if you write:
```html
<span class="your-custom-class" data-jam="backpack" data-fill="#222"></span>
```

It becomes:
```html
<svg class="jam jam-backpack your-custom-class" data-fill="#222">[...]</svg>
```


#### Install
##### Via CDN (recommended)

```html
<script src="https://unpkg.com/jam-icons/js/jam.min.js"></script>
```
##### Via NPM

```
$ npm install jam-icons
```
##### Manually
Just hit the **download** button and use a `script` tag like below:
```html
<script src="/path/to/js/jam.min.js"></script>
```


#### Attributes

`data-jam` (required) *The icon you want to use, e.g `data-jam="backpack"`*

`data-fill` (optional) *RGB or Hexadecimal, e.g `data-fill="#F5C25A"`*
Support for font and JS has been dropped to focus on SVG only (v3). The idea is to simplify the current package, believing that SVG / inline SVG is the principal way to go when it comes to web icons.

`data-width` (optional) *Integer, e.g `data-width="32"`*
## Usage

`data-height` (optional) *Integer, e.g `data-height="32"`*
#### Full list

The complete icons list is available on [https://jam-icons.com](https://jam-icons.com).
You'll be able to either download the SVG file or copy the markup when hovering an icon.

#### More infos
#### Download Set

You can easily customize your icons using css, such as width, height and color. I provided the `data-fill`, `data-width` and `data-height` attributes to support a direct way to color the icon, in the case you do not want to add extra lines of css.


### CSS / Font

#### Usage
The alternative approach. You load the CSS stylesheet and use Jam icons as a font icons. You just have to use the `jam` class followed by the name of the icon you want to use prefixed by `jam-`, like below:
```html
<span class="jam jam-backpack"></span>
```
#### Install
##### Via CDN (recommended)
```html
<link rel="stylesheet" href="https://unpkg.com/jam-icons/css/jam.min.css">
```
##### Via NPM
```
$ npm install jam-icons
```
##### Manually
Just hit the **download** button and use a `link` tag like below:
```html
<link rel="stylesheet" type="text/css" href="/path/to/css/jam.min.css">
```
Hit the **download** button to download the full set.

## Support

### SVGS
#### Usage
The complete set as independents SVGs files is available too.
Hit the **download** button to download it.
If you have some icons ideas, please open a new **issue**. Thanks for your support!

## Compatibility

## Complete icons list
You can see the complete icons list on [https://jam-icons.com](https://jam-icons.com)
#### Version 2.0.0

## Support
If you have some icons ideas, please open a new **issue**, add a `icons-request` label and make your proposal.
Likewise, if you see a bug or something that needs to be fixed, please open a new **issue** too with a `bug` label.

## Compatibility
#### Version 1.X.X
Unfortunately, the v2 is a major version including major breaking changes: I kept the icons names availables in the v1 but the shapes are totally new. If you give it a go, try with JavaScript ✌️ <br/>
The v1 is still available on [https://jam-icons.com/v1/](https://jam-icons.com/v1/)
The V2 is still available at [https://v2.jam-icons.com/](https://v2.jam-icons.com/)

## Changelog

Jam icons is following the [Semantic Versioning](http://semver.org/) with the MAJOR.MINOR.PATCH format.
- V2.0.0 - New release with 896 icons

- V3.0.0 - Set update
- V2.0.0 - New release with 896 icons
- V1.0.72 - Optimizing SVGs
- V1.0.0 - First release with 422 icons

## License

This project is licensed under [MIT](https://opensource.org/licenses/MIT)
Loading

0 comments on commit 2cc84c4

Please sign in to comment.