Build system to create css files with inline images and svgs, and svg symbol files.
This commit is contained in:
parent
f1fcfaec06
commit
ab294b16f8
|
@ -0,0 +1,4 @@
|
||||||
|
build
|
||||||
|
node_modules
|
||||||
|
|
||||||
|
|
10
README.md
10
README.md
|
@ -9,6 +9,16 @@ If there is an altcoin you’re looking for that hasn’t been included, please
|
||||||
|
|
||||||
![hero](img/hero@2x.jpg)
|
![hero](img/hero@2x.jpg)
|
||||||
|
|
||||||
|
## Building
|
||||||
|
|
||||||
|
The build system requires node and npm to be installed on your system. After they are installed you can install the npm dependencies with
|
||||||
|
|
||||||
|
npm install
|
||||||
|
|
||||||
|
You can then build with
|
||||||
|
|
||||||
|
npm run build
|
||||||
|
|
||||||
|
|
||||||
## Donate
|
## Donate
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,65 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>cryptocurrency-icons example build usage</title>
|
||||||
|
<link rel="stylesheet" href="dist/32/black.css">
|
||||||
|
<link rel="stylesheet" href="dist/32/color.css">
|
||||||
|
<link rel="stylesheet" href="dist/32/icon.css">
|
||||||
|
<link rel="stylesheet" href="dist/32/white.css">
|
||||||
|
<link rel="stylesheet" href="dist/128/black.css">
|
||||||
|
<link rel="stylesheet" href="dist/128/color.css">
|
||||||
|
<link rel="stylesheet" href="dist/128/icon.css">
|
||||||
|
<link rel="stylesheet" href="dist/128/white.css">
|
||||||
|
<link rel="stylesheet" href="dist/svg/black.css">
|
||||||
|
<link rel="stylesheet" href="dist/svg/color.css">
|
||||||
|
<link rel="stylesheet" href="dist/svg/icon.css">
|
||||||
|
<link rel="stylesheet" href="dist/svg/white.css">
|
||||||
|
<!--[if IE]>
|
||||||
|
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
||||||
|
<![endif]-->
|
||||||
|
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body id="home">
|
||||||
|
|
||||||
|
<table>
|
||||||
|
<tr>
|
||||||
|
<th></th>
|
||||||
|
<th> Black </th>
|
||||||
|
<th> Color </th>
|
||||||
|
<th> Icon </th>
|
||||||
|
<th> White </th>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th> 32 </th>
|
||||||
|
<td><div class="crypto-icon-32 crypto-icon-32-black crypto-icon-32-black-btc"> </div></td>
|
||||||
|
<td><div class="crypto-icon-32 crypto-icon-32-color crypto-icon-32-color-btc"> </div></td>
|
||||||
|
<td><div class="crypto-icon-32 crypto-icon-32-icon crypto-icon-32-icon-btc"> </div></td>
|
||||||
|
<td><div style="background-color: black" class="crypto-icon-32 crypto-icon-32-white crypto-icon-32-white-btc"> </div></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th> 128 </th>
|
||||||
|
<td><div class="crypto-icon-128 crypto-icon-128-black crypto-icon-128-black-btc"> </div></td>
|
||||||
|
<td><div class="crypto-icon-128 crypto-icon-128-color crypto-icon-128-color-btc"> </div></td>
|
||||||
|
<td><div class="crypto-icon-128 crypto-icon-128-icon crypto-icon-128-icon-btc"> </div></td>
|
||||||
|
<td><div style="background-color: black" class="crypto-icon-128 crypto-icon-128-white crypto-icon-128-white-btc"> </div></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th> css svg </th>
|
||||||
|
<td><div class="crypto-icon-128 crypto-icon-svg-black crypto-icon-svg-black-btc"> </div></td>
|
||||||
|
<td><div class="crypto-icon-128 crypto-icon-svg-color crypto-icon-svg-color-btc"> </div></td>
|
||||||
|
<td><div class="crypto-icon-128 crypto-icon-svg-icon crypto-icon-svg-icon-btc"> </div></td>
|
||||||
|
<td><div style="background-color: black" class="crypto-icon-128 crypto-icon-svg-white crypto-icon-svg-white-btc"> </div></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th> css xlink </th>
|
||||||
|
<td><svg class="crypto-icon-128" role="img"><use xlink:href="dist/svg/black.svg#agi"> </use></svg></td>
|
||||||
|
<td><svg class="crypto-icon-128" role="img"><use xlink:href="dist/svg/color.svg#agi"> </use></svg></td>
|
||||||
|
<td><svg class="crypto-icon-128" role="img"><use xlink:href="dist/svg/icon.svg#agi"> </use></svg></td>
|
||||||
|
<td><svg style="background-color: black" class="crypto-icon-128" role="img"><use xlink:href="dist/svg/white.svg#agi"> </use></svg></td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -0,0 +1,13 @@
|
||||||
|
.crypto-icon-32 {
|
||||||
|
display: inline-block;
|
||||||
|
width: 32px;
|
||||||
|
height: 32px;
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.crypto-icon-128 {
|
||||||
|
display: inline-block;
|
||||||
|
width: 128px;
|
||||||
|
height: 128px;
|
||||||
|
background-size: cover;
|
||||||
|
}
|
File diff suppressed because it is too large
Load Diff
70
package.json
70
package.json
|
@ -2,15 +2,81 @@
|
||||||
"name": "cryptocurrency-icons",
|
"name": "cryptocurrency-icons",
|
||||||
"description": "A set of icons for all the main cryptocurrencies and altcoins, in a range of styles and sizes.",
|
"description": "A set of icons for all the main cryptocurrencies and altcoins, in a range of styles and sizes.",
|
||||||
"version": "0.0.1",
|
"version": "0.0.1",
|
||||||
"keywords": ["cryptocurrency", "icon"],
|
"keywords": [
|
||||||
|
"cryptocurrency",
|
||||||
|
"icon"
|
||||||
|
],
|
||||||
"homepage": "https://github.com/cjdowner/cryptocurrency-icons",
|
"homepage": "https://github.com/cjdowner/cryptocurrency-icons",
|
||||||
"author": {
|
"author": {
|
||||||
"name": "Christopher Downer",
|
"name": "Christopher Downer",
|
||||||
"web": "https://github.com/cjdowner"
|
"web": "https://github.com/cjdowner"
|
||||||
},
|
},
|
||||||
|
"scripts": {
|
||||||
|
"minify-images:32:black": "imagemin '32/black/*' --out-dir='build/32/black'",
|
||||||
|
"minify-images:32:color": "imagemin '32/color/*' --out-dir='build/32/color'",
|
||||||
|
"minify-images:32:icon": "imagemin '32/icon/*' --out-dir='build/32/icon'",
|
||||||
|
"minify-images:32:white": "imagemin '32/white/*' --out-dir='build/32/white'",
|
||||||
|
"minify-images:32": "npm run minify-images:32:black && npm run minify-images:32:color && npm run minify-images:32:icon && npm run minify-images:32:white",
|
||||||
|
"minify-images:128:black": "imagemin '128/black/*' --out-dir='build/128/black'",
|
||||||
|
"minify-images:128:color": "imagemin '128/color/*' --out-dir='build/128/color'",
|
||||||
|
"minify-images:128:icon": "imagemin '128/icon/*' --out-dir='build/128/icon'",
|
||||||
|
"minify-images:128:white": "imagemin '128/white/*' --out-dir='build/128/white'",
|
||||||
|
"minify-images:128": "npm run minify-images:128:black && npm run minify-images:128:color && npm run minify-images:128:icon && npm run minify-images:128:white",
|
||||||
|
"minify-images:svg:black": "imagemin 'svg/black/*' --out-dir='build/svg/black'",
|
||||||
|
"minify-images:svg:color": "imagemin 'svg/color/*' --out-dir='build/svg/color'",
|
||||||
|
"minify-images:svg:icon": "imagemin 'svg/icon/*' --out-dir='build/svg/icon'",
|
||||||
|
"minify-images:svg:white": "imagemin 'svg/white/*' --out-dir='build/svg/white'",
|
||||||
|
"minify-images:svg": "npm run minify-images:svg:black && npm run minify-images:svg:color && npm run minify-images:svg:icon && npm run minify-images:svg:white",
|
||||||
|
"minify-images": "npm run minify-images:32 && npm run minify-images:128 && npm run minify-images:svg",
|
||||||
|
"imacss:32:black": "mkdirp dist/32 && imacss 'build/32/black/*' blank_option crypto-icon-32-black > build/32/black.css",
|
||||||
|
"imacss:32:color": "mkdirp dist/32 && imacss 'build/32/color/*' blank_option crypto-icon-32-color > build/32/color.css",
|
||||||
|
"imacss:32:icon": "mkdirp dist/32 && imacss 'build/32/icon/*' blank_option crypto-icon-32-icon > build/32/icon.css",
|
||||||
|
"imacss:32:white": "mkdirp dist/32 && imacss 'build/32/white/*' blank_option crypto-icon-32-white > build/32/white.css",
|
||||||
|
"postimacss:32:black": "concat defaults.css build/32/black.css > dist/32/black.css",
|
||||||
|
"postimacss:32:color": "concat defaults.css build/32/color.css > dist/32/color.css",
|
||||||
|
"postimacss:32:icon": "concat defaults.css build/32/icon.css > dist/32/icon.css",
|
||||||
|
"postimacss:32:white": "concat defaults.css build/32/white.css > dist/32/white.css",
|
||||||
|
"imacss:32": "npm run imacss:32:black && npm run imacss:32:color && npm run imacss:32:icon && npm run imacss:32:white",
|
||||||
|
"imacss:128:black": "mkdirp dist/128 && imacss 'build/128/black/*' blank_option crypto-icon-128-black > build/128/black.css",
|
||||||
|
"imacss:128:color": "mkdirp dist/128 && imacss 'build/128/color/*' blank_option crypto-icon-128-color > build/128/color.css",
|
||||||
|
"imacss:128:icon": "mkdirp dist/128 && imacss 'build/128/icon/*' blank_option crypto-icon-128-icon > build/128/icon.css",
|
||||||
|
"imacss:128:white": "mkdirp dist/128 && imacss 'build/128/white/*' blank_option crypto-icon-128-white > build/128/white.css",
|
||||||
|
"postimacss:128:black": "concat defaults.css build/128/black.css > dist/128/black.css",
|
||||||
|
"postimacss:128:color": "concat defaults.css build/128/color.css > dist/128/color.css",
|
||||||
|
"postimacss:128:icon": "concat defaults.css build/128/icon.css > dist/128/icon.css",
|
||||||
|
"postimacss:128:white": "concat defaults.css build/128/white.css > dist/128/white.css",
|
||||||
|
"imacss:128": "npm run imacss:128:black && npm run imacss:128:color && npm run imacss:128:icon && npm run imacss:128:white",
|
||||||
|
"imacss:svg:black": "mkdirp dist/svg && imacss 'build/svg/black/*' blank_option crypto-icon-svg-black > build/svg/black.css",
|
||||||
|
"imacss:svg:color": "mkdirp dist/svg && imacss 'build/svg/color/*' blank_option crypto-icon-svg-color > build/svg/color.css",
|
||||||
|
"imacss:svg:icon": "mkdirp dist/svg && imacss 'build/svg/icon/*' blank_option crypto-icon-svg-icon > build/svg/icon.css",
|
||||||
|
"imacss:svg:white": "mkdirp dist/svg && imacss 'build/svg/white/*' blank_option crypto-icon-svg-white > build/svg/white.css",
|
||||||
|
"postimacss:svg:black": "concat defaults.css build/svg/black.css > dist/svg/black.css",
|
||||||
|
"postimacss:svg:color": "concat defaults.css build/svg/color.css > dist/svg/color.css",
|
||||||
|
"postimacss:svg:icon": "concat defaults.css build/svg/icon.css > dist/svg/icon.css",
|
||||||
|
"postimacss:svg:white": "concat defaults.css build/svg/white.css > dist/svg/white.css",
|
||||||
|
"imacss:svg": "npm run imacss:svg:black && npm run imacss:svg:color && npm run imacss:svg:icon && npm run imacss:svg:white",
|
||||||
|
"imacss": "npm run imacss:32 && npm run imacss:128 && npm run imacss:svg",
|
||||||
|
"svgstore:black": "mkdirp dist/svg && svgstore -o dist/svg/black.svg build/svg/black/*.svg",
|
||||||
|
"svgstore:color": "mkdirp dist/svg && svgstore -o dist/svg/color.svg build/svg/color/*.svg",
|
||||||
|
"svgstore:icon": "mkdirp dist/svg && svgstore -o dist/svg/icon.svg build/svg/icon/*.svg",
|
||||||
|
"svgstore:white": "mkdirp dist/svg && svgstore -o dist/svg/white.svg build/svg/white/*.svg",
|
||||||
|
"svgstore": "npm run svgstore:black && npm run svgstore:color && npm run svgstore:icon && npm run svgstore:white",
|
||||||
|
"clean": "rimraf build && rimraf dist",
|
||||||
|
"build": "npm run minify-images && npm run imacss && npm run svgstore",
|
||||||
|
"prebuild": "npm run clean"
|
||||||
|
},
|
||||||
"repository": {
|
"repository": {
|
||||||
"type": "git",
|
"type": "git",
|
||||||
"url": "https://github.com/cjdowner/cryptocurrency-icons.git"
|
"url": "https://github.com/cjdowner/cryptocurrency-icons.git"
|
||||||
},
|
},
|
||||||
"license": "CC0-1.0"
|
"license": "CC0-1.0",
|
||||||
|
"devDependencies": {},
|
||||||
|
"dependencies": {
|
||||||
|
"concat": "^1.0.3",
|
||||||
|
"imacss": "^1.0.0",
|
||||||
|
"imagemin-cli": "^3.0.0",
|
||||||
|
"mkdirp": "^0.5.1",
|
||||||
|
"rimraf": "^2.6.2",
|
||||||
|
"svgstore-cli": "^1.3.1"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue