Skip to content

Releases: rfprod/material-design-icon-fonts-self-hosted-web

v.1.0.7

05 Oct 15:08
57edecd
Compare
Choose a tag to compare

Fixes

  • install woff2, eot-utils and wget before generating the iconfont;

What's Changed

  • docs(templates): update the issue templates, update the outdated actions by @rfprod in #10
  • ci(workflows): revise and improve the workflows by @rfprod in #11
  • ci(cleanup): remove jq installation by @rfprod in #12
  • docs(github): improve issue template by @rfprod in #13

Full Changelog: v.1.0.6...v.1.0.7

v.1.0.6

26 Mar 22:21
71e2de6
Compare
Choose a tag to compare

Self-hosted version generator of Google Material Design icon fonts for web apps

This is NOT a fork of the material design icons by Google, including only the font files for smaller distribution.

This is a generator script which fetches the iconfont from the original material design icons repo, converts otf fonts to woff, and makes it possible to use the self-hosted version of the latest material design icons for web.

Requirements

Supported operating systems

Core dependencies

Local script usage

Clone the repo, cd into the project directory and execute from root

$ bash src/generate-iconfont.sh

Fonts will be generated in the ./iconfont directory relative to the project root.

Material design icons

Material design icons are the official icon set from Google that are designed under the material design guidelines.

Developer guide

Read the developer guide on how to use the material design icons in your project.

Using the font collection (recommended way as per Google)

The iconfont folder contains pre-generated font files that can be included in a project. This is especially convenient for the web. However, it is generally better to link to the web font hosted on Google Fonts:

<link
  href="https://fonts.googleapis.com/icon?family=Material+Icons"
  rel="stylesheet"
/>

Using the self-hosted version

Install the package. Exexute

npm i --save-dev material-design-icon-fonts-self-hosted-web

or

yarn add -D material-design-icon-fonts-self-hosted-web

Angular

Add one of the folowing css files to the styles array of a corresponding app in angular.json depending on which version of the icons are intended to be used in the app.

Regular
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons.css"
],
Outlined
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-outlined.css"
],
Round
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-round.css"
],
Sharp
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-sharp.css"
],
TwoTone
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-twotone.css"
],

v.1.0.5

22 Jan 18:39
f5f7572
Compare
Choose a tag to compare

Self-hosted version generator of Google Material Design icon fonts for web apps

This is NOT a fork of the material design icons by Google, including only the font files for smaller distribution.

This is a generator script which fetches the iconfont from the original material design icons repo, converts otf fonts to woff, and makes it possible to use the self-hosted version of the latest material design icons for web.

Requirements

Supported operating systems

Core dependencies

Local script usage

Clone the repo, cd into the project directory and execute from root

$ bash src/generate-iconfont.sh

Fonts will be generated in the ./iconfont directory relative to the project root.

Material design icons

Material design icons are the official icon set from Google that are designed under the material design guidelines.

Developer guide

Read the developer guide on how to use the material design icons in your project.

Using the font collection (recommended way as per Google)

The iconfont folder contains pre-generated font files that can be included in a project. This is especially convenient for the web. However, it is generally better to link to the web font hosted on Google Fonts:

<link
  href="https://fonts.googleapis.com/icon?family=Material+Icons"
  rel="stylesheet"
/>

Using the self-hosted version

Install the package. Exexute

npm i --save-dev material-design-icon-fonts-self-hosted-web

or

yarn add -D material-design-icon-fonts-self-hosted-web

Angular

Add one of the folowing css files to the styles array of a corresponding app in angular.json depending on which version of the icons are intended to be used in the app.

Regular
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons.css"
],
Outlined
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-outlined.css"
],
Round
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-round.css"
],
Sharp
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-sharp.css"
],
TwoTone
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-twotone.css"
],

Support

The readme file in the project root contains all needed information regarding working with the project.

If there are any issues, GitHub issues can be leveraged to request support. However, there is no SLA regarding the response time.

Secutiry

Always inspect shell scripts before executing it on your machine.

v.1.0.4

01 Jan 21:37
0f36ab9
Compare
Choose a tag to compare

Self-hosted version generator of Google Material Design icon fonts for web apps

This is NOT a fork of the material design icons by Google, including only the font files for smaller distribution.

This is a generator script which fetches the iconfont from the original material design icons repo, converts otf fonts to woff, and makes it possible to use the self-hosted version of the latest material design icons for web.

Requirements

Supported operating systems

Core dependencies

Local script usage

Clone the repo, cd into the project directory and execute from root

$ bash src/generate-iconfont.sh

Fonts will be generated in the ./iconfont directory relative to the project root.

Material design icons

Material design icons are the official icon set from Google that are designed under the material design guidelines.

Developer guide

Read the developer guide on how to use the material design icons in your project.

Using the font collection (recommended way as per Google)

The iconfont folder contains pre-generated font files that can be included in a project. This is especially convenient for the web. However, it is generally better to link to the web font hosted on Google Fonts:

<link
  href="https://fonts.googleapis.com/icon?family=Material+Icons"
  rel="stylesheet"
/>

Using the self-hosted version

Install the package. Exexute

npm i --save-dev material-design-icon-fonts-self-hosted-web

or

yarn add -D material-design-icon-fonts-self-hosted-web

Angular

Add one of the folowing css files to the styles array of a corresponding app in angular.json depending on which version of the icons are intended to be used in the app.

Regular
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons.css"
],
Outlined
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-outlined.css"
],
Round
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-round.css"
],
Sharp
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-sharp.css"
],
TwoTone
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-twotone.css"
],

