@mskcc/icons
TypeScript icon, indicating that this package has built-in type declarations

2.4.5 • Public • Published

MSK Icons

Font files built with ligatures and Icon SVG sources

dist/svg/* SVG files
dist/msk-icon.min.css css stylesheet
dist/msk-icon.scss scss stylesheet
$msk--icon-font-path variable for the font path

Usage

  • Use the class msk-icon in a span element to point to the font
  • The text inside the span will point to the correct icon
<span class="msk-icon">add</span>

Getting Started

npm install @mskcc/icons

Add icon stylesheet in your project

Add the msk-icon stylesheet to your project.

css

@import '@mskcc/icon/dist/msk-icon.min.css';

scss

// $msk-icon-font-path is the variable for the font path

@import '@mskcc/icons/dist/msk-icon.scss';

cdn

<head>
  <link
    href="https://cdn.jsdelivr.net/npm/@mskcc/icons@latest/dist/msk-icon.min.css"
    rel="stylesheet"
  />
</head>

Development Environment

Java is required for icon packaging. Jenv is a utility that makes setting the JAVA_HOME variable easier.

// After running each script, please follow the directions they provide
brew install maven jenv openjdk@11
jenv init -
// Run below within icons directory
mvn install
mvn package
gulp build

Codepoints

Each icon font has a reserved codepoints index that points to a unicode set, which is identified in reserved-codepoints.json. As a new icon gets added, we will assign the next available codepoints index.

Adding new icons to the font file

  • Add SVG files to src folder
  • Run pnpm run build and the files will render in dist

Reserving Codepoints

This task solidifies the space for the specified icon.

  • Run pnpm run build:codepoints to add the new icon codepoints index to the reserve list.
  • Commit the changes to reserved-codepoints.json

Readme

Keywords

none

Package Sidebar

Install

npm i @mskcc/icons

Weekly Downloads

63

Version

2.4.5

License

UNLICENSED

Unpacked Size

693 kB

Total Files

415

Last publish

Collaborators

  • nierococ
  • chapmanm
  • walee
  • informatix9
  • jamesmsk