ovh-ux / ovh-manager-webfont

[DEPRECATED] — Webfont use in legacy control panel

OVH font

To use please import less you want to use on app.less

You can see every available icons in dist/ovh-font.html.

Example

• Basic Usage

    <i class="ovh-font ovh-font-caddy"></i>

• Available size (0.6em, 0.8em, 1.2em, 1.4em, 1.6em, 1.8em, 2em)

    <i class="ovh-font ovh-font-caddy ovh-font-1x8"></i>
    <i class="ovh-font ovh-font-modem ovh-font-2x"></i>

Installation

Bower

bower install ovh-manager-webfont --save

NPM

npm install ovh-manager-webfont --save

Get the sources

    git clone https://github.com/ovh-ux/ovh-manager-webfont.git
    cd ovh-manager-webfont
    npm install && bower install

and include it

@import 'ovh-manager-webfont/dist/less/ovh-font.less';
@ovh-font-path: '../bower_components/ovh-font/dist/fonts';

You've developed a new cool feature? Fixed an annoying bug? We'd be happy to hear from you!

Have a look in CONTRIBUTING.md

Run the tests

npm test

Rules to create your own SVG

There are a few rules to follow in order for the rendering machine to not break your brand new SVG icon:

• 80*80px.
• No stroke, only fill. Only use filled figure, no paths with stroke.
• No overlapping paths, they should not even touch, use pathfinding if needed.
• Keep the number of points to a minimum. They tend to increase the file complexity and inhibit a good font conversion.
• Close your paths.

Build

• Install ttfautohint on Windows and Mac.
  • Download the binaries from http://www.freetype.org/ttfautohint/#download
  • Put them in your path.
• Put your svg icons in src/icons and run:

npm install # just required the first time
make build

Related links

• Contribute: https://github.com/ovh-ux/ovh-manager-webfont
• Report bugs: https://github.com/ovh-ux/ovh-manager-webfont/issues
• Get latest version: https://github.com/ovh-ux/ovh-manager-webfont

License

See https://github.com/ovh-ux/ovh-manager-webfont/blob/master/LICENSE