v.1.0.3

27 Dec 22:30
854933e
Compare
Choose a tag to compare

Self-hosted version generator of Google Material Design icon fonts for web apps

This is NOT a fork of the material design icons by Google, including only the font files for smaller distribution.

This is a generator script which fetches the iconfont from the original material design icons repo, converts otf fonts to woff, and makes it possible to use the self-hosted version of the latest material design icons for web.

Local script usage

Clone the repo, cd into the project directory and execute from root

$ bash src/generate-iconfont.sh

Fonts will be generated in the ./iconfont directory relative to the project root.

Material design icons

Material design icons are the official icon set from Google that are designed under the material design guidelines.

Developer guide

Read the developer guide on how to use the material design icons in your project.

Using the font collection (recommended way as per Google)

The iconfont folder contains pre-generated font files that can be included in a project. This is especially convenient for the web. However, it is generally better to link to the web font hosted on Google Fonts:

<link
  href="https://fonts.googleapis.com/icon?family=Material+Icons"
  rel="stylesheet"
/>

Using the self-hosted version

Install the package. Exexute

npm i --save-dev material-design-icon-fonts-self-hosted-web

or

yarn add -D material-design-icon-fonts-self-hosted-web

Angular

Add one of the folowing css files to the styles array of a corresponding app in angular.json depending on which version of the icons are intended to be used in the app.

Regular
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons.css"
],
Outlined
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-outlined.css"
],
Round
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-round.css"
],
Sharp
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-sharp.css"
],
TwoTone
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-twotone.css"
],

v.1.0.2

25 Dec 19:20
af025b8
Compare
Choose a tag to compare

Self-hosted version generator of Google Material Design icon fonts for web apps

This is NOT a fork of the material design icons by Google, including only the font files for smaller distribution.

This is a generator script which fetches iconfont from the original material design icons repo, converts otf fonts to woff, and makes it possible to use self-hosted version of the latest material design icons for web.

Fonts can be generated locally if this repo is cloned.

Local script usage

Clone the repo, cd into the project directory and execute from root

$ bash src/generate-iconfont.sh

Fonts will be generated in the ./iconfont directory relative to the project root.

Material design icons

Material design icons are the official icon set from Google that are designed under the material design guidelines.

Developer guide

Read the developer guide on how to use the material design icons in your project.

Using a font collection (recommended way as per Google)

The iconfont folder contains pre-generated font files that can be included in a project. This is especially convenient for the web; however, it is generally better to link to the web font hosted on Google Fonts:

<link
  href="https://fonts.googleapis.com/icon?family=Material+Icons"
  rel="stylesheet"
/>

Using self-hosted version

Install package.

npm i --save-dev material-design-icon-fonts-self-hosted-web
yarn add -D material-design-icon-fonts-self-hosted-web

Angular

Add to the styles array of a corresponding app in angular.json

Regular
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons.css"
],
Outlined
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-outlined.css"
],
Round
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-round.css"
],
Sharp
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-sharp.css"
],
TwoTone
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-twotone.css"
],

v.1.0.1

05 Nov 07:36
d3a2441
Compare
Choose a tag to compare

Self-hosted version generator of Google Material Design icon fonts for web apps

This is NOT a fork of the material design icons by Google, including only the font files for smaller distribution.

This is a generator script which fetches icon fonts from the original material design icons repo, converts otf fonts to woff, and makes it possible to use self-hosted version of the latest material design icons for web.

Fonts can be generated locally if this repo is cloned.

Local script usage

Clone the repo, cd into the project directory and execute from root

$ bash src/generate-iconfont.sh

Fonts will be generated in the ./iconfont directory relative to the project root.

Material design icons

Material design icons are the official icon set from Google that are designed under the material design guidelines.

Developer guide

Read the developer guide on how to use the material design icons in your project.

Using a font collection (recommended way as per Google)

The iconfont folder contains pre-generated font files that can be included in a project. This is especially convenient for the web; however, it is generally better to link to the web font hosted on Google Fonts:

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

Using self-hosted version

Install package.

npm i save-dev material-design-icon-fonts-self-hosted-web
yarn add -D material-design-icon-fonts-self-hosted-web

Angular

Add to the styles array of a corresponding app in angular.json

Regular
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons.css"
],
Outlined
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-outlined.css"
],
Round
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-round.css"
],
Sharp
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-sharp.css"
],
TwoTone
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-twotone.css"
],

v1.0.0

29 Aug 18:01
Compare
Choose a tag to compare

Self-hosted version generator of Google Material Design icon fonts for web apps

This is NOT a fork of the material design icons by Google, including only the font files for smaller distribution.

This is a generator script which fetches icon fonts from the original material design icons repo, converts otf fonts to woff, and makes it possible to use self-hosted version of the latest material design icons for web.

Using self-hosted version

Install package.

npm i save-dev material-design-icon-fonts-self-hosted-web
yarn add -D material-design-icon-fonts-self-hosted-web

I you use yarn install --ignore-scripts to install your project dependencies, fonts will not be downloaded and built by the script, and will not be usable.

Angular

Add to the styles array of a corresponding app in angular.json

Regular
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons.css"
],
Outlined
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-outlined.css"
],
Round
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-round.css"
],
Sharp
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-sharp.css"
],
TwoTone
"styles": [
  "node_modules/material-design-icon-fonts-self-hosted-web/iconfont/material-icons-twotone.css"
],