As of jsPanel version 2.2.0 a small iconfont is included. The primary idea was to get rid of the old icon sprite for the controls in the header section. Currently jsGlyph has only a very basic set of glyphs. But from time to time I plan to add more glyphs.

The following glyphs are currently available in jsGlyph:

How to use:

1. Upload the jsGlyph iconfont to your website (Already done if you uploaded the complete jsPanel folder)

2. Include necessary CSS (Already done if you included jquery.jspanel.css)

   // load iconfont using @font-face in your css file
   @font-face {
       font-family: 'jsglyphregular';
       src: url('fonts/jsglyph.eot');
       src: url('fonts/jsglyph.eot?#iefix') format('embedded-opentype'),
            url('fonts/jsglyph.woff2') format('woff2'),
            url('fonts/jsglyph.woff') format('woff'),
            url('fonts/jsglyph.ttf') format('truetype'),
            url('fonts/jsglyph.svg#jsglyphregular') format('svg');
       font-weight: normal;
       font-style: normal;
   }
   
   

3. Modify your style sheet (not necessary if you included jquery.jspanel.css)

   // assign the font-family to appropriate elements ...
   .jsglyph{ font-family: "jsglyphregular"; }
   
   // add css rules as needed ...
   .jsglyph-remove:before{ content: "\e007"; } /* unicode  */
   .jsglyph-minimize:before{ content: "\e001"; }
   .jsglyph-maximize:before{ content: "\e002"; }
   .jsglyph-chevron-up:before{ content: "\e003"; }
   .jsglyph-chevron-down:before{ content: "\e004"; }
   .jsglyph-normalize:before{ content: "\e005"; }
   .jsglyph-circle2-exclamationmark:before{ content:"\e02c"; }
   

4. Use class names or inline styles with unicode encodings:

   <span class="jsglyph jsglyph-minimize"></span>
   // or
   <span style="font-family: 'jsglyphregular';">&#xe001;</span>
   

   Results in: 